iOS自定义的UISwitch按钮

因为项目需要在UISwitch按钮上写文字，系统自带的UISwitch是这样的：



既不能写字，也不能改颜色，于是在网上找到了这么一个自定义的Switch按钮，具体出处找不见了。记录一下，怕以后找不见了。

先看下效果图：



按钮的样式很多，可以文字，可以写多行，文字大小和颜色都可以设置。

看下它的源码：

[cpp] view
plaincopy

#import <Foundation/Foundation.h>

@interface HMCustomSwitch : UISlider {

BOOL on;

UIColor *tintColor;

UIView *clippingView;

UILabel *rightLabel;

UILabel *leftLabel;

// private member

BOOL m_touchedSelf;

}

@property(nonatomic,getter=isOn) BOOL on;

@property (nonatomic,retain) UIColor *tintColor;

@property (nonatomic,retain) UIView *clippingView;

@property (nonatomic,retain) UILabel *rightLabel;

@property (nonatomic,retain) UILabel *leftLabel;

+ (HMCustomSwitch *) switchWithLeftText: (NSString *) tag1 andRight: (NSString *) tag2;

- (void)setOn:(BOOL)on animated:(BOOL)animated;

.m文件

[cpp] view
plaincopy

#import "HMCustomSwitch.h"

@implementation HMCustomSwitch

@synthesize on;

@synthesize tintColor, clippingView, leftLabel, rightLabel;

+(HMCustomSwitch *)switchWithLeftText:(NSString *)leftText andRight:(NSString *)rightText

{

HMCustomSwitch *switchView = [[HMCustomSwitch alloc] initWithFrame:CGRectZero];

switchView.leftLabel.text = leftText;

switchView.rightLabel.text = rightText;

return [switchView autorelease];

}

-(id)initWithFrame:(CGRect)rect

{

if ((self=[super initWithFrame:CGRectMake(rect.origin.x,rect.origin.y,95,27)]))

{

// self.clipsToBounds = YES;

[self awakeFromNib]; // do all setup in awakeFromNib so that control can be created manually or in a nib file

}

return self;

}

-(void)awakeFromNib

{

[super awakeFromNib];

self.backgroundColor = [UIColor clearColor];

[self setThumbImage:[UIImage imageNamed:@"switchThumb.png"] forState:UIControlStateNormal];

[self setMinimumTrackImage:[UIImage imageNamed:@"switchBlueBg.png"] forState:UIControlStateNormal];

[self setMaximumTrackImage:[UIImage imageNamed:@"switchOffPlain.png"] forState:UIControlStateNormal];

self.minimumValue = 0;

self.maximumValue = 1;

self.continuous = NO;

self.on = NO;

self.value = 0.0;

self.clippingView = [[UIView alloc] initWithFrame:CGRectMake(4,2,87,23)];

self.clippingView.clipsToBounds = YES;

self.clippingView.userInteractionEnabled = NO;

self.clippingView.backgroundColor = [UIColor clearColor];

[self addSubview:self.clippingView];

[self.clippingView release];

NSString *leftLabelText = NSLocalizedString(@"ON","Custom UISwitch ON label. If localized to empty string then I/O will be used");

if ([leftLabelText length] == 0)

{

leftLabelText = @"l"; // use helvetica lowercase L to be a 1.

}

self.leftLabel = [[UILabel alloc] init];

self.leftLabel.frame = CGRectMake(0, 0, 48, 23);

self.leftLabel.text = leftLabelText;

self.leftLabel.textAlignment = NSTextAlignmentCenter;

self.leftLabel.font = [UIFont boldSystemFontOfSize:17];

self.leftLabel.textColor = [UIColor whiteColor];

self.leftLabel.backgroundColor = [UIColor clearColor];

// self.leftLabel.shadowColor = [UIColor redColor];

// self.leftLabel.shadowOffset = CGSizeMake(0,0);

[self.clippingView addSubview:self.leftLabel];

[self.leftLabel release];

NSString *rightLabelText = NSLocalizedString(@"OFF","Custom UISwitch OFF label. If localized to empty string then I/O will be used");

if ([rightLabelText length] == 0)

{

rightLabelText = @"O"; // use helvetica uppercase o to be a 0.

}

self.rightLabel = [[UILabel alloc] init];

self.rightLabel.frame = CGRectMake(95, 0, 48, 23);

self.rightLabel.text = rightLabelText;

self.rightLabel.textAlignment = NSTextAlignmentCenter;

self.rightLabel.font = [UIFont boldSystemFontOfSize:17];

self.rightLabel.textColor = [UIColor grayColor];

self.rightLabel.backgroundColor = [UIColor clearColor];

// self.rightLabel.shadowColor = [UIColor redColor];

// self.rightLabel.shadowOffset = CGSizeMake(0,0);

[self.clippingView addSubview:self.rightLabel];

[self.rightLabel release];

}

-(void)layoutSubviews

{

[super layoutSubviews];

// NSLog(@"leftLabel=%@",NSStringFromCGRect(self.leftLabel.frame));

// move the labels to the front

[self.clippingView removeFromSuperview];

[self addSubview:self.clippingView];

CGFloat thumbWidth = self.currentThumbImage.size.width;

CGFloat switchWidth = self.bounds.size.width;

CGFloat labelWidth = switchWidth - thumbWidth;

CGFloat inset = self.clippingView.frame.origin.x;

// NSInteger xPos = self.value * (self.bounds.size.width - thumbWidth) - (self.leftLabel.frame.size.width - thumbWidth/2);

NSInteger xPos = self.value * labelWidth - labelWidth - inset;

self.leftLabel.frame = CGRectMake(xPos, 0, labelWidth, 23);

// xPos = self.value * (self.bounds.size.width - thumbWidth) + (self.rightLabel.frame.size.width - thumbWidth/2);

xPos = switchWidth + (self.value * labelWidth - labelWidth) - inset;

self.rightLabel.frame = CGRectMake(xPos, 0, labelWidth, 23);

// NSLog(@"value=%f xPos=%i",self.value,xPos);

// NSLog(@"thumbWidth=%f self.bounds.size.width=%f",thumbWidth,self.bounds.size.width);

}

- (UIImage *)image:(UIImage*)image tintedWithColor:(UIColor *)tint

{

if (tint != nil)

{

UIGraphicsBeginImageContext(image.size);

//draw mask so the alpha is respected

CGContextRef currentContext = UIGraphicsGetCurrentContext();

CGImageRef maskImage = [image CGImage];

CGContextClipToMask(currentContext, CGRectMake(0, 0, image.size.width, image.size.height), maskImage);

CGContextDrawImage(currentContext, CGRectMake(0,0, image.size.width, image.size.height), image.CGImage);

[image drawAtPoint:CGPointMake(0,0)];

[tint setFill];

UIRectFillUsingBlendMode(CGRectMake(0,0,image.size.width,image.size.height),kCGBlendModeColor);

UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();

UIGraphicsEndImageContext();

return newImage;

}

else

{

return image;

}

}

-(void)setTintColor:(UIColor*)color

{

if (color != tintColor)

{

[tintColor release];

tintColor = [color retain];

[self setMinimumTrackImage:[self image:[UIImage imageNamed:@"switchBlueBg.png"] tintedWithColor:tintColor] forState:UIControlStateNormal];

}

}

- (void)setOn:(BOOL)turnOn animated:(BOOL)animated;

{

on = turnOn;

if (animated)

{

[UIView beginAnimations:nil context:nil];

[UIView setAnimationDuration:0.2];

}

if (on)

{

self.value = 1.0;

}

else

{

self.value = 0.0;

}

if (animated)

{

[UIView commitAnimations];

}

}

- (void)setOn:(BOOL)turnOn

{

[self setOn:turnOn animated:NO];

}

- (void)endTrackingWithTouch:(UITouch *)touch withEvent:(UIEvent *)event

{

NSLog(@"preendTrackingWithtouch");

[super endTrackingWithTouch:touch withEvent:event];

NSLog(@"postendTrackingWithtouch");

m_touchedSelf = YES;

[self setOn:on animated:YES];

}

- (void)touchesBegan:(NSSet*)touches withEvent:(UIEvent*)event

{

[super touchesBegan:touches withEvent:event];

NSLog(@"touchesBegan");

m_touchedSelf = NO;

on = !on;

}

- (void)touchesEnded:(NSSet*)touches withEvent:(UIEvent*)event

{

[super touchesEnded:touches withEvent:event];

NSLog(@"touchesEnded");

if (!m_touchedSelf)

{

[self setOn:on animated:YES];

[self sendActionsForControlEvents:UIControlEventValueChanged];

}

}

-(void)dealloc

{

[tintColor release];

[clippingView release];

[rightLabel release];

[leftLabel release];

[super dealloc];

}

@end

看代码可以知道，其实它是通过继承UISlider控件实现的，UISlider的左右分别是个UILabel，当YES的时候，滑块滑到了最右边，NO的时候滑到了最左边。

如何在代码中使用它呢？很简单：

[cpp] view
plaincopy

- (void)loadView

{

UIView *contentView = [[UIView alloc] initWithFrame:[[UIScreen mainScreen] applicationFrame]];

self.view = contentView;

contentView.backgroundColor = [UIColor whiteColor];

// Standard ON/OFF

HMCustomSwitch *switchView = [[HMCustomSwitch alloc] initWithFrame:CGRectZero];

switchView.center = CGPointMake(160.0f, 20.0f);

switchView.on = YES;

[contentView addSubview:switchView];

[switchView release];

// Custom YES/NO

switchView = [HMCustomSwitch switchWithLeftText:@"YES" andRight:@"NO"];

switchView.center = CGPointMake(160.0f, 60.0f);

switchView.on = YES;

[contentView addSubview:switchView];

// Custom font and color

switchView = [HMCustomSwitch switchWithLeftText:@"Hello " andRight:@"ABC "];

switchView.center = CGPointMake(160.0f, 100.0f);

switchView.on = YES;

[switchView.leftLabel setFont:[UIFont boldSystemFontOfSize:13.0f]];

[switchView.rightLabel setFont:[UIFont italicSystemFontOfSize:15.0f]];

[switchView.rightLabel setTextColor:[UIColor blueColor]];

[contentView addSubview:switchView];

// Multiple lines

switchView = [HMCustomSwitch switchWithLeftText:@"Hello\nWorld" andRight:@"Bye\nWorld"];

switchView.center = CGPointMake(160.0f, 140.0f);

switchView.on = YES;

switchView.tintColor = [UIColor orangeColor];

switchView.leftLabel.font = [UIFont boldSystemFontOfSize:9.0f];

switchView.rightLabel.font = [UIFont boldSystemFontOfSize:9.0f];

switchView.leftLabel.numberOfLines = 2;

switchView.rightLabel.numberOfLines = 2;

switchView.leftLabel.lineBreakMode = NSLineBreakByWordWrapping;

switchView.rightLabel.lineBreakMode = NSLineBreakByWordWrapping;

[contentView addSubview:switchView];

switchView = [[HMCustomSwitch alloc] init];

switchView.center = CGPointMake(160.0f, 180.0f);

switchView.on = YES;

switchView.tintColor = [UIColor purpleColor];

[contentView addSubview:switchView];

[switchView release];

switchView = [HMCustomSwitch switchWithLeftText:@"l" andRight:@"O"];

switchView.center = CGPointMake(160.0f, 220.0f);

// customSwitch.tintColor = [UIColor colorWithRed:125.f/255.f green:157.f/255.f blue:93.f/255.f alpha:1.0];

// customSwitch.tintColor = [UIColor colorWithRed:125.f/255.f green:157.f/255.f blue:93.f/255.f alpha:1.0];

[contentView addSubview:switchView];

// Standard ON/OFF

switchView = [[HMCustomSwitch alloc] init];

switchView.center = CGPointMake(160.0f, 260.0f);

switchView.tintColor = [UIColor colorWithRed:125.f/255.f green:157.f/255.f blue:93.f/255.f alpha:1.0];

[switchView addTarget:self action:@selector(switchFlipped:) forControlEvents:UIControlEventValueChanged];

[contentView addSubview:switchView];

[switchView release];

UIToolbar *toolbar = [[UIToolbar alloc] initWithFrame:CGRectMake(0, 420, 320, 40)];

toolbar.tintColor = [UIColor colorWithRed:125.f/255.f green:157.f/255.f blue:93.f/255.f alpha:1.0];

[contentView addSubview:toolbar];

[contentView release];

}

-(void)switchFlipped:(HMCustomSwitch*)switchView

{

NSLog(@"switchFlipped=%f on:%@",switchView.value, (switchView.on?@"Y":@"N"));

}

代码下载地址：https://github.com/schelling/HMCustomSwitch

容芳志 (http://blog.csdn.net/totogo2010)

本文遵循“署名-非商业用途-保持一致”创作公用协议