仿ios样式的SwitchButton

1.添加依赖

implementation 'com.kyleduo.switchbutton:library:1.4.1'

 

2.布局

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

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:orientation="vertical"

tools:context="com.example.zb.myswitchbuttondemo.MainActivity">

 

<com.kyleduo.switchbutton.SwitchButton

android:id="@+id/switchButton"

style="@style/SwitchButtonStyle"

android:layout_width="80dp"

android:layout_height="50dp"

android:layout_centerInParent="true"

android:checked="false"

app:kswAnimationDuration="300"

app:kswBackDrawable="@drawable/ios_back_drawable"

app:kswBackMeasureRatio="1.4"

app:kswThumbDrawable="@drawable/ios_thumb_selector"

app:kswThumbMarginBottom="-8dp"

app:kswThumbMarginLeft="-5dp"

app:kswThumbMarginRight="-5dp"

app:kswThumbMarginTop="-2.5dp" />

 

</LinearLayout>

 

3.style="@style/SwitchButtonStyle"

<style name="SwitchButtonStyle">

<item name="android:paddingLeft">10dp</item>

<item name="android:paddingRight">10dp</item>

<item name="android:paddingTop">4dp</item>

<item name="android:paddingBottom">4dp</item>

</style>

 

4.@drawable/ios_back_drawable

<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android">

<item android:state_enabled="false" android:state_checked="true">

<shape>

<!--<solid android:color="#b3ecbc"/> -->

<solid android:color="#77B3D4"/>

<corners android:radius="99dp"/>

</shape>

</item>

<item android:state_enabled="false" android:state_checked="false">

<shape>

<solid android:color="#FEFEFE"/>

<corners android:radius="99dp"/>

<stroke

android:width="1.5dp"

android:color="#F0F0F0"/>

</shape>

</item>

<item android:state_checked="true">

<shape>

<!--<solid android:color="#43d95d"/>-->

<solid android:color="#0096DC"/>

<corners android:radius="99dp"/>

</shape>

</item>

<item>

<shape>

<solid android:color="#FEFEFE"/>

<corners android:radius="99dp"/>

<stroke

android:width="1.5dp"

android:color="#E6E6E6"/>

</shape>

</item>

</selector>

 

5.@drawable/ios_thumb_selector

<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android">

<item android:state_enabled="false" android:drawable="@mipmap/ios_thumb_disable"/>

<item android:drawable="@mipmap/ios_thumb"/>

</selector>

 

 

6.MainActivity

 

package com.example.zb.myswitchbuttondemo;

 

import android.support.v7.app.AppCompatActivity;

import android.os.Bundle;

import android.widget.CompoundButton;

import android.widget.Toast;

 

import com.kyleduo.switchbutton.SwitchButton;

 

public class MainActivity extends AppCompatActivity {

 

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

SwitchButton mSwitchButton = (SwitchButton) findViewById(R.id.switchButton);

mSwitchButton.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {

@Override

public void onCheckedChanged(CompoundButton compoundButton, boolean b) {

String s;

if (b)

s = "确定";

else

s = "取消";

 

Toast.makeText(getApplication(), s, Toast.LENGTH_SHORT).show();

}

});

 

}

}

 

 

github地址：https://github.com/b888zhang/MySwitchButtonDemo