web-dev-qa-db-ja.com

カスタムチェックボックス画像android

チェックボックスにカスタム画像を使用する簡単な方法はありますか? Gmailの「スター付き」動作を複製したいと考えています。だから、チェックされたときに、塗りつぶされた星のチェックボックスが欲しい。そしてチェックされていないときは空の星です。 imageviewを使用し、自分でロジックを自分で行う必要がありますか?

168
Falmarri

ボタンの子であるチェックボックスは、「ボタンスタイル」の下で here のように、チェックボックスにいくつかの状態の背景画像を与えることができます。

...そして例示 ここ

127
Jean

描画可能なチェックボックスセレクターを作成します。

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

チェックボックスがこのようなものであることを確認してくださいAndroid:button="@drawable/checkbox_selector"

<CheckBox
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:button="@drawable/checkbox_selector"
    Android:text="CheckBox"
    Android:textAppearance="?android:attr/textAppearanceLarge"
    Android:textColor="@color/Black" />

Btn_check.xmlをAndroid-sdk/platforms/Android-#/ data/res/drawableからプロジェクトの描画可能フォルダーにコピーし、「オン」と「オフ」の画像状態をカスタム画像に変更します。

それからあなたのxmlはただAndroid:button="@drawable/btn_check"を必要とします

<CheckBox
    Android:button="@drawable/btn_check"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:checked="true" />

別のデフォルトAndroidアイコンを使用する場合は、Android:button="@Android:drawable/..."を使用できます

44

res/drawable/day_selector.xml

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

res/layout/my_layout.xml

<CheckBox
    Android:id="@+id/check"
    Android:layout_width="39dp"
    Android:layout_height="39dp"
    Android:background="@drawable/day_selector"
    Android:button="@null"
    Android:gravity="center"
    Android:text="S"
    Android:textColor="@color/black"
    Android:textSize="12sp" />
8
Rahul

Androidオープンソースコードがある場合、スタイル定義は次の場所にあります。
src/frameworks/base/core/res/res/values

<style name="Widget.CompoundButton.CheckBox">
    <item name="Android:background">
        @Android:drawable/btn_check_label_background
    </item>
    <item name="Android:button">
        ?android:attr/listChoiceIndicatorMultiple
    </item>
</style>
5
achellies

それを試してみてください -

package com;

import Android.content.Context;
import Android.content.res.TypedArray;
import Android.util.AttributeSet;
import Android.view.View;
import Android.widget.ImageView;



public class CheckBoxImageView extends ImageView implements View.OnClickListener {
    boolean checked;
    int defImageRes;
    int checkedImageRes;
    OnCheckedChangeListener onCheckedChangeListener;

    public CheckBoxImageView(Context context, AttributeSet attr, int defStyle) {
        super(context, attr, defStyle);
        init(attr, defStyle);
    }

    public CheckBoxImageView(Context context, AttributeSet attr) {
        super(context, attr);
        init(attr, -1);
    }

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

    public boolean isChecked() {
        return checked;
    }

    public void setChecked(boolean checked) {
        this.checked = checked;
        setImageResource(checked ? checkedImageRes : defImageRes);
    }

    private void init(AttributeSet attributeSet, int defStyle) {
        TypedArray a = null;
        if (defStyle != -1)
            a = getContext().obtainStyledAttributes(attributeSet, R.styleable.CheckBoxImageView, defStyle, 0);
        else
            a = getContext().obtainStyledAttributes(attributeSet, R.styleable.CheckBoxImageView);
        defImageRes = a.getResourceId(0, 0);
        checkedImageRes = a.getResourceId(1, 0);
        checked = a.getBoolean(2, false);
        a.recycle();
        setImageResource(checked ? checkedImageRes : defImageRes);
        setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        checked = !checked;
        setImageResource(checked ? checkedImageRes : defImageRes);
        onCheckedChangeListener.onCheckedChanged(this, checked);
    }

    public void setOnCheckedChangeListener(OnCheckedChangeListener onCheckedChangeListener) {
        this.onCheckedChangeListener = onCheckedChangeListener;
    }

    public static interface OnCheckedChangeListener {
        void onCheckedChanged(View buttonView, boolean isChecked);
    }
}

この属性を追加-

<declare-styleable name="CheckBoxImageView">
        <attr name="default_img" format="integer"/>
        <attr name="checked_img" format="integer"/>
        <attr name="checked" format="boolean"/>
</declare-styleable>

使用-

 <com.adonta.ziva.consumer.wrapper.CheckBoxImageView
        xmlns:app="http://schemas.Android.com/apk/res-auto"
        Android:id="@+id/checkBox"
        Android:layout_width="40dp"
        Android:layout_height="40dp"
        Android:layout_alignParentRight="true"
        Android:layout_centerVertical="true"
        Android:clickable="true"
        Android:padding="5dp"
        app:checked_img="@drawable/check_box_checked"
        app:default_img="@drawable/check_box" />

それはすべての問題を解決します。

3
Neo

もう1つのオプションは、 ToggleButton を背景がnullでカスタムボタンを使用することです。

テキストの色へのセレクターも含む例を以下に示します。

<ToggleButton
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:button="@drawable/toggle_selector"
    Android:background="@null"
    Android:paddingLeft="10dp"
    Android:layout_centerHorizontal="true"
    Android:gravity="center"
    Android:textColor="@drawable/toggle_text"
    Android:textOn="My on state"
    Android:textOff="My off state" />

toggle_selector.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/state_on" />

    <item
        Android:drawable="@drawable/state_off" />

</selector>

toggle_text.xml

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

    <item
        Android:state_checked="true"
        Android:color="@color/app_color" />

    <item
        Android:color="@Android:color/darker_gray" />

</selector>
2
androidevil

カスタムアダプタを使用している場合は、Android:focusable="false"およびAndroid:focusableInTouchMode="false"は、チェックボックスを使用中にリストアイテムをクリック可能にする必要があります。

<CheckBox
        Android:id="@+id/checkbox_fav"
        Android:focusable="false"
        Android:focusableInTouchMode="false"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:button="@drawable/checkbox_layout"/>

drawable> checkbox_layout.xml

<selector xmlns:Android="http://schemas.Android.com/apk/res/Android" >
    <item Android:drawable="@drawable/uncked_checkbox"
        Android:state_checked="false"/>
    <item Android:drawable="@drawable/selected_checkbox"
        Android:state_checked="true"/>
    <item Android:drawable="@drawable/uncked_checkbox"/>
</selector>
0
Chitransh Goud