XLForm入门

最近项目需要提交表单,先把需求截图附上

如果第一次看到这个页面真的不知道怎么去实现,如果用tableView的话一层层的if else会让人很抓狂,当然页面也不算复杂如果真的用tableView也是可以的.

接触XLForm也是在这个项目中,当时大概浏览了一下项目功能,发现之前有大牛已经做过类似功能,然后瞥见了这个66的第三方

第一次接触就简单在网上看了一下关于XLForm的相关文章,但是有点少,只是稍微一说,真正用的时候还是会遇到很多问题,接下来就来说一下XLForm的使用和坑的解决办法

想要使用XLForm就要创建一个基于XLFormViewController的控制器

#import <XLForm/XLForm.h>
@interface MyFormController : XLFormViewController
@end
复制代码

接下来创建组和表单

XLFormDescriptor *form;//form相当于tableView,事实上form就是基于tableView进行封装的
XLFormSectionDescriptor *section;
XLFormRowDescriptor *row;

form = [XLFormDescriptor formDescriptorWithTitle:@"我的表单"];
//第一个参数设置每个组的标题   第二个参数设置row的类型(插入,删除,可移动)     第三个参数   当row为插入时设置插入方式(最后一行加入添加按钮,在最后一行下方添加添加按钮)
section = [XLFormSectionDescriptor formSectionWithTitle:@"section" sectionOptions:XLFormSectionOptionCanInsert 
sectionInsertMode:XLFormSectionInsertModeButton];
[form addFormSection:section];
//设置XLFormRowDescriptorTypeSelectorPush类型控制器必须是被push出来的,如果是present就不会跳转到下级选择页面
row = [XLFormRowDescriptor formRowDescriptorWithTag:@"class" rowType:XLFormRowDescriptorTypeSelectorPush title:@"类目"];
row.value = [XLFormOptionsObject formOptionsObjectWithValue:@(0) displayText:@"请选择类目"];
row.selectorOptions = @[
                            [XLFormOptionsObject formOptionsObjectWithValue:@(1) displayText:@"Every Day"],
                            [XLFormOptionsObject formOptionsObjectWithValue:@(2) displayText:@"Every Week"],
                            [XLFormOptionsObject formOptionsObjectWithValue:@(3) displayText:@"Every 2 Weeks"],
                            [XLFormOptionsObject formOptionsObjectWithValue:@(4) displayText:@"Every Month"],
                            [XLFormOptionsObject formOptionsObjectWithValue:@(5) displayText:@"Every Year"],
                            ];
[section addFormRow:row];


row = [XLFormRowDescriptor formRowDescriptorWithTag:@"shopTitle" rowType:XLFormRowDescriptorTypeText title:@""];
//当要修改cell中属性时要用到Config这个属性,通过kvc赋值来改变
[row.cellConfigAtConfigure setObject:@"请输入商品标题" forKey:@"textField.placeholder"];
[section addFormRow:row];

//最后不要忘记这句话
self.form = form;
复制代码

上面这些就是XLForm的简单使用,这些类型可以直接从Demo上拷贝下来使用,只是注意一下我注释中的那些细节就可以了,如果不注意的话可能要找好久~~~

接下来就是自定义Row了,其实也挺简单的,类似自定义tableViewCell

#param mark---- 我用的Xib不是纯代码
#import "XLFormGoodsPriceCell.h"


NSString *const XLFormRowDescriptorTypeGoodsPrice = @"price";
@interface XLFormGoodsPriceCell ()

@property (weak, nonatomic) IBOutlet UITextField *priceTextField;
@property (weak, nonatomic) IBOutlet UIButton *priceBtn;
@property (weak, nonatomic) IBOutlet UIButton *onceBtn;

@property (nonatomic, strong) NSDictionary *dict;

@end

@implementation XLFormGoodsPriceCell
- (NSDictionary *)dict{
    if (!_dict) {
        _dict = [NSDictionary dictionary];
    }
    return _dict;
}

+ (void)load{
    [XLFormViewController.cellClassesForRowDescriptorTypes setObject:NSStringFromClass([self class]) forKey:XLFormRowDescriptorTypeGoodsPrice];
}

- (void)configure{
    [super configure];
    self.selectionStyle = UITableViewCellSelectionStyleNone;
}

- (void)update{
    [super update];
    
}

- (IBAction)price:(UIButton *)sender {
    self.onceBtn.selected = NO;
    sender.selected = YES;
}


- (IBAction)oncePrice:(UIButton *)sender {
    self.priceBtn.selected = NO;
    sender.selected = YES;
}


//设置Row的高度
+(CGFloat)formDescriptorCellHeightForRowDescriptor:(XLFormRowDescriptor *)rowDescriptor
{
    return 60;
}
复制代码

//自定义row类型(仔细看XLForm的Demo,你会发现使用自定义Row的时候只导入了Row的头文件,但是row不需要用[类名  alloc]这样的方式去创建,其实它是通过Type来映射到这个类中,相当于工厂模式)
NSString *const XLFormRowDescriptorTypeGoodsPrice = @"price";

//这个类型要在.h中展现出来,并且要用extern声明以便其它类能访问到
extern NSString * const XLFormRowDescriptorTypeGoodsPrice;

//这三个方法要自己重写
+ (void)load{
    //xib  setObject的时候要把class转NSString(但是在纯代码中可以[类名 class]直接使用)
    [XLFormViewController.cellClassesForRowDescriptorTypes setObject:NSStringFromClass([self class]) forKey:XLFormRowDescriptorTypeGoodsPrice];
}

- (void)configure{
    [super configure];
    self.selectionStyle = UITableViewCellSelectionStyleNone;
}

- (void)update{
    [super update];

}

复制代码

###下一个就是添加的Row

section = [XLFormSectionDescriptor formSectionWithTitle:nil sectionOptions:XLFormSectionOptionCanInsert sectionInsertMode:XLFormSectionInsertModeButton];
[form addFormSection:section];
    
row = [XLFormRowDescriptor formRowDescriptorWithTag:@"about" rowType:XLFormRowDescriptorTypeAbout];
[section addFormRow:row];
复制代码

Ps:XLFormSection中的XLFormSectionOptionCanInsert添加的是当前组的第一个类型的Row 因为最后一行的点击添加是添加的最后一行相同的Row,所以要单独把那个Row拿出来当成单独的section

遇到的大概就是这些问题,有些不懂的还请大神指点,多谢多谢...