前段时间项目中要做一个本地图片验证码功能,然后写了个demo 【demo在此,欢迎star】,源码讲解如下:
先来一张效果图压压惊
一、自定义View,封装验证码方法
1、在KenCodeView.h里面主要是,声明一些属性和方法,属性有:字符数组,验证码字符串和展示验证码的label,在这里声明的改变验证码的方法是为了一会儿在Controller中调用的。
#import <UIKit/UIKit.h>
@interface KenCodeView : UIView
@property (nonatomic, retain) NSArray *changeArray;//验证码需要的字符组成数组
@property (nonatomic, retain) NSMutableString *changeString;//展示的验证码字符串
@property (nonatomic, retain) UILabel *codeLabel;//展示验证码字符串的label
//改变验证码的方法,controller中调用
-(void)changeCode;
@end
2、KenCodeView.m中初始化时调用的方法,设置了随机的背景颜色,并调用组成验证码字符方法。
//初始化时调用
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
float red = arc4random() % 100 / 100.0;
float green = arc4random() % 100 / 100.0;
float blue = arc4random() % 100 / 100.0;
UIColor *color = [UIColor colorWithRed:red green:green blue:blue alpha:0.2];
//随机背景颜色
self.backgroundColor = color;
//调用组成字符的方法
[self change];
}
return self;
}
3、这是生成验证码的方法,当中调用生成验证码的字符方法,setNeedsDisplay是调用drawRect方法,所以Controller中只需要调用这个方法就可以重新生成验证码。
//Controller中调用此方法可更换验证码
-(void)changeCode{
//调用组成字符的方法
[self change];
//显示
[self setNeedsDisplay];
}
4、这是生成验证码的字符方法,根据你的需求进行素材组合和字符控制,我这儿是4个字符的例子,用self.changString进行接收这个验证码字符。
//组成验证码字符的方法
- (void)change
{
//验证码字符素材
self.changeArray = [[NSArray alloc] initWithObjects:@"0",@"1",@"2",@"3",@"4",@"5",@"6",@"7",@"8",@"9",@"A",@"B",@"C",@"D",@"E",@"F",@"G",@"H",@"I",@"J",@"K",@"L",@"M",@"N",@"O",@"P",@"Q",@"R",@"S",@"T",@"U",@"V",@"W",@"X",@"Y",@"Z",@"a",@"b",@"c",@"d",@"e",@"f",@"g",@"h",@"i",@"j",@"k",@"l",@"m",@"n",@"o",@"p",@"q",@"r",@"s",@"t",@"u",@"v",@"w",@"x",@"y",@"z",nil];
NSMutableString *getStr = [[NSMutableString alloc] initWithCapacity:5];
self.changeString = [[NSMutableString alloc] initWithCapacity:6];
//随机从数组中选取需要个数的字符串(我选的4),拼接为验证码字符,最终的字符串用self.changeString接收
for(NSInteger i = 0; i < 4; i++)
{
NSInteger index = arc4random() % ([self.changeArray count] - 1);
getStr = [self.changeArray objectAtIndex:index];
//这是随机的验证码字符串
self.changeString = (NSMutableString *)[self.changeString stringByAppendingString:getStr];
}
}
5、好!关键的方法来了,这个方法是通过setNeedsDisplay来调用的,是绘制方法.我这里面主要代码都有注释,请详细观看!
//绘制
- (void)drawRect:(CGRect)rect {
[super drawRect:rect];
float red = arc4random() % 100 / 100.0;
float green = arc4random() % 100 / 100.0;
float blue = arc4random() % 100 / 100.0;
UIColor *color = [UIColor colorWithRed:red green:green blue:blue alpha:0.5];
//随机背景颜色,因为重新更换验证码也要走这个方法,所以设置背景颜色
[self setBackgroundColor:color];
//根据要显示的验证码字符串,根据长度,计算每个字符串显示的位置
NSString *text = [NSString stringWithFormat:@"%@",self.changeString];
CGSize cSize = [@"S" sizeWithFont:[UIFont systemFontOfSize:20]];
int width = rect.size.width / text.length - cSize.width;
int height = rect.size.height - cSize.height;
CGPoint point;
//依次绘制每一个字符,可以设置显示的每个字符的字体大小、颜色、样式等
float pX, pY;
for (int i = 0; i < text.length; i++)
{
pX = arc4random() % width + rect.size.width / text.length * i;
pY = arc4random() % height;
point = CGPointMake(pX, pY);
unichar c = [text characterAtIndex:i];
NSString *textC = [NSString stringWithFormat:@"%C", c];
[textC drawAtPoint:point withFont:[UIFont systemFontOfSize:20]];
}
//调用drawRect之前,系统会向栈中压入一个CGContextRef,调用UIGraphicsGetCurrentContext()会取栈顶的CGContextRef
CGContextRef context = UIGraphicsGetCurrentContext();
//设置线条的宽度
CGContextSetLineWidth(context, 1.0);
//绘制干扰线
for(int cout = 0; cout < 10; cout++)
{
red = arc4random() % 100 / 100.0;
green = arc4random() % 100 / 100.0;
blue = arc4random() % 100 / 100.0;
color = [UIColor colorWithRed:red green:green blue:blue alpha:0.2];
//设置线条填充色
CGContextSetStrokeColorWithColor(context, [color CGColor]);
//设置线的起点
pX = arc4random() % (int)rect.size.width;
pY = arc4random() % (int)rect.size.height;
CGContextMoveToPoint(context, pX, pY);
//设置线的终点
pX = arc4random() % (int)rect.size.width;
pY = arc4random() % (int)rect.size.height;
CGContextAddLineToPoint(context, pX, pY);
//画线
CGContextStrokePath(context);
}
}
二、Controller中调用代码
1、在ViewController.m里面首先导入KenCodeView,并在ViewDidLoad中初始化;
//初始化刚刚封装过的KenCodeView
_KenCodeView = [[KenCodeView alloc] initWithFrame:CGRectMake(50, 100, 82, 32)];
//创建轻击手势
UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapClick:)];
[_KenCodeView addGestureRecognizer:tap];
[self.view addSubview:_KenCodeView];
2、实现轻击手势事件,点击调用更换验证码的方法
//轻击手势事件
- (void)tapClick:(UITapGestureRecognizer*)tap{
//调用更换验证码的方法
[_KenCodeView changeCode];
//输出目前验证码的字符
NSLog(@"%@",_KenCodeView.changeString);
}