iOS开发 - 圆形验证码(或密码)输入框的封装

项目中用到了圆形验证码输入框,输入框之间要求有一定的距离,UI图如下:

UI图
  • 上面的UI图主要有以下几个要求:
    • 输入框为圆形
    • 输入框之间有适当距离
    • 输入框颜色在输入文本时有变化

刚开始想着用固定的几个 UITextField 实现,但转念一想,用 UITextField 实现有点麻烦(输入框多的话,它们之间的响应事件不太容易控制,需要来回变换),于是开始想其它办法,最后用了以下的思路:

  • 创建一个 UITextField,用 UILabel 显示 UITextField 上输入的数字,需要监听文本的输入,同时对 UILabel 进行一些操作,再用 block 将输入的文本传出来。
封装的圆形输入框主要实现了以下功能:输入框的数量、距离、颜色、大小等都可以自行设定,用起来也很方便,只需以下几行代码即可:
    NNValidationCodeView *view = [[NNValidationCodeView alloc] initWithFrame:CGRectMake(80, 100, 300, 45) andLabelCount:4 andLabelDistance:10];
    [self.view addSubview:view];
    view.changedColor = [UIColor yellowColor];
    view.codeBlock = ^(NSString *codeString) {
        NSLog(@"验证码:%@", codeString);
    };

这是 demo 的效果图:

效果图1
效果图2

由于代码很容易看懂,另外代码中也写了注释,因此这里不再对项目做过多的陈述,这是 demo地址,需要的话可以拿去借鉴,有什么不足之处希望能留下宝贵意见或建议!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 这世上存在许许多多的弱势群体,他们饱受着煎熬。 让我感触颇深的就是我身边发生的事...
    对影成双丹阅读 3,146评论 3 2
  • 世界上最遥远的距离,那是在你转身后,我眼泪坠落的轨迹。
    玉翼婵娟阅读 1,166评论 0 0
  • 毕业一年的时候,某一次跟才子聊天,他说:“才子还真的一点都没变啊……”我疑惑地问他具体指什么,他说:“我啊,从一个...
    玉妃说阅读 4,042评论 0 1

友情链接更多精彩内容