在android中定义custom-checkbox

时间:2013-11-16 06:22:22

标签: android android-checkbox

如何在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>

出将 ::

enter image description here

但如何制作以下内容 ::

enter image description here

  • 此处蓝色边框显示其选定的
  • 其他未选中
  • 必须是一个复选框

希望我很清楚!

4 个答案:

答案 0 :(得分:16)

使用此代码

可绘制文件夹中的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>

在drawable文件夹中取消选择

 <?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更改为您想要的内容

答案 1 :(得分:15)

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

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

在drawable文件夹中创建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>

输出:

image http://i41.tinypic.com/2dawois.png

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




        }
    });

答案 2 :(得分:2)

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

enter image description here

试试这样。

答案 3 :(得分:1)

添加到zohreh's answer,您可以获取仅包含文字的复选框,并删除复选框图标,如下所示,

enter image description here

为此,在自定义复选框类的构造函数中将drawable按钮设置为null,如下所示,

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