一 简述
XLForm 是最灵活且最强大的创建动态表单的iOS库。以下是这个库一个简单的结构图:
最主要的是红色方框的三个类:
XLFormRowDescriptor
,XLFormSectionDescriptor
,XLFormDescriptor
。
1.XLFormDescriptor
结构和UITablView一样,有Section,有Row,它就是为成为UITableView的数据源而设计的。
2.XLFormRowDescriptor
定义了每行表单的数据内容,包括行样式,标题,行类型,选择项内容,标签,合法性验证等。
3.XLFormSectionDescriptor
是由XLFormRowDescriptor
组合而成的,而XLFormSectionDescriptor
最终又组成了XLFormDescriptor
。
二 用法
1.创建继承于XLFormViewController
的ViewController。
2.创建表格:
XLFormDescriptor * form;//建立表单,等同于创建uitableview
XLFormSectionDescriptor * section;//建立组 section
XLFormRowDescriptor * row;//建立行相当于cell
//先将组添加到表单
//设置标题
form = [XLFormDescriptor formDescriptorWithTitle:@"Add Event"];
section = [XLFormSectionDescriptor formSection];
[form addFormSection:section];
// 添加一个cell
row = [XLFormRowDescriptor formRowDescriptorWithTag:@"Title" rowType:XLFormRowDescriptorTypeText];
//设置placeholder
[row.cellConfigAtConfigure setObject:@"Title" forKey:@"textField.placeholder"];
row.required = YES;
[section addFormRow:row];
3.最后一步:
self.form = form;
// 把form对象赋值给父类的form。不然不显示表单。
运行工程,简单三步一个简单的表单已然出现。并且XLForm已经将你的键盘管理的妥妥当当的。再也不担心遮挡输入框了😁。
三 自定义Cell
// 内部直接赋值
NSString * const XLFormRowDescriporTypeFloat = @"XLFormRowDescriporTypeFloat";
@interface MKJFloatTextFieldCell () <UITextFieldDelegate>
@end
@implementation MKJFloatTextFieldCell
// 在主表单中注册对应的cell以及对应的ID
+(void)load
{
[XLFormViewController.cellClassesForRowDescriptorTypes setObject:NSStringFromClass([MKJFloatTextFieldCell class]) forKey:XLFormRowDescriporTypeFloat];
}
// 这个方法是用来设置属性的 必须重写 类似于初始化的属性不变的属性进行预先配置
- (void)configure
{
[super configure];
self.selectionStyle = UITableViewCellSelectionStyleNone;
self.leftLabel.layer.borderColor = [UIColor yellowColor].CGColor;
self.leftLabel.layer.borderWidth = 1.0f;
self.textField.delegate = self;
self.textField.font = [UIFont boldSystemFontOfSize:16];
self.textField.floatingLabel.font = [UIFont boldSystemFontOfSize:11];
self.textField.clearButtonMode = UITextFieldViewModeWhileEditing;
self.textField.floatingLabelTextColor = [UIColor lightGrayColor];
self.textField.floatingLabelActiveTextColor = [UIColor redColor];
}
// 这个方法是用来进行更新的,外面给唯一的字段Value设定值就好了 通过self.rowDescriptor.value的值变化来进行更新
- (void)update
{
[super update];
NSDictionary *value = self.rowDescriptor.value;
self.leftLabel.text = [value objectForKey:@"left"];
self.textField.text = [value objectForKey:@"right"];
self.textField.attributedPlaceholder =
[[NSAttributedString alloc] initWithString:self.rowDescriptor.title
attributes:@{NSForegroundColorAttributeName: [UIColor lightGrayColor]}];
self.textField.floatingLabel.text = @"快点输入面积大小";
}
有些特定事件,需要在VC里面进行判断更新或者移除或者增加
// 每个cell内部的参数属性更改了就会调用这个方法,我们再次更新的话就会调用cell里面update的方法进行重绘
- (void)formRowDescriptorValueHasChanged:(XLFormRowDescriptor *)formRow oldValue:(id)oldValue newValue:(id)newValue
{
// 咱们这里统一调用更新
[super formRowDescriptorValueHasChanged:formRow oldValue:oldValue newValue:newValue];
[self updateFormRow:formRow];
// 以下就是一些典型的tag判断,根据不同的cell,remove 或 update进行更改
// if ([rowDescriptor.tag isEqualToString:@"first"]){
//
// }
// else if ([rowDescriptor.tag isEqualToString:@"second"]){
//
// [self updateFormRow:startDateDescriptor];
// [self updateFormRow:endDateDescriptor];
// }
// else if ([rowDescriptor.tag isEqualToString:@"third"]){
//
// [self updateFormRow:endDateDescriptor];
//
// }
// else if ([rowDescriptor.tag isEqualToString:@"这里填写的就是我们注册的ID"]){
//
// }
}
表单填完了,无论自定义还是自带的,都要搜集填写的数据
1.验证数据合法性:[self formValidationErrors];
2.获取所有数据:[self formValues];
最后给大家一个cell样式的总汇
#import "XLForm.h"
// JVFloatLabeledTextField 普通的文本输入框,自带浮动动画
NSString *const XLFormRowDescriptorTypeText = @"text";
// add的时候展示名字的 JVFloatLabeledTextField
NSString *const XLFormRowDescriptorTypeName = @"name";
// 填写URL的cell
NSString *const XLFormRowDescriptorTypeURL = @"url";
NSString *const XLFormRowDescriptorTypeEmail = @"email";
NSString *const XLFormRowDescriptorTypePassword = @"password";
NSString *const XLFormRowDescriptorTypeNumber = @"number";
NSString *const XLFormRowDescriptorTypePhone = @"phone";
NSString *const XLFormRowDescriptorTypeTwitter = @"twitter";
NSString *const XLFormRowDescriptorTypeAccount = @"account";
NSString *const XLFormRowDescriptorTypeInteger = @"integer";
// 选择更换头像图片的cell
NSString *const XLFormRowDescriptorTypeImage = @"image";
NSString *const XLFormRowDescriptorTypeDecimal = @"decimal";
// JVFloat对应的textView的cell
NSString *const XLFormRowDescriptorTypeTextView = @"textView";
NSString *const XLFormRowDescriptorTypeZipCode = @"zipCode";
// 非常普通的点击push选择
NSString *const XLFormRowDescriptorTypeSelectorPush = @"selectorPush";
NSString *const XLFormRowDescriptorTypeSelectorPopover = @"selectorPopover";
NSString *const XLFormRowDescriptorTypeSelectorActionSheet = @"selectorActionSheet";
NSString *const XLFormRowDescriptorTypeSelectorAlertView = @"selectorAlertView";
NSString *const XLFormRowDescriptorTypeSelectorPickerView = @"selectorPickerView";
NSString *const XLFormRowDescriptorTypeSelectorPickerViewInline = @"selectorPickerViewInline";
NSString *const XLFormRowDescriptorTypeMultipleSelector = @"multipleSelector";
NSString *const XLFormRowDescriptorTypeMultipleSelectorPopover = @"multipleSelectorPopover";
NSString *const XLFormRowDescriptorTypeSelectorLeftRight = @"selectorLeftRight";
// 三段选择
NSString *const XLFormRowDescriptorTypeSelectorSegmentedControl = @"selectorSegmentedControl";
// date 月 日 年 (内嵌)
NSString *const XLFormRowDescriptorTypeDateInline = @"dateInline";
// 日期picker选择器内嵌 dateTime更详细 星期 月 日 小时 分(内嵌)
NSString *const XLFormRowDescriptorTypeDateTimeInline = @"datetimeInline";
// date 小时 分 AM/PM(内嵌)
NSString *const XLFormRowDescriptorTypeTimeInline = @"timeInline";
// 计时器,选择hh mm(内嵌)
NSString *const XLFormRowDescriptorTypeCountDownTimerInline = @"countDownTimerInline";
// 月 日 年 sheet
NSString *const XLFormRowDescriptorTypeDate = @"date";
// 最详细的dateTime sheet
NSString *const XLFormRowDescriptorTypeDateTime = @"datetime";
// 小时 分 AM/PM sheet
NSString *const XLFormRowDescriptorTypeTime = @"time";
// 计时器 底部弹出来的
NSString *const XLFormRowDescriptorTypeCountDownTimer = @"countDownTimer";
// 直接展示一大坨datePicker
NSString *const XLFormRowDescriptorTypeDatePicker = @"datePicker";
NSString *const XLFormRowDescriptorTypePicker = @"picker";
// slider
NSString *const XLFormRowDescriptorTypeSlider = @"slider";
// 展示选中打钩的cell
NSString *const XLFormRowDescriptorTypeBooleanCheck = @"booleanCheck";
// 自带右边switch开关
NSString *const XLFormRowDescriptorTypeBooleanSwitch = @"booleanSwitch";
// button的cell 各种button位置需求
NSString *const XLFormRowDescriptorTypeButton = @"button";
// 简单的右侧描述信息的cell
NSString *const XLFormRowDescriptorTypeInfo = @"info";
// 展示segment count计数
NSString *const XLFormRowDescriptorTypeStepCounter = @"stepCounter";
传送门 XLForm GitHub