0
1.1K
Views¿Cómo eliminar correctamente el relleno (o el margen) alrededor de los botones en Android?
Actualmente, tengo el siguiente botón de inicio de sesión en la parte inferior.
Cuando no se presiona el botón
Cuando se presiona el botón
El XML se ve así
<LinearLayout android:background="?attr/welcomeBottomNavBarBackground" android:orientation="horizontal" android:id="@+id/sign_in_bottom_nav_bar" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true"> <Button style="?android:attr/buttonBarButtonStyle" android:id="@+id/sign_in_button" android:layout_width="0dp" android:width="0dp" android:layout_weight="1.0" android:layout_height="48dp" android:gravity="center" android:layout_gravity="center" android:enabled="true" android:textAllCaps="true" android:text="@string/log_in" /> </LinearLayout>Me gustaría eliminar el relleno (¿O debería llamarlo margen? Consulte mi sección p/s más inferior) alrededor del botón cuando se presiona.
Miro ¿Cómo eliminar el relleno alrededor de los botones en Android?
Había intentado
<Button ... ... android:minHeight="0dp" android:minWidth="0dp" />No funciona y no tiene ningún efecto.
lo intento más
<Button ... ... android:background="@null" android:minHeight="0dp" android:minWidth="0dp" />No más relleno cuando se presiona. Sin embargo, el efecto visual presionado del material diseñado también desaparecerá.
¿Puedo saber cuál es la mejor manera de eliminar el relleno de los botones durante la pulsación y conservar el efecto visual del material diseñado?
PD
Realmente no sé si debería llamarlo relleno o margen. Lo que deseo lograr es que, cuando presionamos en la región inferior, el cambio de efecto visual debe cubrirse al 100 % de la región de la barra inferior ( @+id/sign_in_bottom_nav_bar ), en lugar del 95 % actual de la región de la barra inferior.
3 answers
Answer question0
No se supone que un botón estándar se use en todo el ancho , por lo que experimenta esto.
Fondo
Si observaMaterial Design - Estilo de botón , verá que un botón tiene un área de clic de 48 dp de altura, pero se mostrará como 36 dp de altura por... alguna razón.
Este es el contorno de fondo que ve, que no cubrirá toda el área del botón.
Tiene esquinas redondeadas y algo de relleno y se supone que se puede hacer clic por sí mismo, envolver su contenido y no abarcar todo el ancho en la parte inferior de la pantalla.
Solución
Como se mencionó anteriormente, lo que desea es un fondo diferente. No es un botón estándar, sino un fondo para un elemento seleccionable con este bonito efecto dominó.
Para este caso de uso, existe el atributo de tema ?selectableItemBackground que puede usar para sus fondos (especialmente en las listas).
Agregará una ondulación estándar de la plataforma (o alguna lista de estado de color en < 21) y utilizará los colores de su tema actual.
Para su caso de uso, puede usar lo siguiente:
<Button android:id="@+id/sign_in_button" style="?android:attr/buttonBarButtonStyle" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Login" android:background="?attr/selectableItemBackground" /> <!-- /\ that's all -->Tampoco es necesario agregar pesos de diseño si su vista es la única y abarca toda la pantalla
Si tiene alguna idea diferente sobre cómo debería verse su fondo, debe crear un dibujo personalizado usted mismo y administrar el color y el estado allí.
0
Tan simple, use la propiedad de inset como:
android:insetTop="0dp" android:insetBottom="0dp" android:insetRight="0dp" android:insetLeft="0dp"0
En styles.xml
<style name="MyButtonStyle" parent="Base.Widget.AppCompat.Button"> <item name="android:background">@drawable/selector</item> <item name="android:textColor">@android:color/black</item> </style> En values/drawable :
mi_dibujable.xml
<?xml version="1.0" encoding="utf-8"?> <shape android:shape="rectangle" xmlns:android="http://schemas.android.com/apk/res/android"> <corners android:radius="2dp" /> <!-- specify your desired color here --> <solid android:color="#9e9b99" /> </shape>selector.xml
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_focused="true" android:drawable="@drawable/my_drawable"/> <item android:state_pressed="true" android:drawable="@drawable/my_drawable"/> <item android:drawable="@android:color/transparent"/> </selector> En values/drawable-v21 :
mi_dibujable.xml
<?xml version="1.0" encoding="utf-8"?> <shape android:shape="rectangle" android:tint="?attr/colorButtonNormal" xmlns:android="http://schemas.android.com/apk/res/android"> <corners android:radius="2dp" /> <solid android:color="@android:color/white" /> </shape>selector.xml
<?xml version="1.0" encoding="utf-8"?> <ripple xmlns:android="http://schemas.android.com/apk/res/android" android:color="?attr/colorControlHighlight"> <item android:id="@android:id/mask" android:drawable="@drawable/my_drawable" /> </ripple>En el diseño:
<Button android:id="@+id/button" style="@style/MyButtonStyle" android:layout_width="match_parent" android:layout_height="100dp" android:text="Test"/>Resultado en API 19:
Resultado en API 21:
