iOS | 自定义验证码输入框

最近项目中遇到了这个需求，所以就写了一个。

效果

思路

用一个UITextField来接收用户的输入，用一个横向UICollectionView来展示用户的输入。把UICollectionView放到UITextField的上面，不让用户看到UITextField。

核心逻辑代码

#pragma mark - 文本改变时回调

- (void)textFieldTextChanged {
    // 限制输入长度
    if (self.textField.text.length > kVerifyCodeLength) {
        self.textField.text = [self.textField.text substringToIndex:kVerifyCodeLength];
        return;
    }
    
    [self.dataArray removeAllObjects];
    
    // 遍历字符串，加入数据源数组
    for(int i =0; i < [self.textField.text length]; i++)
    {
        NSString *a = [self.textField.text substringWithRange:NSMakeRange(i, 1)];
        [self.dataArray addObject:a];
    }
    
    // 数据源数组空余部分用空字符串补充
    for (NSInteger i = self.textField.text.length; i < kVerifyCodeLength; i++) {
        [self.dataArray addObject:@""];
    }
    
    [self.collectionView reloadData];
    
    // 输入完成回调
    if (self.textField.text.length == kVerifyCodeLength) {
        !self.inputCompletion ?: self.inputCompletion(self.textField.text);
    }
}

demo

https://github.com/CaiWanFeng/CQVerifyCodeView