中心CheckBox内部可绘制

Question

我有一个CheckBox我想要在自己的边界内居中,而不是被推到一边.可能比解释更容易证明:

请注意,它不居中.目前定义为:

<CheckBox
    android:id="@+id/checkbox_star"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:button="@drawable/btn_favorite"

    android:layout_gravity="center"
    android:minWidth="48dp" />

没关系自定义按钮drawable.它与香草的行为相同CheckBox(小复选框的行为相同).

Answer 1

我认为问题是Checkbox小部件使用带有drawableLeft属性的常规TextView ,因为它也希望显示文本.(这就是为什么你看到它垂直居中,但略微偏向左边.)

如果您只是想要一个具有多个状态的图像按钮,我建议在状态列表选择器中使用ToggleButton和自定义图像.或者,您可以创建一个扩展ImageView并实现Checkable的自定义类.

Answer 2

我正在使用MaterialCheckBoxfrom material-components-android（或AppCompatCheckBox. 它们很相似）。

我发现如果 CheckBox 没有任何文本，则设置它android:minWidth="0dp"并android:minHeight="0dp"可以删除所有填充并将可绘制对象居中。

Answer 3

您可以使用父布局来实现此目的:

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:gravity="center">

    <CheckBox
        android:id="@+id/checkbox_star"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="Check box text" />
</LinearLayout>

Answer 4

这种对齐问题可以通过CheckableImageView解决,CheckableImageView是一种View可以直接扩展ImageView或AppCompatImageView实现的自定义Checkable.它还有其他ImageView属性.

import android.content.Context;
import android.util.AttributeSet;
import android.view.View;
import android.widget.Checkable;
import android.widget.ImageView;

/**
 * @author hendrawd on 6/23/16
 */
public class CheckableImageView extends ImageView implements Checkable {

    public CheckableImageView(Context context) {
        super(context);
    }

    public CheckableImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    private boolean mChecked = false;

    private static final int[] CHECKED_STATE_SET = {android.R.attr.state_checked};

    @Override
    public int[] onCreateDrawableState(final int extraSpace) {
        final int[] drawableState = super.onCreateDrawableState(extraSpace + 1);
        if (isChecked())
            mergeDrawableStates(drawableState, CHECKED_STATE_SET);
        return drawableState;
    }

    @Override
    public void setChecked(boolean checked) {
        if (mChecked != checked) {
            mChecked = checked;
            refreshDrawableState();
        }
    }

    @Override
    public boolean isChecked() {
        return mChecked;
    }

    @Override
    public void toggle() {
        setChecked(!mChecked);
    }

    @Override
    public void setOnClickListener(final OnClickListener l) {
        View.OnClickListener onClickListener = new OnClickListener() {
            @Override
            public void onClick(View v) {
                toggle();
                l.onClick(v);
            }
        };
        super.setOnClickListener(onClickListener);
    }
}

只需将您的选择器drawable设置为XML的src属性,并且将自动跟踪可绘制的检查状态.

使用示例

<your.package.name.CheckableImageView
    android:id="@+id/some_id"
    android:layout_width="48dp"
    android:layout_height="48dp"
    android:src="@drawable/set_your_selector_here"
    android:padding="14dp"
    android:gravity="center" />

选择器示例(放在带有扩展名的drawable文件夹中.xml)

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/ic_cb_check" android:state_checked="true" android:state_focused="true" />
    <item android:drawable="@drawable/ic_cb_uncheck" android:state_checked="false" android:state_focused="true" />
    <item android:drawable="@drawable/ic_cb_uncheck" android:state_checked="false" />
    <item android:drawable="@drawable/ic_cb_check" android:state_checked="true" />
</selector>

使用您的首选图像更改ic_cb_check和ic_cb_uncheck.

此代码也可在https://gist.github.com/hendrawd/661824a721c22b3244667379e9358b5f获取

Answer 5

android:button="@null"
android:foreground="@drawable/btn_favorite" 
android:foregroundGravity="center"

Answer 6

唯一合适的解决方案是向图像添加插图。大多数带有“前景”的解决方案都无法在API 23以下使用。

btn_favorite_inset.xml 在可绘制目录中

<inset xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/btn_favorite"
    android:insetLeft="6dp"
    android:insetTop="6dp"
    android:insetRight="6dp"
    android:insetBottom="6dp" />

您的布局文件

<CheckBox
    android:id="@+id/checkbox_star"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:button="@drawable/btn_favorite_inset"
    android:layout_gravity="center"
    android:minWidth="48dp" />