JhForm
JhForm - 自定義表單工具類驶赏,通過動(dòng)態(tài)配置表單model炸卑,可以更加簡單、快捷的創(chuàng)建表單煤傍、設(shè)置頁面
GitHub地址:https://github.com/iotjin/JhForm
目錄
特性 - Features
- 動(dòng)態(tài)配置表單model
- 必填選填盖文、錄入校驗(yàn)
- 配置標(biāo)題、前綴圖標(biāo)蚯姆,后綴文字五续、圖標(biāo)
- 單行洒敏、多行錄入、密碼錄入疙驾,最大錄入限制凶伙,實(shí)時(shí)錄入監(jiān)聽與鍵盤切換
- 支持添加自定義文本、時(shí)間它碎、地區(qū)選擇器
- 支持相機(jī)拍照與圖庫選擇函荣,支持本地與網(wǎng)絡(luò)圖片、視頻
- 單選扳肛、多選按鈕
- 支持右側(cè)傻挂、底部、完全自定義樣式
- 右側(cè)箭頭顯隱設(shè)置
- 引用自定義xib Cell與model
- 支持暗黑模式
- 提交按鈕和導(dǎo)航條配置
- 錄入樣式排版:左標(biāo)題右詳情挖息,或者上標(biāo)題下詳情
- 快速構(gòu)建設(shè)置界面
簡介 - Introduce
- JhFormModel:配置單個(gè)cell踊谋、section
- JhFormTableViewVC:持有JhFormTableView,配置導(dǎo)航條和底部提交按鈕旋讹,添加數(shù)據(jù)源
- JhFormConst:全局配置默認(rèn)屬性
- JhFormHandler:model的數(shù)據(jù)校驗(yàn)
- JhFormCell:繼承JhFormBaseCell殖蚕,遵循JhFormProtocol,根據(jù)JhFormModel實(shí)現(xiàn)不同cell
- JhFormTableView:通過傳入的數(shù)據(jù)源沉迹,創(chuàng)建遵循JhFormProtocol的cell睦疫,根據(jù)sectionModel創(chuàng)建header和footer
- JhFormProtocol:通過cellModel 配置對(duì)應(yīng)的cell,配置cell高度(可選)
安裝 - Installation
手動(dòng)導(dǎo)入
手動(dòng)導(dǎo)入:將項(xiàng)目中的“JhForm”文件夾拖入項(xiàng)目中
使用前導(dǎo)入頭文件 "JhFormTableViewVC.h"
- Requirements
引用的三方庫
# 將以下內(nèi)容添加到您的Podfile中:
# 選擇圖片依賴HXPhotoPicker和SDWebImage鞭呕,可以分開加或者使用: pod 'HXPhotoPicker/SDWebImage', '3.1.6'
pod 'HXPhotoPicker', '3.1.6'
pod 'SDWebImage', '5.10.0'
# 選擇圖片下載在線視頻需要使用AFNetworking
pod 'AFNetworking', '4.0.1'
# 可選蛤育,建議加
pod 'IQKeyboardManager', '6.5.6'
# 搜索不到庫或最新版時(shí)請(qǐng)執(zhí)行
pod repo update 或 rm ~/Library/Caches/CocoaPods/search_index.json
關(guān)于相機(jī)相冊的info配置
- 訪問相冊和相機(jī)需要配置四個(gè)info.plist文件
- Privacy - Photo Library Usage Description 和 Privacy - Camera Usage Description 以及 Privacy - Microphone Usage Description
- Privacy - Location When In Use Usage Description 使用相機(jī)拍照時(shí)會(huì)獲取位置信息
- 相機(jī)拍照功能請(qǐng)使用真機(jī)調(diào)試
使用 - Use
- 繼承JhFormTableViewVC
- 配置cellModel和sectionModel
- 添加到數(shù)據(jù)源即可快速創(chuàng)建表單
- 具體配置請(qǐng)看應(yīng)用示例或項(xiàng)目demo
默認(rèn)支持的Cell - Default supported cell
- 表單錄入Cell
- 表單選擇Cell
- 表單TextView錄入Cell
- 表單錄入密碼Cell
- 表單圖片選擇Cell
- 表單按鈕選擇Cell
- 表單右側(cè)自定義Cell
- 表單底部自定義Cell
- 表單完全自定義Cell
- 表單Switch按鈕Cell
- 表單標(biāo)題居中Cell
配置項(xiàng)說明 - Configure
* 必填選填:默認(rèn)必填展示小紅星,選填隱藏葫松,可配置標(biāo)題后綴展示“必填選填”文字
* 左側(cè)圖標(biāo):默認(rèn)隱藏瓦糕,可設(shè)置圖片、圖片大小
* 標(biāo)題:默認(rèn)居上展示腋么,可設(shè)置字體咕娄、顏色、寬度珊擂、換行圣勒、垂直居中展示,為空隱藏
* 詳情:默認(rèn)居上展示摧扇,自動(dòng)換行圣贸,可設(shè)置詳情和提示文字的字體、顏色扛稽,鍵盤切換吁峻,錄入長度/總長度展示,最大錄入限制,文字居左居右排版用含,密碼錄入單行展示
* 右側(cè)按鈕:默認(rèn)隱藏橙困,可設(shè)置圖片和文字,點(diǎn)擊事件
* 右側(cè)箭頭:默認(rèn)選擇樣式顯示耕餐,可設(shè)置顯隱
* 默認(rèn)自定義樣式:可設(shè)置右側(cè)自定義凡傅、底部自定義、完全自定義視圖
* 圖片選擇:設(shè)置相機(jī)拍照與圖庫選擇(支持本地與網(wǎng)絡(luò)圖片肠缔、視頻)夏跷,可設(shè)置默認(rèn)選擇圖片、視頻明未,最大選擇數(shù)槽华,底部提示文字
* 按鈕選擇:設(shè)置單選和多選,寬度自適應(yīng)趟妥,設(shè)置默認(rèn)選中按鈕猫态,按鈕顏色、字體披摄,切換按鈕圖標(biāo)等
* 默認(rèn)自定義樣式:支持右側(cè)自定義亲雪、底部自定義、完全自定義
* 底部提交按鈕:默認(rèn)展示疚膊,可設(shè)置隱藏义辕、按鈕字體、顏色寓盗、背景色
* 導(dǎo)航條:設(shè)置title灌砖,右側(cè)文字、圖標(biāo)傀蚌、點(diǎn)擊事件
* 暗黑模式:默認(rèn)自動(dòng)切換
注:
- JhFormCellModel 針對(duì)單個(gè)頁面某些屬性動(dòng)態(tài)配置
- JhFormTableViewVC.h 針對(duì)整個(gè)頁面進(jìn)行表單提交按鈕基显、導(dǎo)航條配置
- JhFormConst 針對(duì)項(xiàng)目范圍內(nèi)進(jìn)行屬性配置
應(yīng)用示例 - Examples
錄入Cell
//設(shè)置右側(cè)文字
JhFormCellModel *phone = JhFormCellModel_AddInputCell(@"手機(jī)號(hào):", @"", YES, UIKeyboardTypePhonePad);
phone.Jh_placeholder = @"請(qǐng)輸入手機(jī)號(hào)";
phone.Jh_maxInputLength = 11;
phone.Jh_rightBtnWidth = 70;
phone.Jh_rightBtnTitle = @"+通訊錄";
phone.Jh_rightBtnTitleColor = [UIColor redColor];
phone.Jh_rightBtnClickBlock = ^(UIButton * _Nonnull button) {
[weakSelf.view hx_showImageHUDText:@"點(diǎn)擊通訊錄"];
};
//設(shè)置右側(cè)圖文
JhFormCellModel *cell6 = JhFormCellModel_AddInputCell(@"手機(jī)號(hào)2:", @"", YES, UIKeyboardTypePhonePad);
cell6.Jh_placeholder =@"設(shè)置右側(cè)圖文";
cell6.Jh_rightBtnWidth = 70;
cell6.Jh_rightBtnTitle = @"文字";
cell6.Jh_rightBtnImgName = @"ic_emotions";
cell6.Jh_rightBtnImgWH = 25;
cell6.Jh_rightBtnImgTextMargin = 5;
cell6.Jh_rightBtnClickBlock = ^(UIButton * _Nonnull button) {
[weakSelf.view hx_showImageHUDText:@"點(diǎn)擊右側(cè)圖文"];
};
//右側(cè)自定義view的優(yōu)先級(jí)高于右側(cè)按鈕的圖文
JhFormCellModel *code = JhFormCellModel_AddInputCell(@"驗(yàn)證碼:", @"", YES, UIKeyboardTypeNumberPad);
code.Jh_placeholder = @"請(qǐng)輸入驗(yàn)證碼";
code.Jh_maxInputLength = 6;
code.Jh_isShowArrow = YES;
// ---- 設(shè)置rightViewWidth 這些就沒有用了
// cell6.Jh_rightBtnWidth = 70;
// cell6.Jh_rightBtnTitle = @"換行";
// cell6.Jh_rightBtnImgName = @"ic_wallet";
// cell6.Jh_rightBtnImgWH = 30;
// cell6.Jh_rightBtnImgTextMargin = 0.1;
// ---- 設(shè)置rightViewWidth 這些就沒有用了
code.Jh_rightViewWidth = 100;
//右側(cè)自定義view 可添加倒計(jì)時(shí)按鈕
code.Jh_rightViewBlock = ^(UIView * _Nonnull rightView) {
rightView.backgroundColor =[UIColor orangeColor];
};
選擇Cell
JhFormCellModel *selectCell = JhFormCellModel_AddSelectCell(@"性別:", @"男", YES);
selectCell.Jh_placeholder = @"請(qǐng)選擇性別";
// __weak typeof(selectCell) weakSelectCell = selectCell;
selectCell.Jh_cellSelectBlock = ^(JhFormCellModel *cellModel) {
//1.使用自己熟悉的選擇彈框 ,選擇完成對(duì) Jh_info 賦值 (需要對(duì)應(yīng)ID的話對(duì)Jh_info_idStr 賦值 )
//2. 刷新 [weakSelf.Jh_formTableView reloadData];
};
selectCell.Jh_cellNotEdit = YES;
TextView錄入Cell
JhFormCellModel *textViewInput = JhFormCellModel_AddTextViewInputCell(@"備注:", @"", NO);
textViewInput.Jh_placeholder = @"選填,請(qǐng)輸入備注(最多500字)";
textViewInput.Jh_maxInputLength = 500;
錄入密碼Cell
pwd.JhInputBlock = ^(NSString * _Nonnull text, BOOL isInputCompletion) {
NSLog(@"當(dāng)前的輸入狀態(tài): %@", isInputCompletion ? @"YES" : @"NO");
NSLog(@"文字: %@", text);
};
圖片選擇Cell
//默認(rèn)選擇圖片與相機(jī)拍照
JhFormCellModel *picture = JhFormCellModel_AddImageCell(@"選擇圖片:", NO);
picture.Jh_tipInfo =@"這是一條默認(rèn)顏色的提示信息(不設(shè)置不顯示)";
picture.Jh_leftImgName = @"ic_album";
picture.Jh_leftImgRightMargin = 5;
//選擇視頻
JhFormCellModel *video = JhFormCellModel_AddImageCell(@"選擇視頻:", YES);
video.Jh_maxImageCount = 2;
video.Jh_tipInfo =@"這是一條可設(shè)置顏色的提示信息";
video.Jh_tipInfoColor = [UIColor redColor];
video.Jh_selectImageType = JhSelectImageTypeVideo;
video.Jh_videoMinimumDuration = 1;
video.Jh_rightBtnImgName = @"ic_album";
video.Jh_rightBtnWidth = 30;
video.Jh_rightBtnHeight = 30;
video.Jh_rightBtnClickBlock = ^(UIButton * _Nonnull button) {
[weakSelf.view hx_showImageHUDText:@"點(diǎn)擊圖片"];
};
//默認(rèn)加載網(wǎng)絡(luò)圖片
JhFormCellModel *urlPicture = JhFormCellModel_AddImageCell(@"加載網(wǎng)絡(luò)圖片:", NO);
// urlPicture.Jh_noShowAddImgBtn=YES;
// urlPicture.Jh_hideDeleteButton = YES;
urlPicture.Jh_imageArr =@[@"https://gitee.com/iotjh/Picture/raw/master/FormDemo/form_demo_00.png",
@"https://gitee.com/iotjh/Picture/raw/master/FormDemo/form_demo_05.png",
@"https://gitee.com/iotjh/Picture/raw/master/FormDemo/form_demo_06.png"];
按鈕選擇Cell
//單選善炫,3個(gè)選項(xiàng)撩幽,設(shè)置圖標(biāo)
JhFormCellModel *cell2 = JhFormCellModel_AddSelectBtnCell(@"單選3選項(xiàng)", YES, YES);
cell2.Jh_selectBtnCell_btnTitleArr = @[@"上午",@"下午",@"晚上"];
cell2.Jh_selectBtnCell_unSelectIcon=Jh_Icon_CheckBoxNormal;
cell2.Jh_selectBtnCell_selectIcon=Jh_Icon_CheckBoxSelect;
//單選,設(shè)置上標(biāo)題下選項(xiàng)销部,一個(gè)選項(xiàng)一行
JhFormCellModel *cell5 = JhFormCellModel_AddSelectBtnCell(@"單選摸航,一選項(xiàng)一行:", YES, YES);
cell5.Jh_selectBtnCell_btnIconSpace = 40;
cell5.Jh_selectBtnCell_btnTitleArr = @[@"2020年1月-3月",@"2020年4月-6月",@"2020年7月-9月"];
cell5.Jh_selectBtnCell_isSingleLineDisplay = YES;
cell5.Jh_selectBtnCell_isTopTitleBottomOption = YES;
//多選制跟,3個(gè)選項(xiàng)
JhFormCellModel *cell7 = JhFormCellModel_AddSelectBtnCell(@"多選3選項(xiàng)", YES, YES);
cell7.Jh_selectBtnCell_isMultiSelect=YES;
cell7.Jh_selectBtnCell_btnTitleArr = @[@"上午",@"下午",@"晚上"];
cell7.Jh_selectBtnCell_selectTitleArr = @[@"晚上"];
//多選舅桩,多個(gè)選項(xiàng),設(shè)置圖標(biāo)顏色
JhFormCellModel *cell8 = JhFormCellModel_AddSelectBtnCell(@"多選多選項(xiàng)", YES, YES);
cell8.Jh_selectBtnCell_isMultiSelect=YES;
cell8.Jh_selectBtnCell_btnTitleArr = @[@"星期一",@"星期二",@"星期三",@"星期四",@"星期五",];
cell8.Jh_selectBtnCell_btnUnSelectIconColor = [UIColor blueColor];
cell8.Jh_selectBtnCell_btnSelectIconColor = [UIColor redColor];
cell8.Jh_selectBtnCell_selectTitleArr = @[@"星期二",@"星期三",@"星期四"];
右側(cè)自定義Cell
//輸入cell右側(cè)設(shè)置自定義view
JhFormCellModel *cell0 = JhFormCellModel_AddInputCell(@"InputCell右側(cè)設(shè)置自定義view", @"", YES, UIKeyboardTypeNumberPad);
cell0.Jh_maxInputLength = 500;
cell0.Jh_rightViewWidth = 120; //右側(cè)自定義view 可添加倒計(jì)時(shí)按鈕
cell0.Jh_rightViewBlock = ^(UIView * _Nonnull rightView) {
rightView.backgroundColor =JhRandomColor;
};
cell0.Jh_cellTextVerticalCenter =YES;
//右側(cè)自定義View Cell
JhFormCellModel *cell1 = JhFormCellModel_AddCustumRightCell(@"右側(cè)自定義:");
cell1.Jh_cellHeight = 60;
cell1.Jh_rightViewBlock = ^(UIView * _Nonnull rightView) {
rightView.backgroundColor = JhRandomColor;
};
底部自定義Cell
//底部自定義View Cell
JhFormCellModel *cell3 = JhFormCellModel_AddCustumBottomCell(@"底部自定義:");
cell3.Jh_cellHeight = 150;
cell3.Jh_custumBottomViewBlock = ^(UIView * _Nonnull bottomView) {
bottomView.backgroundColor = JhRandomColor;
};
完全自定義Cell
JhFormCellModel *Section1_cell1 = JhFormCellModel_AddCustumALLViewCell(80);
Section1_cell1.Jh_custumALLViewBlock = ^(UIView * _Nonnull allView) {
allView.backgroundColor = [UIColor yellowColor];
UILabel *label = [[UILabel alloc]init];
label.text = @"這是完全自定義view添加的label";
label.textColor = [UIColor redColor];
label.frame=CGRectMake(0, 30, Jh_ScreenWidth-30, 20);
[allView addSubview:label];
};
Switch按鈕Cell
//Switch按鈕
JhFormCellModel *switchBtn = JhFormCellModel_AddSwitchBtnCell(@"開關(guān)Cell:", YES);
switchBtn.Jh_switchTintColor = [UIColor orangeColor];
//可以不通過block獲取開關(guān)狀態(tài)
__weak typeof(switchBtn) weakSwitchBtn = switchBtn;
switchBtn.Jh_switchBtnBlock = ^(BOOL switchBtn_on, UISwitch *switchBtn) {
weakSwitchBtn.Jh_switchOnTintColor = JhRandomColor; //切換開關(guān)要進(jìn)行的操作
[weakSelf.Jh_formTableView reloadData];//刷新
NSLog(@"switchBtn_on %@", switchBtn_on ? @"YES" : @"NO");
};
JhFormCellModel *switchBtn2 = JhFormCellModel_AddSwitchBtnCell(@"標(biāo)題", NO);
switchBtn2.Jh_leftImgName = @"ic_collections";
switchBtn2.Jh_leftImgWH = 30;
// switchBtn2.Jh_hiddenLine = YES;
switchBtn2.Jh_leftImgRightMargin = 12;
switchBtn2.Jh_tipInfo = @"這是提示文字";
switchBtn2.Jh_cellTextVerticalCenter = YES;
標(biāo)題居中Cell
JhFormCellModel *centerText = JhFormCellModel_AddCenterTextCell(@"退出登錄");
centerText.Jh_cellHeight = 60;
centerText.Jh_leftImgName = @"ic_emotions";
centerText.Jh_leftImgRightMargin = -5;
centerText.Jh_cellSelectBlock = ^(JhFormCellModel * _Nonnull cellModel) {
[weakSelf.view hx_showImageHUDText:@"點(diǎn)擊了退出登錄"];
};
導(dǎo)航條和提交按鈕
#pragma mark - 設(shè)置導(dǎo)航條title和右側(cè)文字
-(void)setNav{
self.Jh_navTitle = @"表單Demo1 - 默認(rèn)";
self.Jh_navRightTitle =@"文字";
self.JhClickNavRightItemBlock = ^{
NSLog(@" 點(diǎn)擊跳轉(zhuǎn) ");
};
}
//提交按鈕相關(guān)設(shè)置(當(dāng)個(gè)頁面)雨膨,全局配置在JhFormConst文件中修改
self.Jh_submitBtnBgColor = [UIColor redColor]; //全局配置背景色要去修改BaseThemeColor
self.Jh_submitBtnTBSpace = 30;
self.Jh_submitBtnLRSpace = 100;
self.Jh_submitBtnHeight = 50;
self.Jh_submitBtnTextColor = [UIColor yellowColor];
self.Jh_submitBtnCornerRadius = 25.0;
self.Jh_submitBtnTextFontSize = 22;
//粗體
self.Jh_submitBtn.titleLabel.font = [UIFont fontWithName:@"Helvetica-Bold"size:30];
//邊框
self.Jh_submitBtn.layer.borderWidth = 2;
self.Jh_submitBtn.layer.borderColor = [[UIColor grayColor] CGColor];
self.Jh_submitStr = @"提 交";
單頁面統(tǒng)一配置
//如需要單頁面統(tǒng)一配置擂涛,放在添加數(shù)據(jù)源后面
//隱藏默認(rèn)的footerView
self.Jh_defaultFooterViewHidden = YES;
//可隱藏整個(gè)頁面的紅星按只有標(biāo)題顯示
self.Jh_leftTitleHiddenRedStar =YES;
//統(tǒng)一設(shè)置左側(cè)title的寬度
self.Jh_leftTitleWidth = 120;
添加數(shù)據(jù)源和提交數(shù)據(jù)的獲取
NSMutableArray *cellArr0 = [NSMutableArray array];
[cellArr0 addObjectsFromArray: @[cell0,cell1,cell2,cell3,cell4,cell5,cell6,cell7]];
JhFormSectionModel *section0 = JhSectionModel_Add(cellArr0);
[self Jh_addSectionModel:section0];
self.Jh_submitStr = @"提 交";
self.Jh_formSubmitBlock = ^{
NSLog(@" 點(diǎn)擊提交按鈕 ");
NSLog(@" cell0.Jh_info - %@", cell0.Jh_info);
NSLog(@" cell1.Jh_info - %@", cell1.Jh_info);
NSLog(@" cell2 選中按鈕 - %@", cell2.Jh_selectBtnCell_selectIndexArr);
NSLog(@" 開關(guān)的狀態(tài) - %@", switchBtn.Jh_switchBtn_on ? @"YES" : @"NO");
NSLog(@" cell3.Jh_info - %@", cell3.Jh_info);
NSLog(@" name.Jh_info - %@", name.Jh_info);
NSLog(@" phone.Jh_info - %@", phone.Jh_info);
NSLog(@" pwd.Jh_info - %@", pwd.Jh_info);
NSLog(@" textViewInput.Jh_info - %@", textViewInput.Jh_info);
NSLog(@" 選擇圖片 - picture : %@ ",picture.Jh_selectImageArr);
NSLog(@" 選擇圖片 - video : %@ ",video.Jh_selectVideoArr);
// 這里只是簡單描述校驗(yàn)邏輯,可根據(jù)自身需求封裝數(shù)據(jù)校驗(yàn)邏輯
[JhFormHandler Jh_checkEmptyWithFormData:weakSelf.Jh_formModelArr success:^{
[weakSelf SubmitRequest];
} failure:^(NSString *error) {
NSLog(@"error====%@",error);
//使用自己熟悉的彈框組件
[weakSelf.view hx_showImageHUDText:error];
}];
};
- 更多請(qǐng)下載工程查看
最近更新
* 2020.12.09 - v2.0.0版本,代碼重構(gòu)撒妈,支持自定義xib Cell與model恢暖,此版本變動(dòng)較大,若引用v1.5.0版本之前版本謹(jǐn)慎更新 <br>
* 2020.11.13 - v1.5.0版本狰右,添加視頻選擇效果杰捂,支持本地和網(wǎng)絡(luò)視頻選擇與展示 <br>
GitHub地址:https://github.com/iotjin/JhForm