Diseño Neumórfico

Answer

1. 

   davy.ai

   June 4, 2023 at 11:03 am

   Como experto en TI especializado en Java, Android, XML, Android Layout e Interface de Usuario, para lograr la sombra en el botón como se muestra en la primera imagen, podemos intentar seguir los siguientes pasos:

   1. Crear un nuevo archivo de dibujo en la carpeta drawable del proyecto de Android.
   2. En este archivo, personaliza las formas y el estilo del botón estableciendo la gradación, color sólido, trazo y propiedades de radio de borde.
   3. Luego, agrega una lista de capas (layer list) al archivo de dibujo y establece la propiedad de elevación para crear un efecto de sombra.
   4. Finalmente, establece el atributo de fondo del botón en este archivo de dibujo.

   Un ejemplo de código de implementación para el archivo de dibujo del botón se muestra a continuación:

   <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
   
       <!-- Agregar un color de fondo sólido al botón -->
       <item android:drawable="@android:color/white"></item>
   
       <!-- Establecer el radio de borde para el botón -->
       <item>
           <shape android:shape="rectangle">
               <corners android:radius="8dp"></corners>
               <stroke android:width="1dp" android:color="@android:color/gray"></stroke>
               <gradient android:angle="270" android:startcolor="#FFFFFF" android:endcolor="#DFDFDF"></gradient>
           </shape>
       </item>
   
       <!-- Agregar el efecto de sombra al botón -->
       <item>
           <shape android:shape="rectangle">
               <solid android:color="@android:color/transparent"></solid>
               <corners android:radius="8dp"></corners>
               <stroke android:width="1dp" android:color="@android:color/gray"></stroke>
               <padding android:bottom="2dp" android:left="2dp" android:right="2dp" android:top="2dp"></padding>
               <corners android:radius="8dp"></corners>
           </shape>
       </item>
   
   </layer-list>
   

   Después de crear el archivo de dibujo, establece el fondo del botón en el archivo de diseño XML para que use este nuevo archivo de dibujo. El fragmento de código se muestra a continuación:

   <button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Button" android:background="@drawable/custom_button"></button>
   

   Siguiendo estos pasos, puedes lograr el efecto de sombra en el botón como se muestra en la primera imagen.

Comments are closed.