定制二选一按钮SwitchButton
效果：
源码：
SwitchButton.h 与 SwitchButton.m
//
// SwitchButton.h
// KongJian
//
// Created by YouXianMing on 14/10/24.
// Copyright (c) 2014年 YouXianMing. All rights reserved.
// #import <UIKit/UIKit.h> @protocol SwitchButtonDelegate <NSObject>
- (void)switchButtonState:(BOOL)state;
@end @interface SwitchButton : UIView /**
* 代理
*/
@property (nonatomic, assign) id<SwitchButtonDelegate> delegate; /**
* 3个view
*/
@property (nonatomic, strong) UIView *leftView;
@property (nonatomic, strong) UIView *rightView;
@property (nonatomic, strong) UIView *blockView; /**
* 动画持续时间
*/
@property (nonatomic, assign) NSTimeInterval duration; /**
* 块是否在左边
*/
@property (nonatomic, assign) BOOL blockAtLeft; /**
* 背景颜色
*/
@property (nonatomic, strong) UIColor *leftBackgroundColor;
@property (nonatomic, strong) UIColor *rightBackgroundColor; /**
* 便利的创建出按钮
*
* @param leftText 左边显示的文本
* @param rightText 右边显示的文本
* @param size button的尺寸
*
* @return button对象
*/
+ (SwitchButton *)createDefaultTypeButtonWithLeftText:(NSString *)leftText
rightText:(NSString *)rightText
size:(CGSize)size; @end
//
// SwitchButton.m
// KongJian
//
// Created by YouXianMing on 14/10/24.
// Copyright (c) 2014年 YouXianMing. All rights reserved.
// #import "SwitchButton.h" @interface SwitchButton () @property (nonatomic, strong) UIButton *button; @property (nonatomic, strong) UIView *leftBackView;
@property (nonatomic, strong) UIView *rightBackView;
@property (nonatomic, strong) UIView *blockBackView; @end @implementation SwitchButton - (instancetype)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
self.layer.masksToBounds = YES; // 按钮
_button = [[UIButton alloc] initWithFrame:self.bounds];
[_button addTarget:self
action:@selector(buttonEvent)
forControlEvents:UIControlEventTouchUpInside];
[self addSubview:_button]; // 左侧view
_leftBackView = [[UIView alloc] initWithFrame:CGRectMake(, ,
self.bounds.size.width / .f,
self.bounds.size.height)];
_leftBackView.userInteractionEnabled = NO;
[self addSubview:_leftBackView]; // 右侧view
_rightBackView = [[UIView alloc] initWithFrame:CGRectMake(self.bounds.size.width / .f, ,
self.bounds.size.width / .f, self.bounds.size.height)];
_rightBackView.userInteractionEnabled = NO;
[self addSubview:_rightBackView]; // 遮挡用的view
_blockBackView = [[UIView alloc] initWithFrame:CGRectMake(, ,
self.bounds.size.width / .f,
self.bounds.size.height)];
_blockBackView.userInteractionEnabled = NO;
[self addSubview:_blockBackView]; }
return self;
} - (void)buttonEvent {
if (_blockBackView.frame.origin.x == ) {
if (_delegate) {
[_delegate switchButtonState:YES];
} [UIView animateWithDuration:(_duration > ? _duration : 0.2f)
animations:^{
_blockBackView.frame = CGRectMake(self.bounds.size.width / .f, ,
self.bounds.size.width / .f, self.bounds.size.height);
if (_leftBackgroundColor) {
_button.backgroundColor = _leftBackgroundColor;
} } completion:^(BOOL finished) { }];
} else {
[_delegate switchButtonState:NO];
[UIView animateWithDuration:(_duration > ? _duration : 0.2f)
animations:^{
_blockBackView.frame = CGRectMake(, ,
self.bounds.size.width / .f, self.bounds.size.height);
if (_rightBackgroundColor) {
_button.backgroundColor = _rightBackgroundColor;
}
} completion:^(BOOL finished) { }];
}
} @synthesize leftView = _leftView;
- (void)setLeftView:(UIView *)leftView {
_leftView = leftView;
leftView.userInteractionEnabled = NO;
[_leftBackView addSubview:leftView]; [self bringSubviewToFront:_blockBackView];
} @synthesize rightView = _rightView;
- (void)setRightView:(UIView *)rightView {
_rightView = rightView;
rightView.userInteractionEnabled = NO;
[_rightBackView addSubview:rightView]; [self bringSubviewToFront:_blockBackView];
} @synthesize blockView = _blockView;
- (void)setBlockView:(UIView *)blockView {
_blockView = blockView;
blockView.userInteractionEnabled = NO;
[_blockBackView addSubview:blockView]; [self bringSubviewToFront:_blockBackView];
} @synthesize blockAtLeft = _blockAtLeft;
- (void)setBlockAtLeft:(BOOL)blockAtLeft {
_blockAtLeft = blockAtLeft;
if (blockAtLeft == YES) {
_blockBackView.frame = CGRectMake(, ,
self.bounds.size.width / .f,
self.bounds.size.height);
} else {
_blockBackView.frame = CGRectMake(self.bounds.size.width / .f, ,
self.bounds.size.width / .f, self.bounds.size.height);
}
} #pragma mark - 便利构造器
+ (SwitchButton *)createDefaultTypeButtonWithLeftText:(NSString *)leftText
rightText:(NSString *)rightText
size:(CGSize)size {
SwitchButton *button = [[SwitchButton alloc] initWithFrame:CGRectMake(, , size.width, size.height)];
button.layer.cornerRadius = .f;
button.blockAtLeft = NO;
button.leftBackgroundColor = [UIColor colorWithRed:0.969 green:0.365 blue:0.137 alpha:];
button.backgroundColor = [UIColor colorWithRed:0.969 green:0.365 blue:0.137 alpha:];
button.rightBackgroundColor = [UIColor colorWithRed:0.278 green:0.835 blue:0.855 alpha:]; button.duration = 0.3f; // 左侧文本
UILabel *man = [[UILabel alloc] initWithFrame:CGRectMake(, , button.bounds.size.width/.f,
button.bounds.size.height)];
man.text = leftText;
man.textColor = [UIColor whiteColor];
man.font = [UIFont systemFontOfSize:.f];
man.textAlignment = NSTextAlignmentCenter;
button.leftView = man; // 右侧文本
UILabel *woman = [[UILabel alloc] initWithFrame:CGRectMake(, , button.bounds.size.width/.f,
button.bounds.size.height)];
woman.text = rightText;
woman.textColor = [UIColor whiteColor];
woman.font = [UIFont systemFontOfSize:.f];
woman.textAlignment = NSTextAlignmentCenter;
button.rightView = woman; // 中间挡住的块
UIView *blockView = [[UIView alloc] initWithFrame:CGRectMake(, , button.bounds.size.width/.f - ,
button.bounds.size.height - )];
blockView.layer.cornerRadius = .f;
blockView.backgroundColor = [UIColor whiteColor];
button.blockView = blockView; return button;
} @end
使用时候源码：
//
// ViewController.m
// KongJian
//
// Created by YouXianMing on 14/10/24.
// Copyright (c) 2014年 YouXianMing. All rights reserved.
// #import "ViewController.h"
#import "SwitchButton.h" @interface ViewController ()<SwitchButtonDelegate> @end @implementation ViewController - (void)viewDidLoad {
[super viewDidLoad]; SwitchButton *button = [SwitchButton createDefaultTypeButtonWithLeftText:@"Y"
rightText:@"X"
size:CGSizeMake(, )];
button.delegate = self;
button.center = self.view.center;
[self.view addSubview:button];
} - (void)switchButtonState:(BOOL)state {
NSLog(@"%d", state);
} @end
核心的地方：
便利构造器（你可以自己去写）：