無(wú)論哪種客戶端或者網(wǎng)頁(yè)，開關(guān)控件都是必備的，在Android中提供了Switch控件畜吊，而iOS則提供了UISwitch。日常開發(fā)中户矢，設(shè)計(jì)師一般都是按照iOS的設(shè)計(jì)風(fēng)格來(lái)設(shè)計(jì)玲献，所以安卓原生的Switch基本派不上用場(chǎng)，基本都是自定義View來(lái)實(shí)現(xiàn)。iOS客戶端則可以直接用UISwitch捌年。
UISwitch默認(rèn)樣式.png
創(chuàng)建開關(guān)
UISwitch通過(guò)alloc和init就可以創(chuàng)建了瓢娜，注意要顯示必須設(shè)置按鈕的frame，否則不會(huì)顯示礼预，而且UISwitch的寬恋腕、高都不能修改，就算設(shè)置了也沒(méi)效果逆瑞。
@interface ViewController ()
@property(nonatomic, strong) UISwitch *pushSwitch;
@end
@implementation ViewController
/**
* 懶加載按鈕開關(guān)
*/
- (UISwitch *)pushSwitch {
if (_pushSwitch == nil) {
_pushSwitch = [[UISwitch alloc] init];
//位置的x,y可以改荠藤，但是按鈕寬、高不可以改获高，就算設(shè)置了也沒(méi)效果
_pushSwitch.frame = CGRectMake(100, 200, 80, 40);
//設(shè)置按鈕在屏幕中心
_pushSwitch.center = CGPointMake(self.view.center.x, self.view.center.y);
}
return _pushSwitch;
}
- (void)viewDidLoad {
[super viewDidLoad];
//將開關(guān)添加到控制器的View
[self.view addSubview:self.pushSwitch];
}
@end
設(shè)置樣式
默認(rèn)開關(guān)樣式：
- 開：綠色背景哈肖，白色圓形滑塊。
- 關(guān)：透明背景念秧，白色圓形滑塊淤井。
除了默認(rèn)樣式，蘋果爸爸還我我們提供了以下Api設(shè)置一些按鈕的樣式
- 設(shè)置開關(guān)-開時(shí)的背景顏色
UISwitch設(shè)置開樣式.png
//設(shè)置開時(shí)的背景為橙色摊趾，默認(rèn)綠色
[self.pushSwitch setOnTintColor: [UIColor orangeColor]];
- 設(shè)置圓形滑塊的顏色
UISwitch設(shè)置滑塊顏色.png
//設(shè)置圓形滑塊的顏色為綠色币狠，開關(guān)的開和關(guān)時(shí)都為這種顏色，默認(rèn)為白色
[self.pushSwitch setThumbTintColor: [UIColor greenColor]];
- 設(shè)置按鈕關(guān)閉時(shí)的邊框顏色
UISwitch設(shè)置關(guān)閉時(shí)的邊框顏色.png
//按鈕關(guān)閉時(shí)的邊框顏色為紫色砾层，只在按鈕關(guān)閉時(shí)邊框的顏色漩绵，按鈕背景為透明，不能被修改
[self.pushSwitch setTintColor:[UIColor purpleColor]];
基本使用
- 手動(dòng)設(shè)置按鈕的開肛炮、關(guān)止吐，分為帶動(dòng)畫和不帶動(dòng)畫2種
//設(shè)置開關(guān)狀態(tài)，不帶動(dòng)畫
self.pushSwitch.on = YES;
//設(shè)置開關(guān)狀態(tài)侨糟，帶動(dòng)畫
[self.pushSwitch setOn:YES animated:YES];
- 設(shè)置按鈕切換事件回調(diào)監(jiān)聽
//設(shè)置開關(guān)切換事件
- (void)viewDidLoad {
[super viewDidLoad];
//將開關(guān)添加到控制器的View
[self.view addSubview:self.pushSwitch];
//設(shè)置開關(guān)切換事件
[self.pushSwitch addTarget:self action:@selector(switchChange:) forControlEvents:UIControlEventValueChanged];
}
/**
* 按鈕切換事件監(jiān)聽回調(diào)方法
*/
- (void) switchChange:(UISwitch*)sw {
if(sw.on == YES) {
NSLog(@"開關(guān)切換為開");
} else if(sw.on == NO) {
NSLog(@"開關(guān)切換為關(guān)");
}
}
示例
例如設(shè)置頁(yè)面的推送開關(guān)碍扔，每次開關(guān)記錄到本地，每次頁(yè)面進(jìn)入時(shí)回顯之前設(shè)置的開關(guān)狀態(tài)秕重。本地保存方式有很多種不同，我們這里選用簡(jiǎn)單的NSUserDefaults來(lái)保存即可。
@interface ViewController ()
@property(nonatomic, strong) UISwitch *pushSwitch;
@end
/**
* 推送開關(guān)本地存儲(chǔ)標(biāo)識(shí)Key
*/
static NSString* const SWITCH_KEY = @"PUSH_IS_OPEN";
@implementation ViewController
//省略上面提到的按鈕創(chuàng)建和初始化...
- (void)viewDidLoad {
[super viewDidLoad];
//...省略事件監(jiān)聽設(shè)置
//使用NSUserDefaults溶耘，回顯之前的開關(guān)配置
NSUserDefaults *defaults = [NSUserDefaults standardUserDefaults];
//設(shè)置開關(guān)狀態(tài)二拐，不帶動(dòng)畫
self.pushSwitch.on = [defaults objectForKey:SWITCH_KEY];
}
- (void) switchChange:(UISwitch*)sw {
NSUserDefaults *defaults = [NSUserDefaults standardUserDefaults];
if(sw.on == YES) {
NSLog(@"開關(guān)切換為開");
} else if(sw.on == NO) {
NSLog(@"開關(guān)切換為關(guān)");
}
[defaults setBool:sw.on forKey:SWITCH_KEY];
}
@end
