在android中定义自定义复选框

Question

如何在android中制作自定义复选框

我当前的 XML::

<LinearLayout
            android:id="@+id/linearLayout_individualdays"
            android:layout_width="wrap_content"
            android:layout_height="40dp"
            android:layout_below="@+id/linearLayout_type_of_days"
            android:gravity="center|top"
            android:orientation="horizontal"
            android:paddingLeft="5dp"
            android:paddingTop="10dp"
            android:visibility="gone" >

            <CheckBox
                android:id="@+id/checkBox1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Mon" />

            <CheckBox
                android:id="@+id/checkBox2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Tue" />

            <CheckBox
                android:id="@+id/checkBox3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Wed" />

            <CheckBox
                android:id="@+id/checkBox4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Thu" />

        </LinearLayout>

输出::

但是如何制作类似下面的东西::

• 这里的蓝色边框显示其被选中
• 否则未选中
• 必须是复选框

希望我清楚！

Answer 1

使用此代码

可绘制文件夹中的select.xml

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android" >

        <solid android:color="#ffffff" >
        </solid>

        <stroke
            android:width="2dp"
            android:color="#ff0000" >
        </stroke>
<corners android:radius="5dp" />

    <padding
        android:bottom="4dp"
        android:left="4dp"
        android:right="4dp"
        android:top="4dp" />
    </shape>

可绘制文件夹中的取消选择.xml

 <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android" >

        <solid android:color="#ffffff" >
        </solid>

        <stroke
            android:width="2dp"
            android:color="#000000" >
        </stroke>
    <corners android:radius="5dp" />

    <padding
        android:bottom="4dp"
        android:left="4dp"
        android:right="4dp"
        android:top="4dp" />
    </shape>

和自定义复选框

public class checkbox extends CheckBox{



    public checkbox(Context context, AttributeSet attrs) {
            super(context, attrs);
            //setButtonDrawable(new StateListDrawable());
        }
        @Override
        public void setChecked(boolean t){
            if(t)
            {
                this.setBackgroundResource(R.drawable.select);
            }
            else
            {
                this.setBackgroundResource(R.drawable.deselect);
            }
            super.setChecked(t);
        }
        }

复选框

 <com.example.checkbox.checkbox
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:button="@null"
        android:checked="true"
        android:text="checked" />

您可以将 select.xml 和 deselect.xml 中的颜色更改为您想要的内容

Answer 2

根据您的要求，我更喜欢您使用 CheckedTextView 而不是 CheckBox。这是您想要的代码。

 <CheckedTextView
    android:id="@+id/ctv"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Mon" 
    android:textSize="22sp"
    android:layout_margin="30dp"
    android:checked="true"
    android:background="@drawable/chk_indicator"
    android:padding="15dp"
   />    

在可绘制文件夹中创建 3 个 xml ( chk_indicator.xml , chk_bg.xml , chk_pressed_bg.xml )

chk_indicator.xml

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

<item android:drawable="@drawable/chk_bg" />

</selector>

chk_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape android:shape="rectangle" >

         <solid android:color="#ffffff"/>

         <stroke android:width="3dp"
             android:color="#ababab"/>

        <corners android:radius="10dp"/>
    </shape>
    </item>
</layer-list>

chk_pressed_bg.xml

 <?xml version="1.0" encoding="utf-8"?>
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
    <shape android:shape="rectangle" >

         <solid android:color="#ffffff"/>

         <stroke android:width="3dp"
             android:color="#5e9eff"/>

        <corners android:radius="10dp"/>
    </shape>
    </item>
 </layer-list>

输出：

在 CheckedTextView 上设置 onClick 事件

 ((CheckedTextView)findViewById(R.id.ctv)).setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View arg0) {

            boolean isChecked = ((CheckedTextView)findViewById(R.id.ctv)).isChecked();

            if(isChecked)
              ((CheckedTextView)findViewById(R.id.ctv)).setChecked(false);
            else
              ((CheckedTextView)findViewById(R.id.ctv)).setChecked(true);




        }
    });

Answer 3

<CheckBox
    android:id="@+id/DinnerRG_ID"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginRight="2dp"
    android:background="@drawable/yourbuttonbackground"
    android:button="@android:color/transparent"
    android:gravity="center_horizontal"
    android:padding="5dp"
    android:text="Wed"
    android:textSize="15dp" />

像这样试试。

Answer 4

添加到zohreh's answer，你可以得到只有文本的复选框并去掉复选框图标，如下所示，

为此，在自定义checkbox类的构造函数中设置按钮drawable为null，如下图，

public MyCheckBox(Context context, AttributeSet attrs) {
    super(context, attrs);
    // Don't show the checkbox.
    setButtonDrawable(null);
}