Wie wird das Kontrollkästchen für Android auf der rechten Seite angezeigt?

146

Standardmäßig zeigt das Kontrollkästchen für Android Text auf der rechten Seite und das Kontrollkästchen auf der linken Seite an.
Ich möchte das Kontrollkästchen auf der rechten Seite mit Text auf der linken Seite anzeigen

Wie erreiche ich das?

android layout checkbox UMAR-MOBITSOLUTIONS
quelle

Antworten:

41

Ich kann mir keine Möglichkeit für das Styling vorstellen, aber Sie können einfach den Text des Kontrollkästchens auf nichts setzen und eine Textansicht mit dem gewünschten Text links neben dem Kontrollkästchen platzieren.

xil3
quelle
Ich habe eine Frage dazu: Wenn Sie auf das Layout klicken, sollte es (für eine sehr kurze Zeit) zeigen, dass die gesamte Zeile ausgewählt ist. Wie machst du das und simulierst, dass es ein nativer Effekt ist?
Android-Entwickler
egal - ich habe einen Selektor für das Layout eingestellt und jetzt ist es in Ordnung.
Android-Entwickler
@androiddeveloper bitte kannst du die Selektorlösung posten?
Fouad Wahabi
1
@FouadWahabi Sie können eine XML-Zeichnung in "res / drawable" als solche erstellen : stackoverflow.com/a/2038086 , und den Hintergrund der Ansicht / des Layouts als diese zeichnbare Datei festlegen. Möglicherweise müssen Sie es auch anklickbar machen. Ich glaube, ich habe auch einen Google IO-Vortrag darüber gesehen. nicht sicher. Ich kann nur empfehlen, das Video zu überprüfen.
Android-Entwickler
1
@FouadWahabi Nun, Sie können die von Ihnen ausgewählte Layoutklasse erweitern und diese Logik selbst hinzufügen. Sie können alle untergeordneten Ansichten durchgehen und ihren Status umschalten. Sie können diese Links verwenden, um Ihnen zu helfen: developer.android.com/samples/CustomChoiceList/src/… , antoine-merle.com/blog/2013/07/17/… . Fügen Sie einen clickListener hinzu, schalten Sie die Prüfung um und legen Sie in "setChecked" den Status der untergeordneten Ansichten entsprechend fest, jedoch nur, wenn sie Checkable implementieren.
Android-Entwickler
359

Ich denke, es ist zu spät, um diese Frage zu beantworten, aber tatsächlich gibt es einen Weg, um Ihr Ziel zu erreichen. Sie müssen nur die folgende Zeile zu Ihrem Kontrollkästchen hinzufügen:

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

Sie können auch Ihr benutzerdefiniertes Zeichenfeld für Zeichnungszeichen verwenden.

Und für einen RadioButton:

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

Und wenn Sie es programmgesteuert tun möchten:

Definieren Sie ein Layout und nennen Sie es RightCheckBox und kopieren Sie die folgenden Zeilen:

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

und wenn Sie es programmgesteuert hinzufügen müssen, müssen Sie es nur in eine CheckBox aufblasen und zur Stammansicht hinzufügen.

CheckBox cb = (CheckBox)((LayoutInflater)getSystemService(LAYOUT_INFLATER_SERVICE)).inflate(R.layout.check_right_checkbox,null);
rootView.addView(cb);
Hazhir
quelle
5
Und für ein Kontrollkästchen können Sie verwenden android:drawableRight="?android:attr/listChoiceIndicatorMultiple". Ich denke, dies ist die beste Lösung für ein Kontrollkästchen auf der rechten Seite, das ich bisher gefunden habe.
Pierre-Luc Paour
7
Bitte beachten Sie, dass das Android 5.0 SDK eine Warnung zu RTL-Geräten anzeigt. Um es verschwinden zu lassen, fügen Sie einfach android:drawableEndzusätzlich zu android:drawableRight(mit dem gleichen Wert) hinzu.
Quentin S.
5
Diese Lösung hat ziemlich gut funktioniert, um das Problem zu lösen. Unter Android 5. + enthält das modifizierte Widget zwar die Welligkeit, die auf einen kleinen Bereich um den Scheck herum gezeichnet werden kann, aber mit diesem modifizierten Widget kann sich die Welligkeit weit über die Grenzen des Widgets hinaus erweitern. Wenn Sie diese Technik verwenden, empfehle ich, den Hintergrund so einzustellen, dass eine mit einer rechteckigen Maske gezeichnete Welligkeit verwendet wird.
Justin Pollard
1
Android bietet ein Dutzend Ansichtsobjekte, die alle geändert werden können, um entweder ein Android-Zeichen oder ein benutzerdefiniertes Zeichen zu zeichnen. Wenn Sie den Ripple-Effekt (5.0+) für das Objekt wünschen, setzen Sie einfach den Hintergrund auf ein XML-Zeichen, das die Ripple aktiviert. Der folgende Link zeigt mehrere Beispiele für Ansichtsobjekte, CheckedTextView, CheckBox, ToggleButton usw. mit dem richtigen Drwable-Set. landlabs.com/android/uicomponents/uicomponents.html#checkbox
LanDenLabs
5
Es zeigt eine runde Welligkeit in der Mitte des Textes, aber nicht auf der rechten Seite zeichnbar, sieht also auf modernen Android-Versionen hässlich aus
Leo Droidcoder
121

Du kannst tun

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

Die folgende Zeile reicht aus 

android:layoutDirection="rtl"
Mahesh Lad
quelle
3
Hacky und elegant zugleich. Prost!
Roman Samoilenko
Guter Trickmann! Vergessen Sie nicht die Schwerkraft: android :vity = "right | center", um den erwarteten Spiegelungseffekt zu erzielen.
Tobliug
3
Dies ist nicht der richtige Weg, da Ihr Gerät in einer RTL-Sprache nicht richtig aussieht.
Martin Marconcini
cb.setLayoutDirection (CheckBox.LAYOUT_DIRECTION_RTL);
Paakjis
1
Sie müssen festlegen android:gravity="end|center_vertical", dass der Text links angezeigt wird, da das Layout jetzt beginnt.
Serge
52

Sie können hinzufügen, android:layoutDirection="rtl"aber es ist nur mit API 17 verfügbar.

Die Berga
quelle
19

Kopieren Sie einfach Folgendes:

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

Viel Spaß beim Codieren! :) :)

Ivo Stoyanov
quelle
14

Der Text des Kontrollkästchens wird möglicherweise nicht nach links ausgerichtet

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

in einem Gerät. Kann CheckedTextView als Ersatz verwenden, um das Problem zu vermeiden.

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

und dieser Link wird hilfreich sein: Text links ausrichten, Kontrollkästchen rechts

cfh008
quelle
Das ist ein Optionsfeld. Wie wäre es bitte mit dem für das Material-Kontrollkästchen?
Monica Aspiras Labbao
1
Für ein Kontrollkästchen verwendenandroid:checkMark="?android:attr/listChoiceIndicatorMultiple"
Philipp
Für einen Radiobutton verwendenandroid: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
quelle
Dadurch wird der Text auch rechtsbündig ausgerichtet. Wenn die Kontrollkästchenansicht mit der übergeordneten Breite übereinstimmt, sieht sie seltsam aus.
David Rector
6

Wie von @The Berga vorgeschlagen Sie können hinzufügen, android:layoutDirection="rtl"aber es ist nur mit API 17 verfügbar.
Für die dynamische Implementierung, hier geht es

chkBox.setLayoutDirection(View.LAYOUT_DIRECTION_RTL);
Sri Kanth
quelle
3

Außerdem von Hazhir imput, für dieses Problem ist es notwendig, diese Eigenschaft in das Kontrollkästchen XML-Konfiguration android: paddingLeft = "0dp" einzufügen, um den leeren Raum auf der linken Seite des Kontrollkästchens zu vermeiden.

Zeusboy
quelle
3

Hinzufügen einer weiteren Antwort auf diese Frage, die CheckedTextView verwendet Wenn jemand versucht, dies programmgesteuert zu tun. Es besteht auch die Möglichkeit, benutzerdefinierte Bilder für das Kontrollkästchen zu verwenden. Und kann in einer einzigen Ansicht durchgeführt werden

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

Aus XML, wenn Sie initiieren möchten - 

<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.
quelle
0

Der folgende Link zeigt, wie Sie mehrere Standard-Android-Ansichtsobjekte mit einem animierten Kontrollkästchen auf der rechten Seite rendern, indem Sie das richtige Zeichenelement festlegen.

Stellen Sie den Hintergrund ein, um einen Welleneffekt zu erzielen.

[Link zur Website mit Beispiel-Kontrollkästchen auf der rechten und linken Seite.] [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" />

Beispiel checkline.xml (in drawable, siehe Link für animierte Version in drawable-v21)

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

Beispiel transparent_ripple.xml (in zeichnbar markieren Sie nur keine verfügbare Welligkeit 

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

Wenn die Verwendung von a nicht obligatorisch ist, können CheckBoxSie Switchstattdessen einfach a verwenden. Ein Schalter zeigt standardmäßig den Text auf der linken Seite an.

Oliver Kranz
quelle
0

Sie können dies auch verwenden,

<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
quelle
Es ist immer eine zusätzliche Ehre, ein paar Details oder eine Referenz für das weitere Studium beizufügen. Macht Ihre Antworten nützlicher
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
quelle