右側にandroidチェックボックスを表示する方法は？

146

デフォルトでは、Androidのチェックボックスは右側にテキストを表示し、左側
にチェックボックスを表示します左側にテキストを表示して右側にチェックボックスを表示したい

どうすればこれを達成できますか？

android  layout  checkbox 
— UMAR-MOBITSOLUTIONS
ソース

回答:

41

私はスタイリングの方法を考えることができませんが、チェックボックスのテキストを何も設定せず、目的のテキストを含むチェックボックスの左側にTextViewを配置することができます。

— xil3
ソース
これについて質問があります。レイアウトをクリックすると、行全体が選択されていることが（非常に短時間で）表示されます。どのようにそれを行い、それがネイティブ効果であることをシミュレートしますか？
— Android開発者
気にしないでください-私はセレクターをレイアウトに設定しましたが、今は大丈夫です。
— Android開発者
@androiddeveloperセレクタセレクタソリューションを投稿できますか？
— Fouad Wahabi 2014年
1
@FouadWahabi "res / drawable"に次のようにxmlドローアブルを作成できます：stackoverflow.com/a/2038086、ビュー/レイアウトの背景をこのドローアブルファイルに設定します。クリック可能にする必要がある場合もあります。それについてのGoogle IOの講義も見たと思います。わからない。ビデオを確認することを強くお勧めします。
— Android開発者
1
@FouadWahabi選択したレイアウトクラスを拡張して、このロジックを自分で追加できます。すべての子ビューを確認して、その状態を切り替えることができます。それらのリンクを使用して支援することができます：developer.android.com/samples/CustomChoiceList/src/…、antoine-merle.com / blog / 2013/07/17 /…。clickListenerを追加してチェックを切り替え、「setChecked」内で子ビューの状態を適宜設定しますが、子ビューがCheckableを実装している場合のみです。
— Android開発者
362

この質問に答えるのは遅すぎると思いますが、実際にはあなたの目標を達成する方法があります。チェックボックスに次の行を追加するだけです。

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

カスタマイズしたドローアブルをチェックボックスに使用することもできます。

そして、radioButtonの場合：

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

そして、それをプログラムで行いたい場合：

レイアウトを定義して、RightCheckBoxという名前を付け、次の行をコピーします。

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

プログラムで追加する必要がある場合は、CheckBoxにインフレートしてルートビューに追加するだけです。

CheckBox cb = (CheckBox)((LayoutInflater)getSystemService(LAYOUT_INFLATER_SERVICE)).inflate(R.layout.check_right_checkbox,null);
rootView.addView(cb);
— ハジル
ソース
5
また、チェックボックスにはを使用できますandroid:drawableRight="?android:attr/listChoiceIndicatorMultiple"。これは、これまでに見つけた右側のチェックボックスに最適なソリューションだと思います。
— Pierre-Luc Paour 2014
7
Android 5.0 SDKではRTLデバイスに関する警告が表示されることに注意してください。それをなくすには、（同じ値で）android:drawableEndに加えて追加しandroid:drawableRightます。
— Quentin S.
6
このソリューションは問題を解決するのにかなりうまくいきました。ただし、Android 5. +では、標準ウィジェットにはチェックの周囲の小さな領域に描画可能なリップルが含まれていますが、この変更されたウィジェットにより、リップルをウィジェット自体の境界を超えて拡張できます。この手法を使用する場合は、長方形のマスクでリップルドローアブルを使用するように背景を設定することをお勧めします。
— Justin Pollard、
2
Androidは12個のビューオブジェクトを提供します。これらはすべて、Androidドローアブルまたはカスタムドローアブルのいずれかを描画するように変更できます。オブジェクトに波紋効果（5.0以上）が必要な場合は、その背景を波紋を有効にするXMLドローアブルに設定するだけです。次のリンクは、正しいdrwableが設定されたいくつかのサンプルビューオブジェクト、CheckedTextView、CheckBox、ToggleButtonなどを示しています。 landenlabs.com/android/uicomponents/uicomponents.html#checkbox
— LanDenLabs
6
テキストの中央に丸い波紋が表示されますが、右側のドローアブルには表示されないため、最新のAndroidバージョンでは
— 見栄えが悪くなり
122

できるよ

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

次の行で十分です 

android:layoutDirection="rtl"
— マヘシュ・ラッド
ソース
3
ハックとエレガントを同時に。乾杯！
— ローマサモイレンコ2017
グッドトリックマン！予想されるミラーリング効果を得るには、重力：android：gravity = "right | center"を忘れないでください。
— Tobliug
3
これは正しい方法ではありません。デバイスがRTL言語を使用している場合、正しく表示されないためです。
— マルタンマルコンチーニ
cb.setLayoutDirection（CheckBox.LAYOUT_DIRECTION_RTL）;
— paakjis
1
android:gravity="end|center_vertical"レイアウトが今から始まるため、テキストを左に表示するように設定する必要があります。
— Serge、
52

追加android:layoutDirection="rtl"できますが、API 17でのみ使用できます。

— ベルガ
ソース
19

これをコピーしてください：

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

ハッピーコード！:)

— イヴォ・ストヤノフ
ソース
14

チェックボックスのテキストが左揃えにならない可能性があります

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

一部のデバイスで。問題を回避するための代わりにCheckedTextViewを使用できます。

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

このリンクは役に立ちます：テキストを左揃え、チェックボックスを右

— cfh008
ソース
それはラジオボタンです。素材チェックボックスの方はいかがですか？
— Monica Aspiras Labbao
1
チェックボックスの使用android:checkMark="?android:attr/listChoiceIndicatorMultiple"
— Philipp
ラジオボタンの使用android: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" />`
— ケリム・フィラット
ソース
また、テキストが右揃えになるため、チェックボックスビューが親の幅と一致していると、奇妙に見えます。
— David Rector
6

@The Bergaで提案されているように追加できますが 、動的実装のandroid:layoutDirection="rtl"API 17
でのみ使用できます。

chkBox.setLayoutDirection(View.LAYOUT_DIRECTION_RTL);
— スリカンス
ソース
3

さらに、Hazhir imputから、この問題はチェックボックスのxml設定android：paddingLeft = "0dp"にそのプロパティを挿入する必要があるため、これはチェックボックスの左側の空スペースを避けるためです。

— ゼウスボーイ
ソース
3

CheckedTextViewを使用するこの質問に別の回答を追加します。誰かがプログラムでそれを行おうとしている場合。チェックボックスにカスタム画像を使用するオプションもあります。そして、単一のビューで行うことができます

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

開始したい場合はXMLから- 

<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"/>
— カピルG
ソース
0

次のリンクは、右側のドローアブルを設定して、右側にアニメーション化されたチェックボックスを備えたいくつかの標準Androidビューオブジェクトをレンダリングする方法を示しています。

波紋効果を得るために背景を設定します。

[左右にチェックボックスの例があるウェブサイトへのリンク。] [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のサンプル（drawableの場合、drawable-v21のアニメーションバージョンのリンクを参照）

transparent_ripple.xmlのサンプル（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>

transparent_ripple.xmlのサンプル（ドローアブルでは、利用可能なリップルのみを強調表示します 

<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
ソース
0

を使用するCheckBox必要がない場合は、Switch代わりにを使用できます。スイッチはデフォルトで左側にテキストを表示します。

— オリバー・クランツ
ソース
0

これも使えます

<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"/>
— テハスカナニ
ソース
細かいことや、さらに勉強するための参照を含めることは、常に追加のクレジットです。回答をより便利にします
— 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>
— ファハドハンマドアロタイビ
ソース
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.