A Customizable Switch UI for iOS, Inspired from Google's Material Design

Overview

JTMaterialSwitch

CI Status Version License Platform

Overview

JTMaterialSwitch is google's material design like switch UI with animation features.

This library has cool and sophisticated animations, ripple effect and bounce effect. Also, customizable properties can be tweaked behaviors and enhance your application UI cool.

With this library, you can easily implement material design switch to your app.



Installation

JTMaterialSwitch is available on CocoaPods.

You can use this library by adding the following command onto your Podfile:

pod "JTMaterialSwitch"

Usage

The simplest setup:

  JTMaterialSwitch *switch = [[JTMaterialSwitch alloc] init];
  switch.center = CGPointMake(200, 200);
  [self.view addSubview:switch];

This is the simplest and easiest initialization. The style, size and initial state of JTMaterialSwitch instance is set to all default value as shown below.

In addition, this library also has following designated initializers to set these parameters.

 /**
  *  Initializes a JTMaterialSwitch with a initial switch state position and size.
  *
  *  @param size A JTMaterialSwitchSize enum as this view's size(big, normal, small)
  *  @param state A JTMaterialSwitchState enum as this view's initial switch pos(ON/OFF)
  *
  *  @return A JTMaterialSwitch with size and initial position
  */
 - (id)initWithSize:(JTMaterialSwitchSize)size state:(JTMaterialSwitchState)state;

 /**
  *  Initializes a JTMaterialSwitch with a initial switch size, style and state.
  *
  *  @param size A JTMaterialSwitchSize enum as this view's size(big, normal, small)
  *  @param state A JTMaterialSwitchStyle enum as this view's initial style
  *  @param state A JTMaterialSwitchState enum as this view's initial switch pos(ON/OFF)
  *
  *  @return A JTMaterialSwitch with size, style and initial position
  */
- (id)initWithSize:(JTMaterialSwitchSize)size style:(JTMaterialSwitchStyle)style state:(JTMaterialSwitchState)state;

Customize Behaviors

JTMaterialSwitch has many prateters to customize behaviors as you like.

Style and size

  • Style: JTMaterialSwitchStyle

  • JTMaterialSwitchStyleLight

  • JTMaterialSwitchStyleDark

  • JTMaterialSwitchStyleDefault

  • Size: JTMaterialSwitchSize

  • JTMaterialSwitchSizeBig

  • JTMaterialSwitchSizeNormal

  • JTMaterialSwitchSizeSmall

Screen shot

Properties

#pragma State
/** A Boolean value that represents switch's current state(ON/OFF). YES to ON, NO to OFF the switch */
@property (nonatomic) BOOL isOn;
/** A Boolean value that represents switch's interaction mode. YES to set enabled, No to set disabled*/
@property (nonatomic) BOOL isEnabled;
/** A Boolean value whether the bounce animation effect is enabled when state change movement */
@property (nonatomic) BOOL isBounceEnabled;
/** A Boolean value whether the ripple animation effect is enabled or not */
@property (nonatomic) BOOL isRippleEnabled;

#pragma Color
/** An UIColor property to represent the color of the switch thumb when position is ON */
@property (nonatomic, strong) UIColor *thumbOnTintColor;
/** An UIColor property to represent the color of the switch thumb when position is OFF */
@property (nonatomic, strong) UIColor *thumbOffTintColor;
/** An UIColor property to represent the color of the track when position is ON */
@property (nonatomic, strong) UIColor *trackOnTintColor;
/** An UIColor property to represent the color of the track when position is OFF */
@property (nonatomic, strong) UIColor *trackOffTintColor;
/** An UIColor property to represent the color of the switch thumb when position is DISABLED */
@property (nonatomic, strong) UIColor *thumbDisabledTintColor;
/** An UIColor property to represent the color of the track when position is DISABLED */
@property (nonatomic, strong) UIColor *trackDisabledTintColor;
/** An UIColor property to represent the fill color of the ripple only when ripple effect is enabled */
@property (nonatomic, strong) UIColor *rippleFillColor;

Screen shot

Change History

1.1 Bug Fix

1.0.0 Initial Release

Requirements

iOS 7.0 or later

Author

Junichi Tsurukawa [email protected]

License

JTMaterialSwitch is available under the MIT license.

You might also like...
Modular and customizable Material Design UI components for iOS
Modular and customizable Material Design UI components for iOS

Material Components for iOS Material Components for iOS (MDC-iOS) helps developers execute Material Design. Developed by a core team of engineers and

Runkeeper design switch control
Runkeeper design switch control

DGRunkeeperSwitch Runkeeper design switch control (two part segment control) developed in Swift 2.0 Requirements Xcode 7-beta or higher iOS 8.0 or hig

Nicely animated flat design switch alternative to UISwitch
Nicely animated flat design switch alternative to UISwitch

AIFlatSwitch A smooth, nice looking and IBDesignable flat design switch for iOS. Can be used instead of UISwitch. Inspired by Creativedash's Dribbble

A Material Design drop down for iOS
A Material Design drop down for iOS

A Material Design drop down for iOS written in Swift. Demo Do pod try DropDown in your console and run the project to try a demo. To install CocoaPods

Material design components for iOS written in Swift
Material design components for iOS written in Swift

MaterialKit NOTE: This project is unmaintained. Material design components (inspired by Google Material Design) for iOS written in Swift Please feel f

 iOS library Paper Onboarding is a material design UI slider written on Swift.
iOS library Paper Onboarding is a material design UI slider written on Swift.

iOS library Paper Onboarding is a material design UI slider written on Swift. We specialize in the designing and coding of custom UI

Blobmorphism is a brand new design language I've created to break free of the material overload in iOS, built in SwiftUI. Everything feels smooth and fluid.
Blobmorphism is a brand new design language I've created to break free of the material overload in iOS, built in SwiftUI. Everything feels smooth and fluid.

Blobmorphism is a brand new design language I've created to break free of the material overload in iOS, built in SwiftUI. Everything feels smooth and fluid.

A Material Design drop down for iOS
A Material Design drop down for iOS

A Material Design drop down for iOS written in Swift. Demo Do pod try DropDown in your console and run the project to try a demo. To install CocoaPods

Library provides easy to implement variation of Android (Material Design) Floating Action Button for iOS. You can use it as your app small side menu. 🌶
Library provides easy to implement variation of Android (Material Design) Floating Action Button for iOS. You can use it as your app small side menu. 🌶

RHSideButtons 🌶 Library provides easy to implement variation of Android (Material Design) Floating Action Button for iOS. You can use it as your app

Material para a apresentação da palestra "Implementando Interesses Transversais - um papo sobre arquitetura, DI e Design Patterns em Swift/iOS" no TDC Future 2021

--- title: Implementando Interesses Transversais - um papo sobre arquitetura, DI e Design Patterns em Swift/iOS author: Cícero Camargo date: Nov 30th

Google Material Design Icons Font for iOS
Google Material Design Icons Font for iOS

GoogleMaterialDesignIcons #Google Material Design Icons Font for iOS It is based on https://github.com/google/material-design-icons. it converts the m

Interactive and fully animated Material Design button for iOS developers.
Interactive and fully animated Material Design button for iOS developers.

WYMaterialButton Inspired by Google Material Design, written purely in Swift 3. WYMaterialButton implemented Material Design on iOS and add more dynam

⭕️ CircleMenu is a simple, elegant UI menu with a circular layout and material design animations. Swift UI library made by @Ramotion
⭕️ CircleMenu is a simple, elegant UI menu with a circular layout and material design animations. Swift UI library made by @Ramotion

CIRCLE MENU Simple, elegant UI menu with a circular layout and material design animations We specialize in the designing and coding of custom UI for M

A swift library based on the various options menu in material design in Android
A swift library based on the various options menu in material design in Android

KTOptionMenu Description KTOptionMenu is a swift library based on the various options menu in material design in Android that allows you to easily cre

Google Material Design Icons for Swift and ObjC project
Google Material Design Icons for Swift and ObjC project

GoogleMaterialIconFont Google Material Design Icons for Swift and ObjC project This library is inspired by FontAwesome.swift Both Swift and Objctive-C

Material Design Floating Action Button in liquid state
Material Design Floating Action Button in liquid state

LiquidFloatingActionButton [] (https://github.com/Carthage/Carthage) LiquidFloatingActionButton is floating action button component of material design

ExpandingCollection is an animated material design UI card peek/pop controller.
ExpandingCollection is an animated material design UI card peek/pop controller.

EXPANDING COLLECTION An animated material design UI card peek/pop controller We specialize in the designing and coding of custom UI for Mobile Apps an

This
This "Calculator" application is a simple one screen design of calculator screen i have made this single screen design application just to practice AutoLayout concepts.

Calculator Layout This "Calculator" application is a simple one screen design of calculator screen i have made this single screen design application j

SwiftAR is a declerative framework to build AR experiences, with a SwiftUI inspired design.
SwiftAR is a declerative framework to build AR experiences, with a SwiftUI inspired design.

SwiftAR is a declerative framework to build AR experiences, with a SwiftUI inspired design. It builds on the base types Experience, Anchor and

Comments
  • isBounceEnabled property has no effect

    isBounceEnabled property has no effect

    It appears that the isBouncEnabled property has no affect on the control.

    1. Initialize a new JTMaterialSwitch [[JTMaterialSwitch alloc] init];
    2. Set the isBounceEnabled property to NO
    3. Add switch to the view
    4. Observe that the switch still "bounces" when transitioning between on and off states
    opened by burkeholland 2
  • #1 Fix: isOn Property Sets Incorrect State

    #1 Fix: isOn Property Sets Incorrect State

    Issue Description

    As the issue reported in #1, there was a bug of the incorrect position of the thumb when isOn property is NO.

    The bug screenshot: The thumb's initial position should be OFF. before

    And fixed behavior is following: after

    The reason of this happening is the missing of the initial positioning function in willMoveToSuperview.

    This PR fixes this bug and updates the pod version to 1.1.

    bug 
    opened by JunichiT 0
  • Using JTMaterialSwitch in Swift 4

    Using JTMaterialSwitch in Swift 4

    declare JTMaterialSwitch let Switch = JTMaterialSwitch()

    se switch color
    Switch?.thumbOnTintColor = UIColor.init(hex: 0xF9D059)

    add switch to UIView View.addSubview(Switch!)

    opened by aserdah 1
  • How to find which switch delegate called?

    How to find which switch delegate called?

    Hi,

    I am using multiple switch in same view. So I don't know which switch delegate called when switch state change. If any way to find that let me know if I miss anything.

    Thanks,

    opened by mathiarasan24 2
Owner
Junichi Tsurukawa
Junichi Tsurukawa
A Swift material design UI module which paints over the parent view when the switch is on.

A Swift material design UI module which paints over the parent view when the switch is on. We specialize in the designing and coding of c

Ramotion 2.9k Dec 29, 2022
Nicely animated flat design switch alternative to UISwitch

AIFlatSwitch A smooth, nice looking and IBDesignable flat design switch for iOS. Can be used instead of UISwitch. Inspired by Creativedash's Dribbble

null 963 Jan 5, 2023
💊 An iOS switch control implemented in Swift with full Interface Builder support

' :::=== ::: === === ::: :::==== :::===== ::: === ' ::: ::: === === ::: :::==== ::: ::: === ' ===== === === === === ===

Thanh Pham 145 Dec 7, 2022
An animation switch collection

TKSwitcherCollection An animate switch collection Requirements iOS 8.0+ Xcode 9.0 Swift 4.0 Installation CocoaPods You can use CocoaPods to install TK

TBXark 903 Dec 21, 2022
A Customizable Switch UI for iOS, Inspired from Google's Material Design

Overview JTMaterialSwitch is google's material design like switch UI with animation features. This library has cool and sophisticated animations, ripp

Junichi Tsurukawa 319 Nov 28, 2022
A Swift material design UI module which paints over the parent view when the switch is on.

A Swift material design UI module which paints over the parent view when the switch is on. We specialize in the designing and coding of c

Ramotion 2.9k Dec 29, 2022
A Swift material design UI module which paints over the parent view when the switch is on.

:octocat: ?? RAMPaperSwitch is a Swift material design UI module which paints over the parent view when the switch is turned on. iOS library by @Ramotion

Ramotion 2.9k Dec 29, 2022
A Slide Menu, written in Swift, inspired by Slide Menu Material Design

Swift-Slide-Menu (Material Design Inspired) A Slide Menu, written in Swift 2, inspired by Navigation Drawer on Material Design (inspired by Google Mat

Boisney Philippe 90 Oct 17, 2020
Custom UIButton effect inspired by Google Material Design

ZFRippleButton iOS Custom UIButton effect inspired by Google Material Design written in Swift Usage Set the UIButton class in Nib to ZFRippleButton or

Amornchai Kanokpullwad 1.4k Dec 1, 2022