Android自制SwitchBar（附资源）

折腾了好几天，这个App基本上是完成了，其中有一部分是自定义一个SwitchBar，网上看了好多别人的解决办法，都是基于系统自带的SwitchBar，只是修改了一些背景图片资源什么的，效果并不是很理想，以下是我的解决办法，先贴效果图：

首先是layout中的switchbar.xml文件：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <FrameLayout
        android:id="@+id/speakerframe"
        android:layout_width="296px"
        android:layout_height="100px"
        android:layout_gravity="center"
        android:background="@mipmap/btn_frame"
        android:onClick="onClick"
        android:layout_marginTop="30dp"
        android:layout_weight="1">
        <android.support.v7.widget.AppCompatImageView
            android:id="@+id/bspeaker"
            android:layout_width="416px"
            android:layout_height="match_parent"
            android:layout_marginEnd="20dp"
            android:layout_gravity="center"
            app:srcCompat="@mipmap/btn_slider_n"
            android:background="@mipmap/btn_state_bspeaker_n" />
    </FrameLayout>

    <FrameLayout
        android:id="@+id/lightframe"
        android:layout_width="296px"
        android:layout_height="100px"
        android:layout_gravity="center"
        android:background="@mipmap/btn_frame"
        android:onClick="onClick"
        android:layout_marginTop="30dp"
        android:layout_weight="1">
        <android.support.v7.widget.AppCompatImageView
            android:id="@+id/light"
            android:layout_width="416px"
            android:layout_height="match_parent"
            android:layout_marginEnd="20dp"
            android:layout_gravity="center"
            app:srcCompat="@mipmap/btn_slider_n"
            android:background="@mipmap/btn_state_light_n" />
    </FrameLayout>

    <android.support.v7.widget.AppCompatImageView
        android:id="@+id/speed"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        app:srcCompat="@mipmap/btn_speed_bg"
        android:layout_weight="10"/>

</LinearLayout>

基本思想就是btn_frame作为Layout的边框，大小宽度作为Layout的长和宽，（但是，这样做的有明显的缺陷，不同分辨率的手机，屏幕大小不同的手机，显示的大小效果就不同了，后期再想解决办法）将bspeaker作为SpeakerFrame的资源文件，其中bspeaker是由btn_state_bspeaker_n和btn_slider组成的，由于bspeaker的长度大于SpeakerFrame的长度，故表现出的效果就是SwitchBar。（Speaker和Lighjt完全同理，故只解释Speaker）

简言之，和组成，当点击事件发生时，改变bspeaker的位置即可。（忽略我截图的大小…）

于是剩下的就是点击事件发生的方法了：

@Override
    public void onClick(View v) {

        switch (v.getId()) {
            case R.id.speakerframe:
                onspeak();
                break;

            case R.id.lightframe:
                onLight();
                break;

            default:
                break;
        }
    }

    int set = 1;

    private void onLight() {
        Toast.makeText(this, "点击灯光", Toast.LENGTH_SHORT).show();
        ImageView lightBar = (ImageView) findViewById(light);
        FrameLayout.LayoutParams params = (FrameLayout.LayoutParams) lightBar.getLayoutParams();
        if (set == 1) {
            params.setMarginStart(120);
            //其余的相关操作……
            set = 0;
        } else {
            params.setMarginStart(0);
            set = 1;
        }
        lightBar.setLayoutParams(params);

    }

    private void onspeak() {
        Toast.makeText(this, "点击声音", Toast.LENGTH_SHORT).show();
        ImageView speakBar = (ImageView) findViewById(bspeaker);
        FrameLayout.LayoutParams params = (FrameLayout.LayoutParams) speakBar.getLayoutParams();
        if (set == 1) {
            params.setMarginStart(120);
            //其余的相关操作……
            set = 0;
        } else {
            params.setMarginStart(0);
            set = 1;
        }
        speakBar.setLayoutParams(params);
    }

至此，便完成了完全自定义的“SwitchBar”，如果有老铁需要用到拿去用即可，不过，资源只是声音和灯光，如需别的功能，自行P掉即可。另外，这个解决办法其中有很大的问题，就是对于bSpeaker的移动大小，是对我测试的手机适用，若换个尺寸不同或者像素不同的手机，那就会出现偏差，由于只是自己做着玩而不是正规的使用，所以就暂且得过且过了，如果哪位大神有兼容性好的办法，烦请不吝赐教！