具有选定状态的Android ImageButton？

Posted 2023-02-22

【中文标题】具有选定状态的Android ImageButton？

【英文标题】：Android ImageButton with a selected state?

【发布时间】：2011-02-05 23:17:43

【问题描述】：

如果我使用带有选择器的 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" />

【问题讨论】：

使用 ImageButton 并跟踪选定状态似乎有点 hack。如果您想要切换功能，您应该使用切换按钮。

【参考方案1】：

这对我有用：

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

【讨论】：

这对我有用，但我想补充一点，应该在你的可绘制文件夹中创建这个 xml，如果你希望 ImageButton 在按下时突出显示，你应该使用 android:state_pressed 而不是 state_selected .此外，这种状态应该在没有状态的项目之上，因为它不太通用。

NOTE: order is important (the first matching state(s) is what is rendered 这确实有效，但奇怪的是我不明白为什么？

在没有任何状态属性的情况下，该项目将匹配任何状态。因此，将选择器中的第二项视为“全部捕获”状态。

顺序不重要，您只需要确保您提供android:state_selected="false" 的默认值即可！

如何在小部件中做同样的事情？我有一个按钮，但我似乎不知道怎么做。

【参考方案2】：

ToggleImageButton实现Checkable接口，支持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>

【讨论】：

如何使用它？我按照以下说明进行操作：developer.android.com/training/custom-views/create-view.html，但我无法使其工作。

谢谢！请注意，带有state_checked 的选择器不适用于此功能，您必须使用state_selected。

【参考方案3】：

无需更多图片的最佳方法：

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

【讨论】：

您可以使用 getResources().getColor(R.color.lightblue) 从您的 xml 中着色。

@András 需要再按一下按钮。你知道这是为什么吗？

【参考方案4】：

在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_
    android:layout_
    android:adjustViewBounds="true"
    android:background="@drawable/btn_image"
    android:padding="10dp"
    android:scaleType="fitCenter"
    android:src="@drawable/star"/>

后面的代码：

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

【参考方案5】：

试试这个：

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

【讨论】：

嗯。似乎没有帮助。我正在使用复合按钮。是否有特定于该类型按钮的 on\off 状态？

是的，它被称为检查参见 isChecked() developer.android.com/reference/android/widget/…

【参考方案6】：

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