一.數(shù)據(jù)解析
數(shù)組里面放著字典根欧,字典里面放著一個字符串和關(guān)于車子信息的數(shù)組
這可以看成兩個模型茫孔,里面的數(shù)組是一個模型,外面的數(shù)組也是一個模型
形成了模型嵌套模型的結(jié)果
為了區(qū)分自己定義的類和系統(tǒng)定義的類,可以選中工程在右邊找到Class Prefix為自己創(chuàng)建的類設(shè)置一個標識末荐,比如名字首字母縮寫
開發(fā)過程中文件過多,我們需要按照一定規(guī)則將文件放在不同的文件夾中管理,比如我這里只有一個界面且使用的是MVC方式構(gòu)建邦蜜,所以就可以創(chuàng)建Model,View亥至,Controller三個文件夾
遇到多個界面悼沈,可以先創(chuàng)建界面文件夾在在相應(yīng)文件夾下面創(chuàng)建文件夾
1.創(chuàng)建兩個模型,CarGroupModel和CarModel抬闯,并且自己提供好加載數(shù)據(jù)的方法
我們可以用<類名 *>
放在不明確的地方井辆,比如我這里的NSArray
#import <Foundation/Foundation.h>
#import "XLCarModel.h"
@interface XLCarGroupModel : NSObject
/**小組名*/
@property (nonatomic,copy) NSString *title;
/**小組內(nèi)容*/
@property (nonatomic,copy) NSArray<XLCarModel *> *cars;
//自己提供加載數(shù)據(jù)的方法
+(NSArray<XLCarGroupModel *> *)loaData;
@end
#import <Foundation/Foundation.h>
@interface XLCarModel : NSObject
/**模型圖片*/
@property (nonatomic,copy) NSString *icon;
/**模型名*/
@property (nonatomic,copy) NSString *name;
@end
2.手動解析數(shù)據(jù)
+(NSArray<XLCarGroupModel *> *)loaData{
//獲取plist文件路徑
NSString *filePath = [[NSBundle mainBundle] pathForResource:@"cars_total.plist" ofType:nil];
//獲取文件的內(nèi)容
NSArray *groupArray = [NSArray arrayWithContentsOfFile:filePath];
//NSLog(@"%@",groupModel);
//定義數(shù)組 保存所有g(shù)roup模型數(shù)據(jù)
NSMutableArray *groupModelsArray = [NSMutableArray array];
//手動解析數(shù)據(jù) 封裝為模型
for (NSDictionary *groupDic in groupArray) {
//一個group對應(yīng)一個model
XLCarGroupModel *groupModel = [[XLCarGroupModel alloc] init];
//解析屬性
//title
groupModel.title = [groupDic objectForKey:@"title"];
//通過關(guān)鍵字cars獲取車的所有信息
NSArray *carsArray = [groupDic objectForKey:@"cars"];
//創(chuàng)建數(shù)組保存所有車的模型數(shù)據(jù)
NSMutableArray *carModelsArray = [NSMutableArray array];
//將每一個車的信息封裝為model類型
for (NSDictionary *carDic in carsArray) {
//創(chuàng)建車的模型對象
XLCarModel *carModel = [[XLCarModel alloc] init];
//解析屬性
//icon
carModel.icon = [carDic objectForKey:@"icon"];
//name
carModel.name = [carDic objectForKey:@"name"];
//將carModel模型添加到模型數(shù)組中
[carModelsArray addObject:carModel];
}
//解析屬性
//cars
groupModel.cars = carModelsArray;
//將groupModel模型添加到模型數(shù)組中
[groupModelsArray addObject:groupModel];
}
return groupModelsArray;
}
3.利用MJExtension解析數(shù)據(jù)
+(NSArray<XLCarGroupModel *> *)loaData{
//模型中包含一個數(shù)組 數(shù)組中是另一個模型數(shù)組
//在轉(zhuǎn)化之前需要告訴轉(zhuǎn)化器 這個cars數(shù)組里面到底是什么
[XLCarGroupModel mj_setupObjectClassInArray:^NSDictionary *{
return @{@"cars":@"XLCarModel"};
}];
//數(shù)據(jù)轉(zhuǎn)模型 我只需要告訴你我的數(shù)據(jù)在哪個文件里面
NSArray *groupModelsArray = [XLCarGroupModel mj_objectArrayWithFilename:@"cars_total.plist"];
//NSLog(@"%@",groupModelsArray);
return groupModelsArray;
}
二.根據(jù)數(shù)據(jù)顯示內(nèi)容
1.創(chuàng)建UITableView并設(shè)置代理
//加載數(shù)據(jù)
self.groupModelsArray = [XLCarGroupModel loaData];
//創(chuàng)建
self.tableView = [[UITableView alloc] initWithFrame:self.view.bounds style:UITableViewStyleGrouped];
//配置
_tableView.delegate = self;
_tableView.dataSource = self;
//顯示
[self.view addSubview:_tableView];
2.配置tableView有多少個section以及每個section有多少個row,以及每個section的title
//設(shè)置有多少個section
-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
return _groupModelsArray.count;
}
//設(shè)置每個section有多少個row
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
//取出section對應(yīng)的模型數(shù)據(jù)
XLCarGroupModel *model = [_groupModelsArray objectAtIndex:section];
return model.cars.count;
}
//設(shè)置每個section的title
-(NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section{
//取出section對應(yīng)的模型數(shù)據(jù)
XLCarGroupModel *model = [_groupModelsArray objectAtIndex:section];
return model.title;
}
3.設(shè)置索引列表
//設(shè)置索引列表
-(NSArray<NSString *> *)sectionIndexTitlesForTableView:(UITableView *)tableView{
// //1.遍歷所有的groupmodel 獲取title
// NSMutableArray *titlesArray = [NSMutableArray array];
//
// for (XLCarGroupModel *groupModel in _groupModelsArray) {
// [titlesArray addObject:groupModel.title];
// }
//
// //2.kvc
return [_groupModelsArray valueForKey:@"title"];
}
4.配置cell高度
//設(shè)置cell的高度
-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
return 60;
}
三.設(shè)置每個row顯示什么什么樣的UITableViewCell
1.使用默認的UITableViewCell創(chuàng)建
a.常規(guī)方法
//設(shè)置每個row顯示什么內(nèi)容
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
//1.從隊列里面獲取重復(fù)利用的cell 標識符為cellID
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cellID"];
//2.判斷tableview隊列里面是否有可以利用的cell
if (cell == nil) {
//沒有可以重復(fù)利用的cell
//創(chuàng)建 添加標記
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"cellID"];
}
//對cell的賦值必須放在創(chuàng)建的外面
//在消失的時候 或被原樣扔到隊列里面去
//重復(fù)利用時 需要顯示新的內(nèi)容
//取出section對應(yīng)的group模型
XLCarGroupModel *model = [_groupModelsArray objectAtIndex:indexPath.section];
//取出row對應(yīng)的car模型
XLCarModel *carModel = [model.cars objectAtIndex:indexPath.row];
//獲得圖片
cell.imageView.image = [UIImage imageNamed:carModel.icon];
//獲得名字
cell.textLabel.text = carModel.name;
return cell;
}
b.減少代碼量的方法
先在viewDidload里面注冊
//注冊一下tableView需要顯示的cell的類型和對應(yīng)的標識符
//當重復(fù)利用的隊列里面沒有重復(fù)利用的cell
//tableView就會自動創(chuàng)建一個設(shè)定的class類型的cell溶握,并添加標識符
[_tableView registerClass:[UITableViewCell class] forCellReuseIdentifier:@"cellID"];
配置cell
//設(shè)置每個row顯示什么內(nèi)容
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cellID"];
//對cell的賦值必須放在創(chuàng)建的外面
//在消失的時候 或被原樣扔到隊列里面去
//重復(fù)利用時 需要顯示新的內(nèi)容
//取出section對應(yīng)的group模型
XLCarGroupModel *model = [_groupModelsArray objectAtIndex:indexPath.section];
//取出row對應(yīng)的car模型
XLCarModel *carModel = [model.cars objectAtIndex:indexPath.row];
//獲得圖片
cell.imageView.image = [UIImage imageNamed:carModel.icon];
//獲得名字
cell.textLabel.text = carModel.name;
//設(shè)置默認的accessoryType
cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;
//自定義一個accessoryView
cell.accessoryView = [[UISwitch alloc] initWithFrame:CGRectMake(0, 0, 60, 40)];
return cell;
}
2.使用代碼自定義cell杯缺,在自定義cell里面封裝創(chuàng)建
//自己創(chuàng)建一個類方法
+(XLCarCell *)cellWithModel:(XLCarModel *)model TableView:(UITableView *)tableView{
XLCarCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cellID"];
if (cell == nil) {
cell = [[XLCarCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"cellID"];
}
cell.model = model;
return cell;
}
//手動或者系統(tǒng)自動生成cell都會調(diào)用initWithStyle方法
//界面布局就在這里面寫
-(instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier{
if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]) {
//注意:執(zhí)行這個代碼的時候 cell只有默認尺寸 高度是44 寬度是tableView的寬度
//在layoutSubview里面計算
//圖片
self.iconImageView = [UIImageView new];
//文本
self.nameLabel = [UILabel new];
_nameLabel.textAlignment = NSTextAlignmentLeft;
[self.contentView addSubview:_iconImageView];
[self.contentView addSubview:_nameLabel];
}
return self;
}
-(void)layoutSubviews{
[super layoutSubviews];
//重新設(shè)置坐標
//使用masonry設(shè)置控件的約束
[_iconImageView mas_makeConstraints:^(MASConstraintMaker *make) {
make.leading.top.mas_equalTo(10);
make.bottom.mas_equalTo(-10);
make.width.equalTo(self.iconImageView.mas_height);
}];
[_nameLabel mas_makeConstraints:^(MASConstraintMaker *make) {
make.leading.equalTo(self.iconImageView.mas_trailing).offset(20);
make.centerY.equalTo(self.iconImageView);
make.trailing.equalTo(self.mas_trailing).offset(-20);
make.height.equalTo(self);
}];
// _iconImageView.frame = CGRectMake(10, 10, 60, self.viewForLastBaselineLayout.frame.size.height-20);
//
// _nameLabel.frame = CGRectMake(CGRectGetMaxX(_iconImageView.frame)+20, 0, self.frame.size.width-CGRectGetMaxX(_iconImageView.frame)-10, self.frame.size.height);
}
//重寫model的set方法
-(void)setModel:(XLCarModel *)model{
_model = model;
//顯示數(shù)據(jù)
_iconImageView.image = [UIImage imageNamed:_model.icon];
_nameLabel.text = _model.name;
}
3.用xib自定義cell并封裝cell的操作
創(chuàng)建一個User Interface的Empty文件,拖動一個TableViewCell進去睡榆,并將其與我們創(chuàng)建的類關(guān)聯(lián)萍肆,一定要給cell設(shè)置Identifier
-(void)setModel:(XLCarModel *)model{
_model = model;
//數(shù)據(jù)來了 給控件賦值
_iconImageView.image = [UIImage imageNamed:model.icon];
_nameLabel.text = model.name;
}
+(XLCarXibCell *)cellWithModel:(XLCarModel *)model TableView:(UITableView *)tableView{
XLCarXibCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cellID"];
//如果沒有重復(fù)利用的就自己創(chuàng)建
if (!cell) {
//使用loadNib方法加載xib里面的cell
cell = [[[NSBundle mainBundle] loadNibNamed:@"XLCarXibCell" owner:self options:nil] firstObject];
}
cell.model = model;
return cell;
}
四.運行結(jié)果
工程文件的鏈接
鏈接:https://pan.baidu.com/s/1HnALqHfo-dfEAgFjmcpX2Q 密碼:road