原創Blog，轉載請註明出處

下午的時候閒著無聊，簡單想了想，用三個UILabel來實現這個簡單的自定義UISwitch

效果圖，

當然，有些粗糙，後續有時間了我會把介面優化下。直接拿去用估計介面粗糙了點，網上也有很多原始碼。在寫了這麼多Blog後發現，其實學會思考非常重要，這裡希望拋磚引玉，讓想要學習的同學知道如何去自定義一個控制元件。

第一步，分析下自定義控制元件的組成要素

在我這裡就是四個部分

1.左半部分檢視－UILabel

2.右半部分檢視－UILabel

3.滑動的檢視－UILabel

4.對滑動的檢視新增手勢－UITapGestureRecognizer

第二步，設計介面

在我這裡介面比較簡單，就是這個控制元件的狀態，用Bool來表示

所以標頭檔案為

#import <UIKit/UIKit.h>

@interface HwcCustomUISwitch : UIView
@property (nonatomic)BOOL isOn;
@end

第三步，設計實現

1.對三個Label在Getter中採用惰性初始化，對滑動的View新增手勢識別

2.對isOn的Setter函式中進行UI同步，保證每次Model改變了，View改變（MVC模式）

.m檔案為

//
//  HwcCustomUISwitch.m
//  CustomActivityIndicator
//
//  Created by huangwenchen on 15/1/5.
//  Copyright (c) 2015年 BlogForCSDN. All rights reserved.
//

#import "HwcCustomUISwitch.h"

@interface HwcCustomUISwitch()
@property (strong,nonatomic) UILabel * leftLabel;
@property (strong,nonatomic) UILabel * rightLabel;
@property (strong,nonatomic) UILabel * tagLabel;
@end

@implementation HwcCustomUISwitch
-(UILabel*)tagLabel{
    if (!_tagLabel) {
        CGRect frame = self.isOn?CGRectMake(0, 0,self.frame.size.width/2, self.frame.size.height):CGRectMake(self.frame.size.width/2,0, self.frame.size.width/2,self.frame.size.height);
        _tagLabel = [[UILabel alloc] initWithFrame:frame];
    }
    return  _tagLabel;
}
-(UILabel*)leftLabel{
    if (!_leftLabel) {
        CGRect frame = CGRectMake(0, 0, self.frame.size.width/2, self.frame.size.height);
        _leftLabel = [[UILabel alloc] initWithFrame:frame];
        _leftLabel.text = @"ON";
        _leftLabel.textAlignment = NSTextAlignmentCenter;
    }
    return _leftLabel;
}
-(UILabel*)rightLabel{
    if (!_rightLabel) {
        CGRect frame = CGRectMake(self.frame.size.width/2,0, self.frame.size.width/2, self.frame.size.height);
        _rightLabel = [[UILabel alloc] initWithFrame:frame];
        _rightLabel.text = @"OFF";
        _rightLabel.textAlignment = NSTextAlignmentCenter;

    }
    return _rightLabel;
}
-(void)setIsOn:(BOOL)isOn{
    CGFloat width = self.frame.size.width;
    CGFloat height = self.frame.size.height;
    _isOn = isOn;
    if (isOn) {
        [UIView animateWithDuration:1.0
                              delay:0.01
                            options:UIViewAnimationOptionCurveEaseInOut
                         animations:^{
                             self.tagLabel.center = CGPointMake(width/4,height/2);
                         } completion:^(BOOL finished) {
                             
                         }];
    }else{
        [UIView animateWithDuration:1.0
                              delay:0.01
                            options:UIViewAnimationOptionCurveEaseInOut
                         animations:^{
                             self.tagLabel.center = CGPointMake(3*width/4,height/2);
                         } completion:^(BOOL finished) {
                             
                         }];
    }
}
-(void)setUp{
    UITapGestureRecognizer * tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tap)];
    [self.tagLabel addGestureRecognizer:tap];
    self.tagLabel.userInteractionEnabled = YES;
    self.userInteractionEnabled = YES;
    self.rightLabel.backgroundColor = [UIColor brownColor];
    [self addSubview:self.rightLabel];
    self.leftLabel.backgroundColor = [UIColor yellowColor];
    [self addSubview:self.leftLabel];
    self.tagLabel.backgroundColor = [UIColor greenColor];
    [self addSubview:self.tagLabel];
    self.layer.cornerRadius = self.frame.size.height/10;
    self.clipsToBounds = YES;
}
-(void)tap{
    self.isOn = !self.isOn;
}
-(id)initWithCoder:(NSCoder *)aDecoder{
    if (self = [super initWithCoder:aDecoder]) {
        [self setUp];
    }
    return self;
}
-(id)initWithFrame:(CGRect)frame{
    if (self = [super initWithFrame:frame]) {
        [self setUp];
    }
    return self;
}
@end
 

    HwcCustomUISwitch * hwcSwitch = [[HwcCustomUISwitch alloc] initWithFrame:CGRectMake(100, 100, 100, 40)];
    [self.view addSubview:hwcSwitch];