Join FlipAndroid.COM Telegram Group: https://t.me/joinchat/F_aqThGkhwcLzmI49vKAiw


Efecto de material en el botón con el color de fondo

Estoy usando la biblioteca de soporte de Android v21.

He creado un botón con el color de fondo de encargo. Los efectos de diseño de material como ondulación, revelar se han ido (excepto la elevación al hacer clic) cuando utilizo el color de fondo de la espalda.

  • Android WebView Inyectar Javascript antes de html cargado
  • Protege el acceso a la URL de la API mediante hash en la aplicación para Android
  • Retrofit y caracteres Slash en PATH
  • Uso de SlidingPaneLayout de Android con ViewPager
  • TabHost con Fragmentos y FragmentActivity
  • Reemplazando Adapter.getView
  • <Button style="?android:attr/buttonStyleSmall" android:background="?attr/colorPrimary" android:textColor="@color/white" android:textAllCaps="true" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Button1" /> 

    Fondo Lo siguiente es un botón normal y los efectos están funcionando bien.

     <Button style="?android:attr/buttonStyleSmall" android:layout_width="fill_parent" android:layout_height="wrap_content" android:textAllCaps="true" android:text="Button1" /> 

    Botón predeterminado

  • Android SDK 22 - Problemas de representación de SearchView
  • Aplicación de Android que se estrella (fragmento y xml onclick)
  • DialogFragment y botón Atrás
  • UnknownHostException al acceder a api.twitter.com
  • ¿Hay alguna manera de agregar parámetros de consulta a cada solicitud con Retrofit 2?
  • Cómo grabar el video usando la vista previa de la cámara en TextureView
  • 14 Solutions collect form web for “Efecto de material en el botón con el color de fondo”

    Cuando usas android:background , estás reemplazando gran parte del estilo y la apariencia de un botón con un color en blanco.

    Actualización: A partir de la versión 23.0.0 de AppCompat , hay un nuevo estilo Widget.AppCompat.Button.Colored que utiliza el colorButtonNormal su tema para el color desactivado y colorAccent para el color habilitado.

    Esto le permite aplicarlo a su botón directamente a través de

     <Button ... style="@style/Widget.AppCompat.Button.Colored" /> 

    Si necesitas un colorButtonNormal o colorAccent , puedes usar un ThemeOverlay como se explica en este pro-tip and android:theme en el botón.

    Respuesta anterior

    Puede utilizar un drawable en su directorio v21 para su fondo como:

     <?xml version="1.0" encoding="utf-8"?> <ripple xmlns:android="http://schemas.android.com/apk/res/android" android:color="?attr/colorControlHighlight"> <item android:drawable="?attr/colorPrimary"/> </ripple> 

    Esto garantizará que su color de fondo sea ?attr/colorPrimary y tenga la animación de ondulación predeterminada usando el valor predeterminado ?attr/colorControlHighlight (que también puede establecer en su tema si lo desea).

    Nota: tendrás que crear un selector personalizado para menos de v21:

     <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@color/primaryPressed" android:state_pressed="true"/> <item android:drawable="@color/primaryFocused" android:state_focused="true"/> <item android:drawable="@color/primary"/> </selector> 

    Asumiendo que tiene algunos colores que desea para el estado predeterminado, presionado y enfocado. Personalmente, tomé una captura de pantalla de una ola a medio camino a través de ser seleccionado y sacó el estado principal / enfocado fuera de eso.

    Hay otra solución simple para proporcionar fondo personalizado para los botones "planos" mientras mantiene sus efectos "materiales".

    1. Coloque su botón en ViewGroup con el fondo deseado establecido allí
    2. Set selectableItemBackground del tema actual como fondo para su botón (API> = 11)

    Es decir:

     <FrameLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@color/blue"> <Button style="?android:attr/buttonStyleSmall" android:background="?android:attr/selectableItemBackground" android:textColor="@android:color/white" android:textAllCaps="true" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Button1" /> </FrameLayout> 

    Puede utilizarse para botones planos , funciona en API> = 11 y obtendrá efecto de rizo en> = 21 dispositivos, manteniendo botones regulares en pre-21 hasta que AppCompat se actualice para admitir ripple allí también.

    También puede utilizar selectableItemBackgroundBorderless para> = 21 botones solamente.

    Aquí está una manera simple y hacia atrás compatible de entregar el efecto de la ondulación a los botones levantados con el fondo de encargo.

    Tu diseño debería ser como este

     <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/my_custom_background" android:foreground="?android:attr/selectableItemBackground"/> 

    Me encontré con este problema hoy en día jugando con la biblioteca v22.

    Suponiendo que está utilizando estilos, puede establecer la propiedad colorButtonNormal y los botones utilizarán ese color de forma predeterminada.

     <style name="AppTheme" parent="BaseTheme"> <!-- Customize your theme here. --> <item name="colorPrimary">@color/primaryColor</item> <item name="colorPrimaryDark">@color/primaryColorDark</item> <item name="colorAccent">@color/accentColor</item> <item name="colorButtonNormal">@color/primaryColor</item> </style> 

    Fuera de eso usted podría todavía hacer un estilo para el botón entonces utilizar eso por el botón si usted necesitó un surtido de colores (no ha probado, apenas especulando).

    Recuerde agregar android: antes de los nombres de elemento en su estilo v21 .

    Con AppCompat (22.1.1+) puedes añadir un estilo como este:

     <style name="MyGreenButton"> <item name="colorButtonNormal">#009900</item> </style> 

    Y úselo simplemente aplicando el estilo:

     <android.support.v7.widget.AppCompatButton style="@style/MyGreenButton" android:layout_width="match_width" android:layout_height="wrap_content" android:text="A Green Button" /> 

    Programáticamente cambiando el color, encontré que la única manera de actualizar el color (en API 15 o 16) era usar la "lista de tonos de fondo" en su lugar. Y no quita la animación radial agradable en los dispositivos de la API 21:

     ColorStateList colorStateList = new ColorStateList(new int[][] {{0}}, new int[] {0xFF009900}); // 0xAARRGGBB button.setSupportBackgroundTintList(colorStateList); 

    Debido a que button.setBackground(...) y button.getBackground().mutate().setColorFilter(...) no cambian el color del botón en API 15 y 16 como lo hacen en la API 21.

    La respuesta de @ ianhanniballake es absolutamente correcta y simple. Pero me llevó pocos días entenderlo. Para alguien que no entiende su respuesta, aquí está más detallada la aplicación

     <Button android:id="@+id/btn" style="@style/MaterialButton" ... /> <style name="MaterialButton" parent="Widget.AppCompat.Button.Colored"> <item name="android:theme">@style/Theme.MaterialButton</item> ... </style> <style name="Theme.MaterialButton" parent="YourTheme"> <item name="colorAccent">@color/yourAccentColor</item> <item name="colorButtonNormal">@color/yourButtonNormalColor</item> </style> 

    O ===

     <Button android:id="@+id/btn" style="@style/Widget.AppCompat.Button.Colored" android:theme="Theme.MaterialButton" /> <style name="Theme.MaterialButton" parent="YourTheme"> <item name="colorAccent">@color/yourAccentColor</item> <item name="colorButtonNormal">@color/yourButtonNormalColor</item> </style> 

    Utilicé el backgroundTint y el primero plano:

     <Button android:layout_width="match_parent" android:layout_height="40dp" android:backgroundTint="@color/colorAccent" android:foreground="?android:attr/selectableItemBackground" android:textColor="@android:color/white" android:textSize="10sp"/> 

    v22.1 de appcompat-v7 introdujo algunas nuevas posibilidades. Ahora es posible asignar un tema específico sólo a una vista.

    Uso descontinuado de la aplicación: tema para la barra de herramientas de estilo. Ahora puedes usar android: tema para las barras de herramientas en todos los dispositivos de nivel API 7 y superiores y android: soporte de temas para todos los widgets en los dispositivos de nivel 11 de API y superiores.

    Así que en lugar de configurar el color deseado en un tema global, creamos uno nuevo y lo asignamos sólo al Button

    Ejemplo:

     <style name="MyColorButton" parent="Theme.AppCompat.Light.DarkActionBar"> <item name="colorButtonNormal">@color/myColor</item> </style> 

    Y utilice este estilo como tema de su Button

     <Button style="?android:attr/buttonStyleSmall" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Button1" android:theme="@style/MyColorButton"/> 

    Usar backgroundTint lugar de background

    Si estás bien con el uso de una biblioteca de terceros, echa un vistazo a traex / RippleEffect . Le permite agregar un efecto Ripple a cualquier vista con sólo unas pocas líneas de código. Sólo tiene que incluir en el archivo de diseño xml el elemento que desea tener un efecto ripple con un contenedor com.andexert.library.RippleView .

    Como una ventaja adicional que requiere Min SDK 9 para que pueda tener consistencia de diseño entre las versiones del sistema operativo.

    He aquí un ejemplo tomado del reporte GitHub de las bibliotecas:

     <com.andexert.library.RippleView android:layout_width="wrap_content" android:layout_height="wrap_content" app:rv_centered="true"> <ImageView android:layout_width="100dp" android:layout_height="100dp" android:src="@android:drawable/ic_menu_edit" android:background="@android:color/holo_blue_dark"/> </com.andexert.library.RippleView> 

    Puede cambiar el color de rizado agregando este atributo al elemento RippleView: app:rv_color="@color/my_fancy_ripple_color

     <android.support.v7.widget.AppCompatButton android:layout_width="wrap_content" android:layout_height="wrap_content" app:backgroundTint="#fff" android:textColor="#000" android:text="test"/> 

    Utilizar

     xmlns:app="http://schemas.android.com/apk/res-auto" 

    Y el color aceptará en pre-lolipop

    Vine a este poste que busca una manera de tener un color de fondo de mi artículo de ListView , con todo guarde la ondulación.

    Simplemente agregé mi color como fondo y el selectableItemBackground como un primer plano:

     <style name="my_list_item"> <item name="android:background">@color/white</item> <item name="android:foreground">?attr/selectableItemBackground</item> <item name="android:layout_height">@dimen/my_list_item_height</item> </style> 

    Y funciona como un encanto. Supongo que la misma técnica se podría utilizar para los botones también. Buena suerte 🙂

    Si usted está interesado en ImageButton puede probar esta cosa simple:

     <ImageButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@android:drawable/ic_button" android:background="?attr/selectableItemBackgroundBorderless" /> 

    He intentado esto:

     android:backgroundTint:"@color/mycolor" 

    En lugar de cambiar la propiedad de fondo. Esto no elimina el efecto material.

    FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.