How do I make the Checkbox in Android CheckedTextView be left aligned instead of right aligned?

Question

I am trying to use R.layout.simple_list_item_multiple_choice with ListView. CheckedTextView is used in simple_list_item_multiple_choice.xml, but how can I make the checkbox be left aligned instead of right aligned?

Botelho

Answer 1

The secret is in android:checkMark make it null

<CheckedTextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/checked_text_single_choice"
android:layout_width="match_parent"
android:layout_height="52dp"
android:checkMark="@null"
android:gravity="center_vertical"
android:textAppearance="?android:attr/textAppearanceSmall" 
android:drawableLeft="?android:attr/listChoiceIndicatorSingle"
android:drawableRight="@null"
android:textColor="@android:color/black"
/>

Aspiration

checkMark is a drawable and setting @ null to it does nothing but removes the checkmark drawable. So this solution does not work. Instead, use the android:drawableLeft="?android:attr/listChoiceIndicatorMultiple" attribute as suggested by @Roger Keays – Package

Answer 2

Create your own row template and set android:drawableLeft on the CheckedTextView.

<CheckedTextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/text1"
android:layout_width="fill_parent"
android:layout_height="40dip"
android:gravity="center_vertical"
android:paddingLeft="5dip"
android:drawableLeft="?android:attr/listChoiceIndicatorMultiple"
/>

or

android:drawableLeft="?android:attr/listChoiceIndicatorSingle"

Jezabelle

That prevents you from using the compound drawable functionality together with the check mark indicator (which CheckedTextView by default allows). I think @CommonsWare answer is more appropriate. – Bereft

Answer 3

If you want the checkbox to be on the left, simply just use a CheckBox. Maybe it is not matter of course, but a CheckBox can contain text. You can define that text by adding an XML attribute android:text, or by calling the setText() method. Actually CheckBox is inherited from Button, which inherits from TextView, that's why it has all the text-related properties.

Leboeuf

added example CheckBox xml with screenshot in separate answer – Baelbeer

Answer 4

I don't think you can. Looking at the source code, it seems like the checkmark is drawn on the right all the time. And, to be honest, I would recommend you stick with that, for consistency -- Android gets knocked all the time because its apps have inconsistent UIs.

In the off chance that somebody is pointing a gun at your head, forcing you to change the placement of the checkmark, subclass CheckedTextView as OMGPleaseDontShootCheckedTextView, and override methods like onDraw(), with tweaked versions of the original that changes the placement of the image and text.

Pleasantry

Now with Material design checkmarks should be on the left, but the code to allow this is unfortunately private so cannot be easily backported. – Yokel

Checkmark on the left in MAterial Design material.io/design/components/selection-controls.html#usage. I'm sick of Android to this missfinctionality – Decorator

Answer 5

You can assign your drawable to drawableLeft attribute, but it won't make you any good because it not support tinting. Instead I extended CheckedTextView like that:

public class LeftSideCheckedTextView extends CheckedTextView {

    public LeftSideCheckedTextView(Context context) {
        this(context, null, 0);
    }

    public LeftSideCheckedTextView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public LeftSideCheckedTextView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        Field mCheckMarkGravity = null;
        try {
            mCheckMarkGravity = this.getClass().getSuperclass().getDeclaredField("mCheckMarkGravity");
            mCheckMarkGravity.setAccessible(true);
            mCheckMarkGravity.set(this, Gravity.START);
        } catch (Exception e) {
            Logger.error(e);
        }
    }
}

Here I access the hidden field mCheckMarkGravity which is used inside CheckedTextView but have no access via style attributes, according to this bug ticket: https://code.google.com/p/android/issues/detail?id=174517

Tony

Answer 6

An example of @WonderCsabo's suggestion to use CheckBox.

<CheckBox
    android:id="@+id/create_account_checkedTextView_password"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Show"
    android:gravity="center"
    android:checked="true"

    # relative layout params
    android:layout_alignParentEnd="true"
    android:layout_alignParentRight="true"
    android:layout_above="@+id/hint1" />

Baelbeer

Answer 7

There can be a trick with Checkable Layout like in this post - https://chris.banes.me/2013/03/22/checkable-views/ . Just use some custom layout like this as ListView item layout:

<com.example.custom_view.CheckableLinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<CheckedTextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:checkMark="?android:attr/listChoiceIndicatorSingle"
    android:duplicateParentState="true"
    .../>
<TextView
    android:id="@android:id/text1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    .../>
</com.example.custom_view.CheckableLinearLayout>

or

android:checkMark=?android:attr/listChoiceIndicatorMultiple"

Effendi

Answer 8

---

Looking at the source, it's just based on layout direction. Setting it to RTL works well enough for me.

android:layoutDirection="rtl"

Source:

   private boolean isCheckMarkAtStart() {
    final int gravity = Gravity.getAbsoluteGravity(mCheckMarkGravity, getLayoutDirection());
    final int hgrav = gravity & Gravity.HORIZONTAL_GRAVITY_MASK;
    return hgrav == Gravity.LEFT;
}

.

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);

    ...

        final boolean checkMarkAtStart = isCheckMarkAtStart();
        final int width = getWidth();
        final int top = y;
        final int bottom = top + height;
        final int left;
        final int right;
        if (checkMarkAtStart) {
            left = mBasePadding;
            right = left + mCheckMarkWidth;
        } else {
            right = width - mBasePadding;
            left = right - mCheckMarkWidth;
        }
        ...

        }
    }
}

Juniorjuniority

Answer 9

try this one and hope it will give you some ideas

 <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal" >

         <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="horizontal" >

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Connection lost sound alert"
                android:layout_weight="10"
                android:layout_gravity="center"
            />

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="2"     
            android:layout_gravity="right"
            android:orientation="horizontal" >

            <CheckBox android:id="@+id/checkbox_meat"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="right"                 
                android:onClick="onCheckboxClicked"/>

        </LinearLayout>


   </LinearLayout>

Schnabel

Answer 10

If anyone is still looking for a solution without making a Checkbox in the layout. Try the solution here.

Android ListView ArrayAdapter - checkbox/radio button arrangement

Fenland

Answer 11

Adding this line makes checkbox on left

 android:drawableLeft="?android:attr/listChoiceIndicatorMultiple"

Centrist