自定义switch button风格的按钮

最新推荐文章于 2022-11-29 19:09:16 发布

qsdh76

最新推荐文章于 2022-11-29 19:09:16 发布

阅读量452

点赞数

分类专栏：安卓开发文章标签：安卓 button 自定义

本文链接：https://blog.csdn.net/qsdh76/article/details/44831647

版权

安卓开发专栏收录该内容

1 篇文章 0 订阅

订阅专栏

本人新手，刚刚做了一个小项目，需要一个switchbutton风格的按钮，网上有很多，
可是一般都是根据几个图片偏移计算出来的，碰巧美工不喜欢那样的，提供了一系
列图片作为动画，就按照播放动画的方式设计了一个switchbutton，实际是两个
button的组合，代码量不多，直接上代码。

代码块

public class SwitchButton extends FrameLayout {
    private boolean mSwitchOn = true;//开关默认是开着的
    private ImageView mImageViewOn,mImageViewOff;
    private OnChangeListener mListener = null;

    public SwitchButton(Context context) {
        this(context, null);
    }

    public SwitchButton(Context context, AttributeSet attrs) {
        this(context, attrs,0);
    }

    public SwitchButton(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        mImageViewOff = new ImageView(context,attrs);
        mImageViewOff.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                setCheckedWithAnim(!mSwitchOn);
                if(mListener != null) {
                    mListener.onChange( mSwitchOn);
                }
            }
        });
        mImageViewOn = new ImageView(context,attrs);
        mImageViewOn.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                setCheckedWithAnim(!mSwitchOn);
                if(mListener != null) {
                    mListener.onChange( mSwitchOn);
                }
            }
        });
        this.addView(mImageViewOff);
        this.addView(mImageViewOn);

        mImageViewOn.setBackgroundResource(R.anim.anim_switch_on);
        mImageViewOff.setBackgroundResource(R.anim.anim_switch_off);
        //setState(mSwitchOn);
    }

    public void setOnChangeListener(OnChangeListener listener) {
        mListener = listener;
    }

    public interface OnChangeListener {
        public void onChange( boolean state);
    }

    public void setChecked(boolean state){
        AnimationDrawable animationDrawable;
        mSwitchOn = state;
        if(mSwitchOn){
            mImageViewOn.setVisibility(View.VISIBLE);
            mImageViewOff.setVisibility(View.GONE);
        }else{
            mImageViewOn.setVisibility(View.GONE);
            mImageViewOff.setVisibility(View.VISIBLE);
        }
    }

    private void setCheckedWithAnim(boolean state){
        AnimationDrawable animationDrawable;
        mSwitchOn = state;
        if(mSwitchOn){
            mImageViewOn.setVisibility(View.VISIBLE);
            mImageViewOff.setVisibility(View.GONE);
            animationDrawable = (AnimationDrawable) mImageViewOn.getBackground();
            animationDrawable.start();
        }else{
            mImageViewOn.setVisibility(View.GONE);
            mImageViewOff.setVisibility(View.VISIBLE);
            animationDrawable = (AnimationDrawable) mImageViewOff.getBackground();
            animationDrawable.start();
        }
    }
    public boolean isChecked(){
        return this.mSwitchOn;
    }
}

动画xml文件，注意第一帧，是图片静态状态的样子，时长为0

代码块

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="true">
    <item
        android:drawable="@drawable/animation_switcher0003" android:duration="0">
    </item>
    <item
        android:drawable="@drawable/animation_switcher0001" android:duration="10">
    </item>
    <item
        android:drawable="@drawable/animation_switcher0002" android:duration="10">
    </item>
    <item
        android:drawable="@drawable/animation_switcher0003" android:duration="10">
    </item>
</animation-list>

代码块

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="true">
    <item
        android:drawable="@drawable/animation_switcher0001" android:duration="0">
    </item>
    <item
        android:drawable="@drawable/animation_switcher0003" android:duration="10">
    </item>
    <item
        android:drawable="@drawable/animation_switcher0002" android:duration="10">
    </item>
    <item
        android:drawable="@drawable/animation_switcher0001" android:duration="10">
    </item>
</animation-list>