¿El botón del interruptor-botón se inclina?

El pulgar de mi botón de conmutación parece estar sesgado (para el estado de encendido y apagado). Había problemas similares en github, pero ésos eran para la gente que hacía que las bibliotecas apoyaran el botón del interruptor en API 4.0-

Principal contiene el botón de conmutación, y hay un pulgar y la pista se puede aplicar a ella

Esto es lo que está sucediendo:

Introduzca aquí la descripción de la imagen

Así es como se supone que loook:

Introduzca aquí la descripción de la imagen

Switch_track_on.png

Introduzca aquí la descripción de la imagen

Main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" > <Switch android:id="@+id/switch1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" android:layout_marginTop="112dp" android:thumb="@drawable/switch_thumb_selector" android:track="@drawable/switch_track_selector" android:textOn="" android:textOff=""/> </RelativeLayout> 

Switch_thumb_selector.xml

 <selector> <item android:drawable="@drawable/switch_thumb"> </item> </selector> 

Switch_track_selector.xml

  <selector> <item android:drawable="@drawable/switch_track_on" android:state_checked="true"/> <item android:drawable="@drawable/switch_track_off" android:state_checked="false"/> </selector> 

Yo tenía el mismo requisito. Comprobé el código de Android y descubrí que

  1. Ignora cualquier margen vertical / relleno aplicado a una forma pulgar dibujable (por lo tanto pulgar siempre tocar la parte superior e inferior de la pista)
  2. El ancho del pulgar se calcula tomando los rellenos horizontales + el ancho máximo de los textos de encendido y apagado.

Esto hace muy difícil hacer un pulgar círculo.

Pero si especifica el pulgar dibujable como una capa dibujable por la única razón de ser capaz de especificar relleno para la capa única de la drawable, puede obtener el efecto deseado.

Selector del pulgar:

 <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item> <!-- NOTE We want a thumb with padding around it inside the track. Sadly, a switch draws its track and thumb with the same height ignoring any padding of the drawable, so using a shape with padding does not work. To overcome, we apply a trick. We create layer list because the LayerListDrawable draws itself with taking the top, left, right, bottom values into account. --> <layer-list> <item android:top="@dimen/switch_thumb_padding" android:left="@dimen/switch_thumb_padding" android:right="@dimen/switch_thumb_padding" android:bottom="@dimen/switch_thumb_padding"> <!-- NOTE No need to specify size because: - The thumb fills the track in height. - The thumb width is determined from thumb max(on, off) text + text padding + drawable padding. --> <shape android:shape="oval"> <solid android:color="@color/switch_thumb"/> <!-- NOTE did not work, had to set Switch's thumbTextPadding to the radius --> <!-- <padding android:right="@dimen/switch_thumb_radius" android:left="@dimen/switch_thumb_radius"/> --> </shape> </item> </layer-list> </item> </selector> 

Puse el texto de encendido y apagado del conmutador a vacío (en realidad a "" para evitar la advertencia sobre el recurso vacío).

pista:

 <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_enabled="false"> <shape android:shape="rectangle"> <size android:height="@dimen/switch_track_height"/> <corners android:radius="@dimen/switch_thumb_radius"/> <solid android:color="@color/switch_track_off"/> </shape> </item> <item android:state_checked="true"> <shape android:shape="rectangle"> <size android:height="@dimen/switch_track_height"/> <corners android:radius="@dimen/switch_thumb_radius"/> <solid android:color="@color/switch_track_on"/> </shape> </item> </selector> 

Estilo del interruptor:

 <style name="CustomSwitch"> <!-- NOTE this way the switch will be as width as required minimally --> <item name="android:switchMinWidth">0dp</item> <item name="android:track">@drawable/switch_track</item> <item name="android:thumb">@drawable/switch_thumb</item> <item name="android:textOff">@string/switch_thumb_off</item> <item name="android:textOn">@string/switch_thumb_on</item> <!-- NOTE if set to 0dp, the thumb was not visible even with padding of the thumb drawable set to --> <item name="android:thumbTextPadding">@dimen/switch_thumb_radius</item>--> <!--<item name="android:thumbTextPadding">0dp</item>--> </style> 

Y finalmente, la dimens:

 <dimen name="switch_track_height">30dp</dimen> <dimen name="switch_thumb_radius">15dp</dimen> <dimen name="switch_thumb_padding">2dp</dimen> 

Así que la única cosa "difícil" es mantener la altura = radio * 2.

No hay pista de por qué esto sucede, pero lo resolvió colocando el botón de conmutación dentro de un linearLayout. Debe haber algún propery (ancho) del pulgar que tiene un "match_parent" de algún tipo que debe haber estado causando.

Editar: Sucede cuando elimino el texto predeterminado 'ON' y 'OFF'. Así que para ocultar el texto cambié su color a blanco. Cómo cambiar el color de texto del conmutador en Android

Mainjava

 protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.toggle_button); Switch sw = (Switch) findViewById(R.id.switch1); //Both of these need to be used to change the text color to white sw.setTextColor(Color.WHITE); sw.setSwitchTextAppearance(this, Color.WHITE); //Doing this would skew the circle //sw.setTextOn(" "); //sw.setTextOff(" "); } 

Main.xml

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" > <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" android:layout_marginTop="70dp" > <Switch android:id="@+id/switch1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:thumb="@drawable/switch_thumb_selector" android:track="@drawable/switch_track_selector" /> </LinearLayout> 

Para el interruptor de encargo (como el interruptor de IOS) seguí abajo Pasos:

Cree un switch_selector.xml extraíble:

 <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_checked="true"> <shape android:dither="true" android:shape="rectangle" android:useLevel="false" android:visible="true"> <solid android:color="#ca120f" /> <corners android:radius="25dp" /> <size android:width="2dp" android:height="18dp" /> </shape> </item> <item android:state_checked="false"> <shape android:dither="true" android:shape="rectangle" android:useLevel="false" android:visible="true"> <solid android:color="#27170432" /> <corners android:radius="25dp" /> <size android:width="2dp" android:height="18dp" /> </shape> </item> </selector> 

Crear un thumb.xml dibujable :

 <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_checked="false"> <shape android:dither="true" android:shape="rectangle" android:useLevel="false" android:visible="true"> <solid android:color="#ffffff" /> <corners android:radius="100dp" /> <size android:width="24dp" android:height="25dp" /> <stroke android:width="4dp" android:color="#0000ffff" /> </shape> </item> </selector> 

En su diseño:

 <Switch android:id="@+id/checkboxAttendanceSelector" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentEnd="true" android:layout_centerVertical="true" android:thumb="@drawable/thumb" android:track="@drawable/ switch_selector" /> 

Introduzca aquí la descripción de la imagen

  • La página de vista web de Android no carga correctamente la página
  • ¿Es posible crear esta forma simple en Android XML?
  • Cómo codificar un símbolo de Euro en strings.xml en los archivos de android XML
  • Forzar la siguiente palabra a una nueva línea si la palabra es demasiado larga para la vista de texto
  • ¿Java sobreescribe XML en Android?
  • CollapsingToolbarLayout | Problemas de desplazamiento y diseño 2
  • Cómo cambiar la dirección de la sombra de elevación de Android?
  • Deshabilitar elementos de vista de lista con selector y isEnabled ()
  • Incluir etiqueta y dataBinding
  • Adición de espacios en blanco al diseño
  • Cómo cambiar el color de entrada del imput en xml?
  • FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.