Android: espacio entre CheckBox y texto

Odio responder mi propia pregunta, pero en este caso creo que necesito hacerlo. Después de verificarlo, @Falmarri estaba en el camino correcto con su respuesta. El problema es que el control CheckBox de Android ya usa la propiedad android: paddingLeft para obtener el texto donde está.

La línea roja muestra el valor de compensación de desplazamiento lateral de toda la checkbox

Si simplemente anulo ese relleno en mi diseño XML, se estropea el diseño. Esto es lo que hace el ajuste paddingLeft = “0”:

Resulta que no se puede arreglar esto en XML. Lo has hecho en código. Aquí está mi fragmento con un aumento de 10dp en el relleno de código duro.

 final float scale = this.getResources().getDisplayMetrics().density; checkBox.setPadding(checkBox.getPaddingLeft() + (int)(10.0f * scale + 0.5f), checkBox.getPaddingTop(), checkBox.getPaddingRight(), checkBox.getPaddingBottom()); 

Esto le da lo siguiente, donde la línea verde es el aumento en el relleno. Esto es más seguro que un valor de encoding rígida, ya que diferentes dispositivos podrían usar diferentes elementos para la checkbox.

ACTUALIZACIÓN – Como las personas mencionaron recientemente en las respuestas a continuación, este comportamiento aparentemente ha cambiado en Jelly Bean (4.2). Su aplicación deberá verificar en qué versión se ejecuta y utilizar el método apropiado.

Para 4.3+ simplemente está configurando padding_left. Ver la respuesta de htafoya para más detalles.

Dada la respuesta @DougW, lo que hago para administrar la versión es más simple, agrego a mi vista de casillas de verificación:

 android:paddingLeft="@dimen/padding_checkbox" 

donde el dimen se encuentra en dos carpetas de valores:

valores

  25dp  

values-v17 (4.2 JellyBean)

  10dp  

Tengo un cheque personalizado, uso el dps para su mejor elección.

Use el atributo android:drawableLeft lugar de android:button . Para establecer el relleno entre dibujables y uso de texto android:drawablePadding . Para posicionar el uso android:paddingLeft .

Android 4.2 Jelly Bean (API 17) coloca el relleno de texto desde el botón Desplegable (en el borde derecho). También funciona para el modo RTL.

Antes de que 4.2 paddingLeft estuviera ignorando el botón Drawraw, se tomó desde el borde izquierdo de la vista CompoundButton.

Puede resolverlo a través de XML: configure paddingLeft a buttonDrawable.width + requiredSpace en androids antiguos. Configúrelo en requiredSpace solo en API 17 arriba. Por ejemplo, use recursos de dimensión y anule en la carpeta de recursos values-v17.

El cambio se introdujo a través de android.widget.CompoundButton.getCompoundPaddingLeft ();

Sí, puede agregar relleno añadiendo relleno.

android:padding=5dp

Si quieres un diseño limpio sin códigos, utiliza:

El truco es establecer el color en transparente para android:drawableLeft y asignar un valor para android:drawablePadding . Además, la transparencia le permite utilizar esta técnica en cualquier color de fondo sin el efecto secundario, como la falta de coincidencia de colores.

En mi caso, resolví este problema usando el siguiente atributo CheckBox en el XML:

*

android: paddingLeft = “@ dimen / activity_horizontal_margin”

*

Solución simple, agregue esta línea en las propiedades de CheckBox , reemplace 10dp con el valor de espaciado deseado

 android:paddingLeft="10dp" 

¿Por qué no extender el Android CheckBox para tener mejor relleno? De esa forma, en lugar de tener que arreglarlo en código cada vez que use CheckBox, puede usar el CheckBox fijo en su lugar.

First Extend CheckBox:

 package com.whatever; import android.content.Context; import android.util.AttributeSet; import android.widget.CheckBox; /** * This extends the Android CheckBox to add some more padding so the text is not on top of the * CheckBox. */ public class CheckBoxWithPaddingFix extends CheckBox { public CheckBoxWithPaddingFix(Context context) { super(context); } public CheckBoxWithPaddingFix(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); } public CheckBoxWithPaddingFix(Context context, AttributeSet attrs) { super(context, attrs); } @Override public int getCompoundPaddingLeft() { final float scale = this.getResources().getDisplayMetrics().density; return (super.getCompoundPaddingLeft() + (int) (10.0f * scale + 0.5f)); } } 

Segundo en su xml en lugar de crear un CheckBox normal, cree su extendido

API 17 y superior, puedes usar:

android: paddingStart = “24dp”

API 16 y abajo, puede usar:

android: paddingLeft = “24dp”

No sé chicos, pero probé

y solo mueve el texto a la derecha, no a todo el control.

Me sienta bien.

Acabo de concluir sobre esto:

Anule CheckBox y agregue este método si tiene un drawable personalizado:

 @Override public int getCompoundPaddingLeft() { // Workarround for version codes < Jelly bean 4.2 // The system does not apply the same padding. Explantion: // http://stackoverflow.com/questions/4037795/android-spacing-between-checkbox-and-text/4038195#4038195 int compoundPaddingLeft = super.getCompoundPaddingLeft(); if (Build.VERSION.SDK_INT < Build.VERSION_CODES.JELLY_BEAN_MR1) { Drawable drawable = getResources().getDrawable( YOUR CUSTOM DRAWABLE ); return compoundPaddingLeft + (drawable != null ? drawable.getIntrinsicWidth() : 0); } else { return compoundPaddingLeft; } } 

o esto si usa el sistema dibujable:

 @Override public int getCompoundPaddingLeft() { // Workarround for version codes < Jelly bean 4.2 // The system does not apply the same padding. Explantion: // http://stackoverflow.com/questions/4037795/android-spacing-between-checkbox-and-text/4038195#4038195 int compoundPaddingLeft = super.getCompoundPaddingLeft(); if (Build.VERSION.SDK_INT < Build.VERSION_CODES.JELLY_BEAN_MR1) { final float scale = this.getResources().getDisplayMetrics().density; return compoundPaddingLeft + (drawable != null ? (int)(10.0f * scale + 0.5f) : 0); } else { return compoundPaddingLeft; } } 

Gracias por la respuesta 🙂

Este comportamiento parece haber cambiado en Jelly Bean. El truco paddingLeft agrega relleno adicional, haciendo que el texto se vea demasiado a la derecha. ¿Alguien más lo notó?

Si tiene un selector de imagen personalizado para la checkbox o el botón de radio, debe establecer las mismas propiedades de botón y fondo, como esta:

Puede controlar el tamaño de la checkbox o el relleno del botón de opción con la propiedad de fondo.

solo necesitas tener un parámetro en el archivo xml

 android:paddingLeft="20dp" 

Si está creando botones personalizados, por ejemplo, consulte cambiar el aspecto de la checkbox tutorial

Luego, simplemente aumente el ancho de btn_check_label_background.9.png agregando una o dos columnas más de píxeles transparentes en el centro de la imagen; deje los marcadores de 9 parches tal como están.

Lo que hice fue tener un TextView y un CheckBox dentro de un Layout (Relativo). TextView muestra el texto que quiero que el usuario vea, y CheckBox no tiene ningún texto. De esta forma, puedo establecer la posición / relleno del CheckBox donde quiera.

Tal vez sea demasiado tarde, pero he creado métodos de utilidad para gestionar este problema.

Simplemente agregue estos métodos a sus utilidades:

 public static void setCheckBoxOffset(@NonNull CheckBox checkBox, @DimenRes int offsetRes) { float offset = checkBox.getResources().getDimension(offsetRes); setCheckBoxOffsetPx(checkBox, offset); } public static void setCheckBoxOffsetPx(@NonNull CheckBox checkBox, float offsetInPx) { int leftPadding; if (Build.VERSION.SDK_INT <= Build.VERSION_CODES.JELLY_BEAN) { leftPadding = checkBox.getPaddingLeft() + (int) (offsetInPx + 0.5f); } else { leftPadding = (int) (offsetInPx + 0.5f); } checkBox.setPadding(leftPadding, checkBox.getPaddingTop(), checkBox.getPaddingRight(), checkBox.getPaddingBottom()); } 

Y use esto:

  ViewUtils.setCheckBoxOffset(mAgreeTerms, R.dimen.space_medium); 

o así:

  // Be careful with this usage, because it sets padding in pixels, not in dp! ViewUtils.setCheckBoxOffsetPx(mAgreeTerms, 100f); 

Tuve el mismo problema con un Galaxy S3 mini (Android 4.1.2) y simplemente hice que mi checkbox personalizada ampliara AppCompatCheckBox en lugar de CheckBox. Ahora funciona perfectamente.

Necesita obtener el tamaño de la imagen que está utilizando para agregar su relleno a este tamaño. En las partes internas de Android, obtienen el dibujo que especifiques en src y luego usa su tamaño. Como es una variable privada y no hay compradores, no puede acceder a ella. Además, no puede obtener com.android.internal.R.styleable.CompoundButton y obtener el dibujable desde allí.

Por lo tanto, debe crear su propio estilo (es decir custom_src) o puede agregarlo directamente en su implementación de RadioButton:

 public class CustomRadioButton extends RadioButton { private Drawable mButtonDrawable = null; public CustomRadioButton(Context context) { this(context, null); } public CustomRadioButton(Context context, AttributeSet attrs) { this(context, attrs, 0); } public CustomRadioButton(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); mButtonDrawable = context.getResources().getDrawable(R.drawable.rbtn_green); setButtonDrawable(mButtonDrawable); } @Override public int getCompoundPaddingLeft() { if (Util.getAPILevel() <= Build.VERSION_CODES.JELLY_BEAN_MR1) { if (drawable != null) { paddingLeft += drawable.getIntrinsicWidth(); } } return paddingLeft; } } 

Como probablemente usas un selector dibujable para tu propiedad android:button , necesitas agregar android:constantSize="true" y / o especificar un drawable predeterminado como este:

Después de eso, debe especificar el atributo android:paddingLeft en su checkbox xml.

Contras:

En el editor de diseño, verá el texto que se encuentra debajo de la checkbox con la api 16 y debajo, en ese caso puede solucionarlo creando una clase de casilla personalizada como la sugerida pero para el nivel 16 de la API.

Razón fundamental:

es un error ya que la StateListDrawable#getIntrinsicWidth() se usa internamente en CompoundButton pero puede devolver < 0 valor si no hay un estado actual y no se usa un tamaño constante.

Todo lo que tienes que hacer para solucionar este problema es agregar android:singleLine="true" a la checkBox de checkBox en tu diseño xml de Android:

y nada especial se agregará programáticamente.

La imagen de la checkbox se superponía cuando utilicé mis propios elementos extraíbles del selector. Lo he resuelto usando el siguiente código:

 CheckBox cb = new CheckBox(mActivity); cb.setText("Hi"); cb.setButtonDrawable(R.drawable.check_box_selector); cb.setChecked(true); cb.setPadding(cb.getPaddingLeft(), padding, padding, padding); 

Gracias a Alex Semeniuk

Termino con este problema al cambiar las imágenes. Acabo de agregar fondo transparente extra en archivos png. Esta solución funciona de manera excelente en todas las API.

En lugar de ajustar el texto para Checkbox, hice lo siguiente y funcionó para todos los dispositivos. 1) En XML, agregue la checkbox y una vista de texto adyacente a una después de otra; manteniendo algo de distancia. 2) Establecer el tamaño de la checkbox a 0sp. 3) Agregue el texto relativo a esa vista de texto junto a la checkbox.

- El relleno entre los y el texto.