선택된 상태의 Android ImageButton?


87

배경에 대한 선택기와 함께 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" />


1
ImageButton을 사용하고 선택된 상태를 추적하는 것은 약간 해킹처럼 보입니다. 토글 기능을 원하면 토글 버튼을 사용해야합니다.
안드라스 발라 Lajtha

답변:


214

이것은 나를 위해 작동합니다.

<?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>

그리고 자바에서 :

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

3
이것은 나를 위해 일했지만 추가하고 싶습니다. 드로어 블 폴더 에이 xml을 만들어야하며 ImageButton을 눌렀을 때 강조 표시하려면 state_selected 대신 android : state_pressed를 사용해야합니다. 또한이 상태는 덜 일반적인 상태이기 때문에 상태가없는 항목 위에 있어야합니다.
Denis Kutlubaev

3
NOTE: order is important (the first matching state(s) is what is rendered이것은 효과가 있었지만 이상한 이유를 얻지 못했습니다.
Muhammad Babar 2015 년

2
상태 속성이없는 경우 항목은 모든 상태와 일치합니다. 따라서 선택기의 두 번째 항목을 "모두 잡기"상태로 생각하십시오.
joshrl

2
주문은 중요하지 않으며 기본 주문 만 제공하면됩니다 android:state_selected="false" !
Muhammad Babar

위젯에서 어떻게 똑같이 할 수 있습니까? 버튼이 있는데 어떻게해야할지 모르겠어요.
Si8

19

ToggleImageButtonCheckable인터페이스 를 구현 OnCheckedChangeListener하고 android:checkedxml 속성을 지원 합니다.

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>

2
어떻게 사용하나요? 나는 developer.android.com/training/custom-views/create-view.html 의 지침을 따랐 지만 작동하지 못했습니다.
atisman 2013 년

2
감사! 를 사용하는 선택기는 state_checked이 기능 과 함께 작동하지 않지만을 사용해야 state_selected합니다.
Florian von Stosch

11

더 많은 이미지없이이 작업을 수행하는 가장 좋은 방법 :

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

1
getResources (). getColor (R.color.lightblue)를 사용하여 xml에서 색상을 지정할 수 있습니다.
Beto Caldas 2015

@ András는 버튼을 조금 더 누르고 있어야합니다. 그 이유를 아십니까?
lionelmessi dec.

3

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

이 시도:

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

흠. 도움이되지 않는 것 같습니다. CompoundButton을 사용하고 있습니다. on / off에 대한 해당 유형의 버튼에 특정한 상태가 있습니까?
Joren

네,이 참조 검사라고합니다 ) (의 IsChecked developer.android.com/reference/android/widget/...
Bostwickenator

0
if (iv_new_pwd.isSelected()) {
                iv_new_pwd.setSelected(false);
                Log.d("mytag", "in case 1");
                edt_new_pwd.setInputType(InputType.TYPE_CLASS_TEXT);
            } else {
                Log.d("mytag", "in case 1");
                iv_new_pwd.setSelected(true);
                edt_new_pwd.setInputType(InputType.TYPE_CLASS_TEXT | InputType.TYPE_TEXT_VARIATION_PASSWORD);
            }
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.