web-dev-qa-db-ja.com

Android選択状態のImageButton?

背景にセレクターを備えたImageButtonを使用していた場合、外観を変更できる状態を変更できますか?現時点では、押されたときに画像を変更することができますが、「ハイライト」または「選択」または同様の状態がないため、外観を自由に切り替えることができません。

これが私のXMLです。押すと外観が変わるだけです。

 <selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
<item Android:state_focused="true" Android:state_pressed="false" Android:drawable="@drawable/map_toolbar_details_selected" />
<item Android:state_focused="true" Android:state_pressed="true" Android:drawable="@drawable/map_toolbar_details_selected" />
<item Android:state_focused="false" Android:state_pressed="true" Android:drawable="@drawable/map_toolbar_details_selected" />
<item Android:drawable="@drawable/map_toolbar_details" />
78
Joren

これは私のために働く:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <!-- NOTE: order is important (the first matching state(s) is what is rendered) -->
    <item 
        Android:state_selected="true" 
        Android:drawable="@drawable/info_icon_solid_with_shadow" />
    <item 
        Android:drawable="@drawable/info_icon_outline_with_shadow" />
 </selector>

そして、Javaで:

//assign the image in code (or you can do this in your layout xml with the src attribute)
imageButton.setImageDrawable(getBaseContext().getResources().getDrawable(R.drawable....));

//set the click listener
imageButton.setOnClickListener(new OnClickListener() {

    public void onClick(View button) {
        //Set the button's appearance
        button.setSelected(!button.isSelected());

        if (button.isSelected()) {
            //Handle selected state change
        } else {
            //Handle de-select state change
        }

    }

});

スムーズな移行のために、アニメーション時間についても言及できます。

<selector xmlns:Android="http://schemas.Android.com/apk/res/Android" Android:exitFadeDuration="@Android:integer/config_mediumAnimTime">
199
joshrl

ToggleImageButtonインターフェースを実装し、CheckableおよびAndroid:checked xml属性をサポートするOnCheckedChangeListener

public class ToggleImageButton extends ImageButton implements Checkable {
    private OnCheckedChangeListener onCheckedChangeListener;

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

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

    public ToggleImageButton(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        setChecked(attrs);
    }

    private void setChecked(AttributeSet attrs) {
        TypedArray a = getContext().obtainStyledAttributes(attrs, R.styleable.ToggleImageButton);
        setChecked(a.getBoolean(R.styleable.ToggleImageButton_Android_checked, false));
        a.recycle();
    }

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

    @Override
    public void setChecked(boolean checked) {
        setSelected(checked);

        if (onCheckedChangeListener != null) {
            onCheckedChangeListener.onCheckedChanged(this, checked);
        }
    }

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

    @Override
    public boolean performClick() {
        toggle();
        return super.performClick();
    }

    public OnCheckedChangeListener getOnCheckedChangeListener() {
        return onCheckedChangeListener;
    }

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

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

res/values/attrs.xml:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="ToggleImageButton">
        <attr name="Android:checked" />
    </declare-styleable>
</resources>
16
vokilam

これ以上画像なしでこれを行う最良の方法:

public static void buttonEffect(View button){
    button.setOnTouchListener(new OnTouchListener() {

        public boolean onTouch(View v, MotionEvent event) {
            switch (event.getAction()) {
                case MotionEvent.ACTION_DOWN: {
                    v.getBackground().setColorFilter(0xe0f47521,PorterDuff.Mode.SRC_ATOP);
                    v.invalidate();
                    break;
                }
                case MotionEvent.ACTION_UP: {
                    v.getBackground().clearColorFilter();
                    v.invalidate();
                    break;
                }
            }
            return false;
        }
    });
}
9
András

これを試して:

 <item
   Android:state_focused="true"
   Android:state_enabled="true"
   Android:drawable="@drawable/map_toolbar_details_selected" />

色についても成功しました

<selector
        xmlns:Android="http://schemas.Android.com/apk/res/Android">
        <item
            Android:state_selected="true"

            Android:color="@color/primary_color" />
        <item
            Android:color="@color/secondary_color" />
</selector>
2
Alex Volovoy

res/drawableフォルダーにXMLファイルを作成します。たとえば、「btn_image.xml」:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:drawable="@drawable/bg_state_1"
          Android:state_pressed="true"
          Android:state_selected="true"/>
    <item Android:drawable="@drawable/bg_state_2"
          Android:state_pressed="true"
          Android:state_selected="false"/>
    <item Android:drawable="@drawable/bg_state_selected"
          Android:state_selected="true"/>
    <item Android:drawable="@drawable/bg_state_deselected"/>
</selector>

たとえば、「bg_state_1」を「bg_state_deselected」に、「bg_state_2」を「bg_state_selected」に変更して、好きなファイルを組み合わせることができます。

これらのファイルには、次のようなものを書くことができます。

<shape xmlns:Android="http://schemas.Android.com/apk/res/Android"
       Android:shape="rectangle">
    <solid Android:color="#ccdd00"/>
    <corners Android:radius="5dp"/>
</shape>

レイアウトファイルに、次の属性を使用してImageViewまたはImageButtonを作成します。

<ImageView
    Android:id="@+id/image"
    Android:layout_width="50dp"
    Android:layout_height="50dp"
    Android:adjustViewBounds="true"
    Android:background="@drawable/btn_image"
    Android:padding="10dp"
    Android:scaleType="fitCenter"
    Android:src="@drawable/star"/>

コードの後半:

image.setSelected(!image.isSelected());
2
CoolMind