systembugtj/SwitchButton

A cute widget of Switch Button for you to create beautiful and friendly UI.

Download

Step 1. Add the JitPack repository to your build file

Add it in your root settings.gradle at the end of repositories:

	dependencyResolutionManagement {
		repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
		repositories {
			mavenCentral()
			maven { url 'https://jitpack.io' }
		}
	}

Add it in your settings.gradle.kts at the end of repositories:

	dependencyResolutionManagement {
		repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
		repositories {
			mavenCentral()
			maven { url = uri("https://jitpack.io") }
		}
	}

Add to pom.xml

	<repositories>
		<repository>
		    <id>jitpack.io</id>
		    <url>https://jitpack.io</url>
		</repository>
	</repositories>

Add it in your build.sbt at the end of resolvers:

 
    resolvers += "jitpack" at "https://jitpack.io"

Add it in your project.clj at the end of repositories:

 
    :repositories [["jitpack" "https://jitpack.io"]]

Step 2. Add the dependency

	dependencies {
		implementation 'com.github.systembugtj:switchbutton:1.4.5'
	}

	dependencies {
		implementation("com.github.systembugtj:switchbutton:1.4.5")
	}

	<dependency>
	    <groupId>com.github.systembugtj</groupId>
	    <artifactId>switchbutton</artifactId>
	    <version>1.4.5</version>
	</dependency>


                            
    libraryDependencies += "com.github.systembugtj" % "switchbutton" % "1.4.5"


                            
    :dependencies [[com.github.systembugtj/switchbutton "1.4.5"]]

Readme

SwitchButton

To get a quick preview, you can get Demo apk in Google Play or Directly download.

This project provides you a convenient way to use and customise a SwitchButton widget in Android. With just resources changed and attrs set, you can create a lifelike SwitchButton of Android 5.0+, iOS, MIUI, or Flyme and so on.

Now we get the biggest movement since SwitchButton published. v1.3.0 comes with totally reconsitution and more convenient API. A wholly new demo can give you a tour in it.

Change Log

Latested Change Log:

Fixed #75 #78 #85.

Change History.

Using SwitchButton in your application

~~ADT~~

No more support

Gradle Add dependencies in build.gradle of your module

dependencies {
	compile 'com.kyleduo.switchbutton:library:1.4.5'
}

Demo

I create a new demo apk to show you how to style the cute widget and use it. There's some screenshots of the new demo.

demo_preview

Usage

The usage of SwitchButton is just like CheckBox. The basic control APIs of SwitchButton.

setChecked(boolean)
toggle()

Since SwitchButton has addition animation when checked status changed, there are two addition methods for disable animation for single operation.

setCheckedImmediately(boolean): like setChecked but NO animation.
toggleImmediately(): like toggle but NO animation.

From version 1.4.1 on, SwitchButton support operation without onCheckedChanged callback. It makes changing state in code more convenient. Using these methods to achieve that feature.

setCheckedNoEvent(boolean)
setCheckedImmediatelyNoEvent(boolean)
toggleNoEvent()
toggleImmediatelyNoEvent()

Style

In 1.3.0, I updated the usage of SwitchButton library. To make it more Android way to use, I've combined the thumb and back style each to StateListColor/StateListDrawable. So you are free to create styles in different states.

In xml layout file, you can configure the face of switch button using these attrs.

kswThumbDrawable: drawable for thumb
kswThumbColor: color for thumb
kswThumbMargin: margin from thumb to back, can be negative. maybe cover by single direction margins
kswThumbMarginTop: same to kswThumbMargin, just top
kswThumbMarginBottom: same to kswThumbMargin, just bottom
kswThumbMarginLeft: same to kswThumbMargin, just left
kswThumbMarginRight: same to kswThumbMargin, just right
kswThumbWidth: width of thumb
kswThumbHeight: height of thumb
kswThumbRadius: radius of thumb rect, only work with kswThumbColor
kswBackRadius: radius of background rect, only work with kswBackColor
kswBackDrawable: drawable for background
kswBackColor: color for background
kswFadeBack: fade background color/drawable when drag or animate between on/off status or not
kswBackMeasureRatio: (background's width / thumb's width). float value.
kswAnimationDuration: duration of animation between 2 status
kswTintColor: change SwitchButton's style just by one property, all relevant color will be generate automatically. Do not support SwitchButtonMD or other style created by xml resources.
kswTextOn: text for checked status.
kswTextOff: text for unchecked status.
kswTextMarginH: horizontal margin of text.
kswAutoAdjustTextPosition: (Since 1.4.4) whether auto adjust text position to make them looks centered (NOT really centered) when there are round corners. You should set this to false when you don't need this feature.

You can alse change the configuration of SwitchButton in code. You can find the api from Demo apk. There's a glance.

private String[] opts = new String[]{
			"setThumbColorRes/setThumbColor",
			"setThumbDrawableRes/setThumbDrawable",
			"setBackColorRes/setBackColor",
			"setBackDrawableRes/setBackDrawable",
			"setTintColor",
			"setThumbMargin",
			"setThumbSize",
			"setThumbRadius (color-mode only)",
			"setBackRadius (color-mode only)",
			"setFadeBack",
			"setBackMeasureRatio",
			"setAnimationDuration",
			"setDrawDebugRect",
			"setText",
	};

Beautiful Apps

If you're using SwitchButton in your app, wish you can email me these infomation of your app and I'll create a list here. And that should be an utmost encouragement to me. :-) kyleduo@gmail.com

| App | Name | Description | Markets | Developer | | ---------------------------------------- | ----------------------- | ---------------------------------------- | ---------------------------------------- | ---------------------------------------- | | | Headlines | Headlines is a news dashboard for your smart TV. | | MYSTRAL | | | 懒投资 | 专业安全的投资理财平台 | 官方网站 | 懒投资 lantouzi.com | | | Notifications in bubble | Access all notifications from a floating bubble. | | BestAppzz |

License

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.