StruggleiOS 干货整理

iOS XLForm速用教程

2017-03-02  本文已影响2697人  木马不在转

一 简述

XLForm 是最灵活且最强大的创建动态表单的iOS库。以下是这个库一个简单的结构图:


最主要的是红色方框的三个类:

XLFormRowDescriptorXLFormSectionDescriptorXLFormDescriptor
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

福利
上一篇 下一篇

猜你喜欢

热点阅读