Jak wyświetlić pole wyboru Androida po prawej stronie?

146

Domyślnie pole wyboru Androida pokazuje tekst po prawej stronie i pole wyboru po lewej
Chcę pokazać pole wyboru po prawej stronie, a tekst po lewej

jak to osiągnąć?

android  layout  checkbox 
— UMAR-MOBITSOLUTIONS
źródło

Odpowiedzi:

41

Nie mogę wymyślić sposobu na stylizację, ale możesz po prostu ustawić tekst pola wyboru na zero i umieścić TextView po lewej stronie pola wyboru z żądanym tekstem.

— xil3
źródło
mam pytanie na ten temat: po kliknięciu na układ powinien pokazać (przez bardzo krótki czas), że zaznaczony jest cały wiersz. jak to zrobić i zasymulować, że to natywny efekt?
— programista Androida
nieważne - ustawiłem selektor na układ i teraz jest dobrze.
— programista Androida
@androiddeveloper, czy możesz opublikować rozwiązanie selektora?
— Fouad Wahabi
1
@FouadWahabi Możesz utworzyć plik XML do rysowania w „res / drawable”, taki jak: stackoverflow.com/a/2038086 i ustawić tło widoku / układu na ten plik do rysowania. Może być konieczne, aby był on również klikalny. Myślę, że widziałem również wykład Google IO na ten temat. niepewny. gorąco polecam sprawdzenie ich wideo.
— programista Androida
1
@FouadWahabi Cóż, możesz rozszerzyć wybraną klasę układu i samodzielnie dodać tę logikę. Możesz przeglądać wszystkie widoki dzieci i przełączać ich stan. Możesz skorzystać z tych linków, aby Ci pomóc: developer.android.com/samples/CustomChoiceList/src/… , antoine-merle.com/blog/2013/07/17/… . dodaj element clickListener i przełącz sprawdzanie, a wewnątrz „setChecked” ustaw odpowiednio stan widoków podrzędnych, ale tylko wtedy, gdy implementują Checkable.
— programista Androida
362

Myślę, że jest już za późno, aby odpowiedzieć na to pytanie, ale tak naprawdę jest sposób, aby osiągnąć swój cel. Musisz tylko dodać następujący wiersz do swojego pola wyboru:

android:button="@null"
android:drawableRight="?android:attr/listChoiceIndicatorMultiple"

Możesz również użyć dostosowanego do rysowania pola wyboru.

A dla radia Przycisk:

android:button="@null"
android:drawableRight="@android:drawable/btn_radio"

A jeśli chcesz to zrobić programowo:

Zdefiniuj układ i nazwij go RightCheckBox i skopiuj następujące wiersze:

<?xml version="1.0" encoding="utf-8"?>
<CheckBox xmlns:android="http://schemas.android.com/apk/res/android"
    android:text="hello"
    android:layout_width="match_parent" 
    android:layout_height="match_parent"
    android:button="@null"
    android:drawableRight="?android:attr/listChoiceIndicatorMultiple"/>

a kiedy chcesz dodać go programowo, wystarczy zawyżyć go do CheckBox i dodać do widoku głównego.

CheckBox cb = (CheckBox)((LayoutInflater)getSystemService(LAYOUT_INFLATER_SERVICE)).inflate(R.layout.check_right_checkbox,null);
rootView.addView(cb);
— Hazhir
źródło
5
A jako pole wyboru możesz użyć android:drawableRight="?android:attr/listChoiceIndicatorMultiple". Myślę, że to najlepsze rozwiązanie dla pola wyboru po prawej stronie, które do tej pory znalazłem.
— Pierre-Luc Paour
7
Należy pamiętać, że pakiet SDK systemu Android 5.0 wyświetli ostrzeżenie o urządzeniach RTL. Aby to odeszło, po prostu dodaj android:drawableEndoprócz android:drawableRight(o tej samej wartości).
— Quentin S.,
6
To rozwiązanie działało całkiem nieźle, aby rozwiązać problem. Jednak w systemie Android 5. +, podczas gdy standardowy widżet zawiera tętnienie, które można narysować na niewielkim obszarze wokół czeku, ten zmodyfikowany widżet umożliwia rozszerzenie tętnienia poza granice samego widżetu. Jeśli korzystasz z tej techniki, sugeruję ustawienie tła tak, aby użyć tętnienia, które można narysować za pomocą prostokątnej maski.
— Justin Pollard,
2
Android zapewnia kilkanaście obiektów widoku, z których wszystkie można zmienić, aby narysować androida do rysowania lub niestandardowego rysowania. Jeśli chcesz uzyskać efekt ripple (5.0+) na obiekcie, po prostu ustaw jego tło na XML drawable, który włącza ripple. Poniższe łącze pokazuje kilka przykładowych obiektów widoku, CheckedTextView, CheckBox, ToggleButton itp. Z odpowiednim zestawem do drible. landenlabs.com/android/uicomponents/uicomponents.html#checkbox
— LanDenLabs,
6
Pokazuje okrągłe tętnienie pośrodku tekstu, ale nie po prawej stronie do rysowania, więc wygląda brzydko na nowoczesnych wersjach Androida
— Leo Droidcoder
122

Możesz to zrobić

<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="right|center"//or "center_vertical" for center text
android:layoutDirection="rtl"
android:text="hello" />

Wystarczy podążać za linią 

android:layoutDirection="rtl"
— Mahesh Lad
źródło
3
Hacky i jednocześnie elegancki. Twoje zdrowie!
— Roman Samoilenko
Dobra sztuczka! nie zapomnij o grawitacji: android: gravity = "right | center", aby uzyskać oczekiwany efekt lustrzanego odbicia.
— Tobliug
3
to nie jest właściwy sposób, ponieważ jeśli twoje urządzenie jest w języku RTL, nie będzie wyglądać dobrze.
— Martin Marconcini
cb.setLayoutDirection (CheckBox.LAYOUT_DIRECTION_RTL);
— paakjis
1
Musisz ustawić android:gravity="end|center_vertical"wyświetlanie tekstu po lewej stronie, ponieważ układ zaczyna się teraz.
— Serge
52

Możesz dodać, android:layoutDirection="rtl"ale jest to dostępne tylko z API 17.

— Berga
źródło
19

Po prostu skopiuj to:

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Your text:"/>
        <CheckBox
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:checked="true"
            />
    </LinearLayout>

Miłego kodowania! :)

— Ivo Stoyanov
źródło
14

Tekst pola wyboru może nie być wyrównany do lewej strony

android:button="@null"
android:drawableRight="@android:drawable/btn_radio"

w jakimś urządzeniu. Może użyć CheckedTextView jako zamiennika, aby uniknąć problemu,

<CheckedTextView
    ...
    android:checkMark="@android:drawable/btn_radio" />

i ten link będzie pomocny: Wyrównaj tekst do lewej, pole wyboru do prawej

— cfh008
źródło
To jest przycisk opcji. A co z tym dla pola wyboru materiału?
— Monica Aspiras Labbao
1
Jako pole wyboru użyjandroid:checkMark="?android:attr/listChoiceIndicatorMultiple"
— Philipp
Do użycia radiobuttonandroid:checkMark="?android:attr/listChoiceIndicatorSingle"
— Philipp
13 
    <android.support.v7.widget.AppCompatCheckBox
  android:id="@+id/checkBox"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:layout_marginTop="10dp"
  android:layoutDirection="rtl"
  android:text="text" />`
— Kerim FIRAT
źródło
To również sprawia, że ​​tekst jest wyrównany do prawej, więc jeśli widok pola wyboru pasuje do szerokości nadrzędnej, będzie wyglądał dziwnie.
— David Rector
6

Zgodnie z sugestią @The Berga Możesz dodać, android:layoutDirection="rtl"ale jest to dostępne tylko z API 17.
do dynamicznej implementacji, proszę bardzo

chkBox.setLayoutDirection(View.LAYOUT_DIRECTION_RTL);
— Sri Kanth
źródło
3

ponadto z imput Hazhir, dla tego problemu konieczne jest wstrzyknięcie tej właściwości w konfiguracji checkbox xml android: paddingLeft = "0dp", ma to na celu uniknięcie pustej przestrzeni po lewej stronie pola wyboru.

— zeusboy
źródło
3

Dodanie kolejnej odpowiedzi na to pytanie, która używa CheckedTextView, jeśli ktoś próbuje to zrobić programowo. Ma również opcję używania niestandardowych obrazów dla pola wyboru. I można to zrobić w jednym widoku

final CheckedTextView checkBox = new CheckedTextView(getApplicationContext());
    checkBox.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT));
    checkBox.setId(1);
    checkBox.setCheckMarkDrawable(android.R.drawable.checkbox_off_background);
    checkBox.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            if (checkBox.isChecked()){
                checkBox.setChecked(false);
                checkBox.setCheckMarkDrawable(android.R.drawable.checkbox_off_background);
            }else{
                checkBox.setChecked(true);
                checkBox.setCheckMarkDrawable(android.R.drawable.checkbox_on_background);
            }
        }
    });
    checkBox.setTextColor(Color.BLACK);
    checkBox.setGravity(Gravity.LEFT);
    checkBox.setText("hi");

Z XML, jeśli chcesz zainicjować - 

<CheckedTextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:checkMark="@android:drawable/checkbox_off_background"
        android:checked="false"
        android:text="Hi from xml"/>
— Kapil G
źródło
0

Poniższe łącze pokazuje, jak renderować kilka standardowych obiektów widoku systemu Android z animowanym polem wyboru po prawej stronie, ustawiając odpowiedni element do rysowania.

Ustaw tło, aby uzyskać efekt falowania.

[link do strony internetowej z przykładowym polem wyboru po prawej i lewej stronie.] [1] http://landenlabs.com/android/uicomponents/uicomponents.html#checkbox

         <Button
            android:id="@+id/p2Button1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"

            android:background="@drawable/transparent_ripple"
            android:drawableRight="@drawable/checkline"
            android:gravity="left|center_vertical"
            android:text="Button"
            android:textAllCaps="false"

            android:textColor="@android:color/white"
            android:textSize="@dimen/buttonTextSize" />

        <android.support.v7.widget.AppCompatButton
            android:id="@+id/p2Button2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"

            android:background="@drawable/transparent_ripple"
            android:drawableRight="@drawable/checkline"
            android:gravity="left|center_vertical"
            android:text="AppCompatButton"
            android:textAllCaps="false"

            android:textColor="@android:color/white"
            android:textSize="@dimen/buttonTextSize" />

        <TextView
            android:id="@+id/p2TextView1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"

            android:background="@drawable/transparent_ripple"
            android:drawableRight="@drawable/checkline"
            android:gravity="left|center_vertical"
            android:hapticFeedbackEnabled="true"

            android:text="TextView"
            android:textColor="@android:color/white"
            android:textSize="@dimen/buttonTextSize" />

        <android.support.v7.widget.AppCompatTextView
            android:id="@+id/p2TextView2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"

            android:background="@drawable/transparent_ripple"
            android:drawableRight="@drawable/checkline"
            android:gravity="left|center_vertical"
            android:hapticFeedbackEnabled="true"

            android:text="AppCompatTextView"
            android:textColor="@android:color/white"
            android:textSize="@dimen/buttonTextSize" />

        <View
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:background="@android:color/white" />

        <CheckBox
            android:id="@+id/p2Checkbox1"
            android:layout_width="match_parent"
            android:layout_height="@dimen/buttonHeight"
            android:background="@drawable/transparent_ripple"
            android:button="@null"
            android:checked="true"
            android:drawableRight="@drawable/checkline"
            android:gravity="left|center_vertical"
            android:text="CheckBox"
            android:textColor="@android:color/white"
            android:textSize="@dimen/buttonTextSize" />

        <android.support.v7.widget.AppCompatCheckBox
            android:id="@+id/p2Checkbox2"
            android:layout_width="match_parent"
            android:layout_height="@dimen/buttonHeight"
            android:background="@drawable/transparent_ripple"
            android:button="@null"
            android:checked="true"
            android:drawableRight="@drawable/checkline"
            android:gravity="left|center_vertical"
            android:text="AppCompatCheckBox"
            android:textColor="@android:color/white"
            android:textSize="@dimen/buttonTextSize" />

        <android.support.v7.widget.AppCompatCheckedTextView
            android:id="@+id/p2Checkbox3"
            android:layout_width="match_parent"
            android:layout_height="@dimen/buttonHeight"
            android:background="@drawable/transparent_ripple"
            android:checkMark="@drawable/checkline"
            android:checked="true"
            android:gravity="left|center_vertical"
            android:text="AppCompatCheckedTextView"
            android:textColor="@android:color/white"
            android:textSize="@dimen/buttonTextSize" />

        <!--  android:checkMark="?android:attr/listChoiceIndicatorMultiple" -->
        <CheckedTextView
            android:id="@+id/p2Checkbox4"
            android:layout_width="match_parent"
            android:layout_height="@dimen/buttonHeight"
            android:background="@drawable/transparent_ripple"
            android:checkMark="@drawable/checkline"
            android:checked="true"
            android:gravity="left|center_vertical"
            android:text="CheckedTextView"
            android:textColor="@android:color/white"
            android:textSize="@dimen/buttonTextSize" />

        <CheckBox
            android:id="@+id/p2Checkbox5"
            android:layout_width="match_parent"
            android:layout_height="@dimen/buttonHeight"
            android:background="@drawable/transparent_ripple"
            android:checked="true"
            android:gravity="center_vertical|end"
            android:text="CheckBox"
            android:textColor="@android:color/white"
            android:textSize="@dimen/buttonTextSize" />

        <View
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:background="@android:color/white" />


        <ToggleButton
            android:id="@+id/p2ToggleButton1"
            android:layout_width="match_parent"
            android:layout_height="@dimen/buttonHeight"
            android:background="@drawable/transparent_ripple"
            android:checked="true"
            android:drawableRight="@drawable/checkline"
            android:gravity="center_vertical|left"
            android:textAllCaps="false"
            android:textColor="@android:color/white"

            android:textOff="ToggleButtonOff"

            android:textOn="ToggleButtonOn"
            android:textSize="@dimen/buttonTextSize" />

        <ToggleButton
            android:id="@+id/p2ToggleButton2"
            android:layout_width="match_parent"
            android:layout_height="@dimen/buttonHeight"
            android:background="@drawable/transparent_ripple"
            android:checked="true"
            android:drawableRight="@drawable/btn_check_material_anim"
            android:gravity="center_vertical|left"
            android:textAllCaps="false"

            android:textColor="@android:color/white"
            android:textOff="ToggleBtnnAnimOff"
            android:textOn="ToggleBtnnAnimOn"
            android:textSize="@dimen/buttonTextSize" />

Przykładowy checkline.xml (do rysowania, zobacz link do wersji animowanej w drawable-v21)

Przykład transparent_ripple.xml (w drawable-v21)

<!-- Limit ripple to view object, can also use shape such as oval -->
<item android:id="@android:id/mask" android:drawable="@android:color/white" />

<item>
    <selector xmlns:android="http://schemas.android.com/apk/res/android"
        android:enterFadeDuration="200"
        android:exitFadeDuration="200">

        <item android:state_pressed="true">
            <shape android:shape="rectangle">
                <solid android:color="#80c0c000" />
            </shape>
        </item>
    </selector>
</item>

Próbka transparent_ripple.xml (do rysowania, zaznacz tylko brak dostępnych tętnień 

<item android:state_pressed="true">
    <shape android:shape="rectangle">
        <solid android:color="#80c0c000" />
    </shape>
</item>
<item>
    <shape android:shape="rectangle">
        <solid android:color="@android:color/transparent" />
    </shape>
</item>

— LanDenLabs
źródło
0

Jeśli nie jest to obowiązkowe, CheckBoxmożesz po prostu użyć Switchzamiast tego. Przełącznik domyślnie wyświetla tekst po lewej stronie.

— Oliver Kranz
źródło
0

Możesz tego również użyć,

<CheckBox
       android:layout_width="match_parent"     
       android:layout_height="@dimen/button_height_35"
       android:text="@string/english"
       android:checked="true"
       android:paddingEnd="@dimen/padding_5"
       android:paddingStart="@dimen/padding_5"
       android:layoutDirection="rtl"
       android:drawablePadding="@dimen/padding_5"
       android:drawableEnd="@drawable/ic_english"
       style="@style/TextStyleSemiBold"
       android:textSize="@dimen/text_15"
       android:button="@drawable/language_selector"/>
— Tejas Kanani
źródło
Dodatkowym atutem jest zawsze dołączenie szczegółów lub odniesienie do dalszej nauki. Sprawia, że ​​twoje odpowiedzi są bardziej przydatne
— mw509
-1 
<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">


        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="@string/location_permissions"
            android:textAppearance="@style/TextAppearance.AppCompat.Medium"
            android:textColor="@android:color/black" />

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <CheckBox
                android:id="@+id/location_permission_checkbox"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:layout_marginRight="8dp"
                android:onClick="onLocationPermissionClicked" />

        </RelativeLayout>
    </LinearLayout>
— FAHAD HAMMAD ALOTAIBI
źródło
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.