Android - Odstępy między CheckBox a tekstem

Czy istnieje prosty sposób na dodanie dopełnienia między polem wyboru w kontrolce CheckBox a powiązanym tekstem?

Nie mogę po prostu dodać wiodących spacji, ponieważ moja etykieta jest wielowierszowa.

Na obecnym etapie tekst jest zbyt blisko pola wyboru:

Nienawidzę odpowiadać na własne pytanie, ale w tym przypadku myślę, że muszę. Po sprawdzeniu, @Falmarri był na dobrej drodze ze swoją odpowiedzią. Problem polega na tym, że kontrolka CheckBox systemu Android korzysta już z właściwości android: paddingLeft, aby uzyskać tekst tam, gdzie jest.

Czerwona linia pokazuje wartość przesunięcia paddingLeft dla całego CheckBox

Jeśli po prostu zastąpię to wypełnienie w moim układzie XML, spowoduje to popsucie układu. Oto, co robi ustawienie paddingLeft = "0":

Okazuje się, że nie można tego naprawić w XML. Zrobisz to w kodzie. Oto mój fragment kodu ze zwiększonym zakresem wypełnienia o 10dp.

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

To daje następujące, gdzie zielona linia to wzrost wypełnienia. Jest to bezpieczniejsze niż zapisywanie wartości na stałe, ponieważ różne urządzenia mogą używać różnych rysunków dla pola wyboru.

AKTUALIZACJA - jak ludzie ostatnio wspomnieli w odpowiedziach poniżej, to zachowanie najwyraźniej zmieniło się w Jelly Bean (4.2). Twoja aplikacja będzie musiała sprawdzić, na której wersji jest uruchomiona, i użyć odpowiedniej metody.

W wersji 4.3+ jest to po prostu ustawienie padding_left. Szczegółowe informacje można znaleźć w odpowiedzi htafoya.

Biorąc pod uwagę odpowiedź @DougW, co robię, aby zarządzać wersją, jest prostsze, dodaję do mojego pola wyboru:

android:paddingLeft="@dimen/padding_checkbox"

gdzie dimen znajduje się w dwóch folderach wartości:

wartości

<resources>

    <dimen name="padding_checkbox">0dp</dimen>

</resources>

wartości-v17 (4.2 JellyBean)

<resources>

    <dimen name="padding_checkbox">10dp</dimen>

</resources>

Mam niestandardowy czek, użyj dps do najlepszego wyboru.

Użyj atrybutu android:drawableLeftzamiast android:button. Aby ustawić wypełnienie między rysowaniem a tekstem android:drawablePadding. Aby ustawić wysuwane użycie android:paddingLeft.

<CheckBox
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:button="@null"
        android:drawableLeft="@drawable/check_selector"
        android:drawablePadding="-50dp"
        android:paddingLeft="40dp"
        />

Android 4.2 Jelly Bean (API 17) umieszcza tekst paddingLeft z przyciskuDrawable (ints prawa krawędź). Działa również w trybie RTL.

Przed 4.2 paddingLeft ignorował przyciskDrawable - został pobrany z lewej krawędzi widoku CompoundButton.

Możesz to rozwiązać za pomocą XML - ustaw paddingLeft na buttonDrawable.width + wymaganySpace na starszych androidach. Ustaw na wymagane Miejsce tylko w API 17 w górę. Na przykład użyj zasobów wymiarów i zastąp w folderze zasobów wartości-17.

Zmiana została wprowadzona za pośrednictwem android.widget.CompoundButton.getCompoundPaddingLeft ();

Tak, możesz dodać dopełnienie, dodając dopełnienie.

android:padding=5dp

Jeśli chcesz mieć czysty design bez kodów, użyj:

<CheckBox
   android:id="@+id/checkBox1"
   android:layout_height="wrap_content"
   android:layout_width="wrap_content"
   android:drawableLeft="@android:color/transparent"
   android:drawablePadding="10dp"
   android:text="CheckBox"/>

Sztuką jest ustawienie koloru na przezroczysty android:drawableLefti przypisanie wartości android:drawablePadding. Ponadto przezroczystość pozwala na użycie tej techniki na dowolnym kolorze tła bez efektu ubocznego - np. Niedopasowanie kolorów.

API 17 i wyżej, możesz użyć:

android: paddingStart = "24dp"

API 16 i poniżej, możesz użyć:

android: paddingLeft = "24dp"

W moim przypadku rozwiązałem ten problem za pomocą następującego atrybutu CheckBox w pliku XML:

*

android: paddingLeft = "@ dimen / activity_horizontal_margin"

*

Proste rozwiązanie, dodaj ten wiersz do właściwości CheckBox , zastąp 10dp żądaną wartością odstępu

android:paddingLeft="10dp"

Nie znam facetów, ale testowałem

<CheckBox android:paddingLeft="8mm" i przesuwa tylko tekst w prawo, a nie całą kontrolę.

To mi odpowiada.

Dlaczego nie po prostu rozszerzyć Android CheckBox, aby zamiast tego mieć lepszą wypełnienie. W ten sposób zamiast konieczności poprawiania go w kodzie za każdym razem, gdy używasz CheckBox, możesz zamiast tego użyć po prostu ustalonego CheckBox.

Najpierw rozszerz 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));
    }
}

Po drugie w swoim xml zamiast tworzenia normalnego CheckBox utwórz swój rozszerzony

<com.whatever.CheckBoxWithPaddingFix
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Hello there" />

Właśnie do tego doszedłem:

Zastąp CheckBox i dodaj tę metodę, jeśli masz niestandardowy program do rysowania:

@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;
    }

}

lub to, jeśli używasz systemu do rysowania:

@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;
    }

}

Dziękuję za odpowiedź :)

Wygląda na to, że to zachowanie zmieniło się w Jelly Bean. Sztuczka paddingLeft dodaje dodatkowe dopełnienie, dzięki czemu tekst wygląda zbyt daleko w prawo. Czy ktoś to zauważył?

Aby wstawić spację między znacznikiem wyboru a tekstem, użyj:

android:paddingLeft="10dp"

Ale staje się on większy niż 10dp, ponieważ znacznik wyboru zawiera dopełnienie (około 5dp) wokół. Jeśli chcesz usunąć wypełnienie, zobacz Jak usunąć wypełnienie wokół Androida CheckBox :

android:paddingLeft="-5dp"
android:layout_marginStart="-5dp"
android:layout_marginLeft="-5dp"
// or android:translationX="-5dp" instead of layout_marginLeft

<CheckBox
        android:paddingRight="12dip" />

Jeśli masz niestandardowy selektor obrazu dla pola wyboru lub przycisku radiowego, musisz ustawić tę samą właściwość przycisku i tła, taką jak ta:

            <CheckBox
                android:id="@+id/filter_checkbox_text"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:button="@drawable/selector_checkbox_filter"
                android:background="@drawable/selector_checkbox_filter" />

Możesz kontrolować rozmiar pola wyboru lub wypełnienia przycisku opcji za pomocą właściwości tła.

tylko musisz mieć jeden parametr w pliku xml

android:paddingLeft="20dp"

Ustawienie minHeight i minWidth 0dpbyło najczystszym i najprostszym rozwiązaniem dla mnie w systemie Android 9 API 28:

<CheckBox
        android:id="@+id/checkbox"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:minHeight="0dp"
        android:minWidth="0dp" />

Jeśli tworzysz niestandardowe przyciski, np. Zobacz zmianę wyglądu samouczka pola wyboru

Następnie po prostu zwiększ szerokość btn_check_label_background.9.png, dodając jedną lub dwie kolejne kolumny przezroczystych pikseli na środku obrazu; pozostaw znaczniki z 9 łatami takimi, jakie są.

To, co zrobiłem, to posiadanie TextViewi CheckBoxwewnątrz (Relative) Layout. W TextViewwyświetla tekst, który chcę użytkownika, aby zobaczyć, a CheckBoxnie ma żadnego tekstu. W ten sposób mogę ustawić pozycję / wypełnienie w CheckBoxdowolnym miejscu.

Miałem ten sam problem z Galaxy S3 mini (Android 4.1.2) i po prostu sprawiłem, że moje niestandardowe pole wyboru rozszerza AppCompatCheckBox zamiast CheckBox. Teraz działa idealnie.

Musisz dodać rozmiar obrazu, którego używasz, aby dodać dopełnienie do tego rozmiaru. W urządzeniach wewnętrznych z systemem Android są one dostępne do rysowania, które określasz na src, a następnie używają jego rozmiaru. Ponieważ jest to zmienna prywatna i nie ma żadnych pobierających, do których nie można uzyskać dostępu. Ponadto nie możesz uzyskać com.android.internal.R.styleable.CompoundButton i stamtąd można pobrać.

Musisz więc stworzyć swój własny styl (np. Custom_src) lub możesz dodać go bezpośrednio w swojej implementacji 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;
    }
}

Ponieważ prawdopodobnie używasz selektora do rysowania dla swojej android:buttonwłaściwości, musisz dodać android:constantSize="true"i / lub określić domyślną rysowną w następujący sposób:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" android:constantSize="true">
  <item android:drawable="@drawable/check_on" android:state_checked="true"/>
  <item android:drawable="@drawable/check_off"/>
</selector>

Następnie musisz określić android:paddingLeftatrybut w polu wyboru xml.

Cons:

W edytorze układu pojawi się tekst pod polem wyboru z interfejsem API 16 i niższym, w takim przypadku możesz to naprawić, tworząc niestandardową klasę pola wyboru, jak sugerowano, ale dla interfejsu API poziomu 16.

Racjonalne uzasadnienie:

jest to błąd, ponieważ StateListDrawable#getIntrinsicWidth()wywołanie jest używane wewnętrznie, CompoundButtonale może zwrócić < 0wartość, jeśli nie ma aktualnego stanu i nie jest używany stały rozmiar.

Wszystko, co musisz zrobić, aby rozwiązać ten problem, to dodać android:singleLine="true"do checkBoxukładu xml w Androidzie:

<CheckBox 
   android:id="@+id/your_check_box"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:singleLine="true"
   android:background="@android:color/transparent"
   android:text="@string/your_string"/>

i nic specjalnego nie zostanie dodane programowo.

Obraz pola wyboru zachodził na siebie, gdy używałem własnych drawables z selektora, rozwiązałem to za pomocą poniższego kodu:

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);

Dzięki Alex Semeniuk

Kończę z tym problemem, zmieniając obrazy. Właśnie dodałem dodatkowe przezroczyste tło w plikach png. To rozwiązanie działa doskonale na wszystkich interfejsach API.

Może jest już za późno, ale stworzyłem narzędzia do zarządzania tym problemem.

Po prostu dodaj te metody do swoich narzędzi:

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());
}

I użyj tego:

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

lub tak:

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

Zamiast dostosowywać tekst dla Checkbox, zrobiłem następujące rzeczy i zadziałało to dla wszystkich urządzeń. 1) W XML dodaj pole wyboru i widok tekstu obok siebie; utrzymywanie dystansu. 2) Ustaw rozmiar pola wyboru na 0sp. 3) Dodaj względny tekst do tego widoku obok pola wyboru.

<CheckBox android:drawablePadding="16dip" - Wypełnienie między rysunkami a tekstem.