Come mostrare la casella di controllo Android sul lato destro?


146

Per impostazione predefinita, la casella di controllo Android mostra il testo a destra e la casella di controllo a sinistra
Voglio mostrare la casella di controllo a destra con il testo a sinistra

come posso raggiungere questo obiettivo?

Risposte:


41

Non riesco a pensare a un modo con lo stile, ma potresti semplicemente impostare il testo della casella di controllo su niente e mettere un TextView a sinistra della casella di controllo con il testo desiderato.


ho una domanda al riguardo: quando fai clic sul layout, dovrebbe mostrare (per un tempo molto breve) che l'intera riga è selezionata. come lo fai e simuli che è un effetto nativo?
sviluppatore Android

non importa - ho impostato un selettore per il layout e ora è ok.
sviluppatore Android

@androiddeveloper, per favore, puoi pubblicare la soluzione di selezione?
Fouad Wahabi,

1
@FouadWahabi È possibile creare un drawable xml in "res / drawable", come tale: stackoverflow.com/a/2038086 , e impostare lo sfondo della vista / del layout in questo file disegnabile. Potrebbe essere necessario renderlo anche selezionabile. Penso di aver visto anche una lezione di Google IO al riguardo. non sono sicuro. consiglio vivamente di controllare il loro video.
sviluppatore Android

1
@FouadWahabi Bene, puoi estendere la classe di layout che hai scelto e aggiungere questa logica da solo. Puoi esaminare tutte le visualizzazioni figlio e alternare il loro stato. Puoi utilizzare questi link per aiutarti: developer.android.com/samples/CustomChoiceList/src/… , antoine-merle.com/blog/2013/07/17/… . aggiungi un clickListener e attiva il controllo, e all'interno di "setChecked" imposta lo stato delle viste figlio di conseguenza, ma solo se implementano Checkable.
sviluppatore Android

362

Penso che sia troppo tardi per rispondere a questa domanda, ma in realtà c'è un modo per raggiungere il tuo obiettivo. Devi solo aggiungere la seguente riga alla tua casella di controllo:

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

Puoi usare anche il tuo disegno personalizzato per la casella di controllo.

E per un pulsante radio:

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

E se vuoi farlo a livello di codice:

Definire un layout e denominarlo RightCheckBox e copiare le seguenti righe:

<?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"/>

e quando è necessario aggiungerlo a livello di programmazione, è sufficiente gonfiarlo in un CheckBox e aggiungerlo alla vista principale.

CheckBox cb = (CheckBox)((LayoutInflater)getSystemService(LAYOUT_INFLATER_SERVICE)).inflate(R.layout.check_right_checkbox,null);
rootView.addView(cb);

5
E per una casella di controllo, puoi usare android:drawableRight="?android:attr/listChoiceIndicatorMultiple". Penso che questa sia la soluzione migliore per una casella di controllo sulla destra che ho trovato finora.
Pierre-Luc Paour,

7
Si noti che Android 5.0 SDK ti mostrerà un avviso sui dispositivi RTL. Per farlo sparire, basta aggiungere android:drawableEndoltre a android:drawableRight(con lo stesso valore).
Quentin S.

6
Questa soluzione ha funzionato abbastanza bene per risolvere il problema. Su Android 5. +, tuttavia, mentre il widget standard contiene il ripple disegnabile in una piccola area attorno al controllo, questo widget modificato consente all'ondulazione di espandersi ben oltre i limiti del widget stesso. Se si utilizza questa tecnica, suggerisco di impostare lo sfondo per utilizzare un ripple disegnabile con una maschera rettangolare.
Justin Pollard,

2
Android offre una dozzina di oggetti di visualizzazione, che possono essere modificati per disegnare un disegno Android o un disegno personalizzato. Se si desidera l'effetto di ripple (5.0+) sull'oggetto, è sufficiente impostare lo sfondo su un drawable XML che abilita il ripple. Il seguente link mostra diversi oggetti di visualizzazione di esempio, CheckedTextView, CheckBox, ToggleButton, ecc. Con il set eseguibile corretto. landenlabs.com/android/uicomponents/uicomponents.html#checkbox
LanDenLabs

6
Mostra un'increspatura rotonda al centro del testo, ma non sulla destra disegnabile, quindi sembra brutta sulle moderne versioni di Android
Leo Droidcoder,

122

Tu puoi fare

<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" />

La riga seguente è sufficiente

android:layoutDirection="rtl"

3
Hacky ed elegante allo stesso tempo. Saluti!
Roman Samoilenko,

Bravo amico! non dimenticare la gravità: android: gravity = "right | center" per ottenere l'effetto di mirroring previsto.
Tobliug,

3
questo non è il modo corretto, perché se il tuo dispositivo è in una lingua RTL, non sembrerà giusto.
Martin Marconcini,

cb.setLayoutDirection (CheckBox.LAYOUT_DIRECTION_RTL);
Paakjis,

1
È necessario impostare la android:gravity="end|center_vertical"visualizzazione del testo a sinistra perché il layout inizia ora.
Serge,

52

Puoi aggiungere android:layoutDirection="rtl"ma è disponibile solo con API 17.


19

Copia questo:

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

Buona codding! :)


14

Il testo della casella di controllo potrebbe non essere allineato a sinistra con

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

in alcuni dispositivi. Può utilizzare CheckedTextView in sostituzione per evitare il problema,

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

e questo link sarà utile: Allinea testo a sinistra, casella di controllo a destra


Questo è un pulsante di opzione. Che ne dici di quello per la casella di controllo del materiale, per favore?
Monica Aspiras Labbao,

1
Per una casella di controllo utilizzareandroid:checkMark="?android:attr/listChoiceIndicatorMultiple"
Philipp

Per un pulsante di opzione utilizzareandroid: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" />`

Ciò rende anche il testo allineato a destra, quindi se la vista della casella di controllo corrisponde alla larghezza principale, sembrerà strana.
David Rector,

6

Come suggerito da @The Berga Puoi aggiungere android:layoutDirection="rtl"ma è disponibile solo con l'API 17.
per l'implementazione dinamica, eccola qui

chkBox.setLayoutDirection(View.LAYOUT_DIRECTION_RTL);


3

inoltre da Hazhir imput, per questo problema è necessario iniettare quella proprietà nella configurazione xml checkbox android: paddingLeft = "0dp", questo serve per evitare lo spazio vuoto nella parte sinistra della casella.


3

Aggiunta di un'altra risposta a questa domanda che utilizza CheckedTextView Se qualcuno sta provando a farlo in modo programmatico. Ha anche la possibilità di utilizzare immagini personalizzate per la casella di controllo. E può essere fatto in una singola vista

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

Da XML se si desidera avviare -

<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"/>

0

Il seguente link mostra come eseguire il rendering di oggetti vista Android standard multipli con una casella di controllo animata sulla destra impostando il disegno a destra.

Imposta lo sfondo per ottenere un effetto a catena.

[collegamento al sito Web con la casella di controllo di esempio sul lato destro e sinistro.] [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" />

Checkline.xml di esempio (in drawable, vedere il link per la versione animata in drawable-v21)

Esempio transparent_ripple.xml (in 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>


Sample transparent_ripple.xml (in drawable, evidenzia solo nessuna ondulazione disponibile

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


0

Se non è obbligatorio utilizzare un, CheckBoxè possibile utilizzare Switchinvece un . Un interruttore mostra il testo sul lato sinistro per impostazione predefinita.


0

Puoi usare anche questo,

<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"/>

È sempre credito in più includere un po 'di dettagli o un riferimento per ulteriori studi. Rende le tue risposte più utili
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>
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.