前言
写这篇文章,主要是想给大家分享在OC语言中快速实现表单界面,有输入框,有选择框,有默认数据等等,笔者最近做到一个项目,界面几乎都是这类型,纠结了许多种方法,最终选择使用model配合json字典来实现,如图,
多种样式的加载
看到这界面,你们有什么好的想法也可以在评论区说说比较快速的实现方案,好了,我直接说我的方法
1.构建Json 数据
需要什么,搭建什么,因为图中具备左边固定的文本lable,右边有输入框或者箭头或者带请输入的文本lable是吧,所以我们需要一个类型,来加载不一样的Cell,说到这边Cell,笔者这边使用Xib画了一个cell,点h文件如下
#import <UIKit/UIKit.h>
NS_ASSUME_NONNULL_BEGIN
//表单通用Cell
@interface ATTableCurrencyCell : UITableViewCell
@property (weak, nonatomic) IBOutlet NSLayoutConstraint *rightCons;
@property (weak, nonatomic) IBOutlet UILabel *leftLable;
@property (weak, nonatomic) IBOutlet UIImageView *arrowImage;
@property (weak, nonatomic) IBOutlet UILabel *rightLable;
@property (weak, nonatomic) IBOutlet UITextField *textField;
- (void)setupCellSubView:(int)Type;
@end
NS_ASSUME_NONNULL_END
Cell点m,传入类型,做显示隐藏 以及间距
xib
#import "ATTableCurrencyCell.h"
@implementation ATTableCurrencyCell
-(void)setupCellSubView:(int)Type{
_leftLable.textColor = k_MainViceTextColor;
switch (Type) {
case 1:
_rightLable.hidden = _leftLable.hidden = NO;
_textField.hidden = YES;
_arrowImage.hidden = YES;
_rightCons.constant = 0;
break;
case 2:
_rightCons.constant = 14;
_rightLable.hidden = _leftLable.hidden = _arrowImage.hidden =NO;;
_textField.hidden = YES;
break;
case 3:
_rightLable.hidden = _arrowImage.hidden = _rightLable.hidden = YES;
_textField.hidden = NO;
break;
default:
break;
}
}
@end
好了,以上是Cell的自定义,我们接着说构建json模块:
sectionTitle,对应的section标题(判断section的时候可以用这个字段,做其他判断);
items,对应的indexPatch.row的每一行cell数据(包含左侧标题,以及默认显示文字,以及存储输入或者选择的值property属性,以及type类型,cell加载就是根据这个type来加载的~)
直接上代码吧~
#pragma mark -
#pragma mark - 构建Json
_localDatas = @[
@{
@"sectionTitle" : @"",
@"items" : @[
@{
@"title" : @"学历",
@"details" : @"请选择",
@"type" : @2,
@"property" : @"education",
},
@{
@"title" : @"擅长技能",
@"details" : @"请选择",
@"type" : @2,
@"property" : @"goodAtskills",
},
@{
@"title" : @"技能证书",
@"details" : @"请选择",
@"type" : @2,
@"property" : @"skill"
},
@{
@"title" : @"工作所在地",
@"details" : @"请选择",
@"type" : @2,
@"property" : @"guideNum"
},
@{
@"title" : @"期望工作城市",
@"details" : @"请选择",
@"type" : @2,
@"property" : @"native",
},
]
},
@{
@"sectionTitle" : @"",
@"items" : @[
@{
@"title" : @"联系电话",
@"details" : @"请输入联系电话",
@"type" : @3,
@"property" : @"phone",
@"maxLenth":@12, //字数限制
},
@{
@"title" : @"当前薪资",
@"details" : @"请输入当前报酬",
@"type" : @3,
@"property" : @"currentSalary",
@"maxLenth":@12, //字数限制
},
@{
@"title" : @"期望薪资",
@"details" : @"请输入当前报酬",
@"type" : @3,
@"property" : @"salaryExpectation",
@"maxLenth":@12, //字数限制
},
@{
@"title" : @"当前岗位",
@"details" : @"请输入当前岗位",
@"type" : @3,
@"property" : @"currentPosition",
@"maxLenth":@12, //字数限制
},
@{
@"title" : @"期望行业",
@"details" : @"请输入期望行业",
@"type" : @3,
@"property" : @"desiredIndustry",
@"maxLenth":@12, //字数限制
},
@{
@"title" : @"期望岗位",
@"details" : @"请输入期望岗位",
@"type" : @3,
@"property" : @"desiredPosition",
@"maxLenth":@12, //字数限制
},
@{
@"title" : @"工作年限",
@"details" : @"请输入工作年限",
@"type" : @3,
@"property" : @"workingLive",
@"textFiledText":@"",
},
]
},
@{
@"sectionTitle" : @"工作经历",
@"items" : @[
@{
@"title" : @"",
@"details" : @"请输入你的工作经历,如2018年3月-2019年3月在博尔克公司担任经纪人职位",
@"type" : @4,
@"property" : @"workExperience"
}
]
},
@{
@"sectionTitle" : @"教育经历",
@"items" : @[
@{
@"title" : @"",
@"details" : @"请输入你的教育经历,如2018年3月-2019年3月厦门大学就读",
@"type" : @4,
@"property" : @"educationExperience"
}
]
},
@{
@"sectionTitle" : @"项目经历",
@"items" : @[
@{
@"title" : @"",
@"details" : @"请输入你的项目经历,如2018年3月-2019年3月在博尔克公司负责开发",
@"type" : @4,
@"property" : @"projectExperience"
}
]
},
];
_enterprenModel = [ATEntrepreneurData new];
}
2.使用
//返回多少个区
-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
return [_localDatas count];
}
//返回一个区多少行
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
NSArray *items = _localDatas[section][@"items"];
return items.count;
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
NSArray *items = _localDatas[indexPath.section][@"items"];
NSDictionary *dataDict = items[indexPath.row];
int type = [dataDict[@"type"] intValue];
NSString *title = dataDict[@"title"];
NSString *details = dataDict[@"details"];
NSString *property = dataDict[@"property"];
if (type == 4) {
//只有一个输入框的cell
ATTableInputBoxCell *cell = [tableView dequeueReusableCellWithIdentifier:cellName];
cell.textView.wzb_placeholder = details;
cell.textView.delegate = self;
cell.textView.text = [_enterprenModel valueForKey:property];
return cell;
}else{
//其他根据type来做处理的cell
ATTableCurrencyCell *cell = [tableView dequeueReusableCellWithIdentifier:k_GeneralCell];
cell.selectionStyle = UITableViewCellSelectionStyleNone;
[cell setupCellSubView:type];
cell.leftLable.text = title; //标题
cell.rightLable.text = details; //默认右边文本(请选择)
cell.textField.placeholder = details; //输入框占位文字
[cell.textField addTarget:self action:@selector(actionEditChanged:) forControlEvents:UIControlEventEditingChanged];//输入框监听
//取出model的属性,存在值即赋值,不存在即取默认文本details
NSString *prper = [_enterprenModel valueForKey:property];
if (type == 3) {
cell.textField.text = [_enterprenModel valueForKey:property];
}else{
cell.rightLable.text = prper.length > 0 ? prper : details;
cell.rightLable.textColor = [cell.rightLable.text isEqualToString:@"请选择"] ? k_MainViceTextColor :k_MainTitleColor;
}
return cell;
}
}
//根据sectionTitle 字段返回是否需要标题
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{
UIView *headView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, 47)];
headView.backgroundColor = k_VcBgColor;
NSString *title = _localDatas[section][@"sectionTitle"];
if (!kStringIsEmpty(title)) {
UILabel *headLable = [SWKit labelWithText:title fontSize:k_48 textColor:k_MainTitleColor textAlignment:0 frame:CGRectMake(14, 0, 100, 20)];
[headView addSubview:headLable];
headLable.centerY = headView.centerY;
}
if (section == 0) {
return nil ;
}
return !kStringIsEmpty(title) ? headView :[UIView new];
}
//根据sectionTitle 字段返回区头高度
- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section{
if (section == 0) {
return 0.01 ;
}
NSString *title = _localDatas[section][@"sectionTitle"];
return !kStringIsEmpty(title) ? 47.f : 12.f;
}
- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section{
return 0.01;
}
//根据type 字段返回cell的高度
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
NSArray *items = _localDatas[indexPath.section][@"items"];
NSDictionary *dataDict = items[indexPath.row];
int type = [dataDict[@"type"] intValue];
if (type == 4) {
return 80;
}else{
return kTableViewCellNomolHeigh;
}
}
存储model值
- 输入框([_enterprenModel setValue:textStr forKey:property];方法即可)
- 回调直接设置 _enterprenModel.property = @"值" ;
- (void)actionEditChanged:(UITextField *)textField
{
UITableViewCell *cell = (UITableViewCell *)textField.superview.superview;
NSIndexPath *indexPath = [self.tableView indexPathForCell:cell];
NSArray *items = _localDatas[indexPath.section][@"items"];
NSDictionary *dataDict = items[indexPath.row];
NSString *property = dataDict[@"property"];
NSString *title = dataDict[@"title"];
NSNumber *maxNum = dataDict[@"maxLenth"];
if (maxNum && textStr.length > maxNum.integerValue) {
//使用json里面的maxLenth 字段来判断最大输入,截取
textStr = [textStr substringToIndex:maxNum.integerValue];
textField.text = textStr;
[SVProgressHUD showErrorWithStatus:[NSString stringWithFormat:@"%@最多只能输入%ld个字符哦",title,maxNum.integerValue]];
}
//储存propert
[_enterprenModel setValue:textStr forKey:property];
}
3 配合YYKit 的modelToJSONObject 把属性传递给后端
#pragma mark -
#pragma mark - 提交信息
- (void)compAction{
NSDictionary *parmks = [_enterprenModel modelToJSONObject];
SWLog(@"===%@",parmks);
if (![_enterprenModel isEntrepreneurValid]) {
return;
}
}
//model 的对象方法,拿来判断属性是否都完成
- (BOOL)isEntrepreneurValid{
if ([_education length] == 0 ||
[_skill length] == 0||
[_individual length] == 0||
[_ndividualLicense length] == 0||
[_currentRemuneration length] == 0 ||
[_expectedReward length] == 0||
[_wordLocation length] == 0||
[_expectedWorkCity length] == 0||
[_workingLive length] == 0 ||
[_phone length] == 0||
[_workExperience length] == 0||
[_educationExperience length]==0||
[_projectExperience length] == 0){
[SVProgressHUD showErrorWithStatus:@"请先完善信息"];
return NO;
}
//其他判断
return YES;
}
总结
不知道这种方案是否满足你的需求,如果觉得文章对你有帮助,给点支持!谢谢,如有更好的方案,请留言~✨
