看tableview的资料其实已经蛮久了，一直想写点儿东西，却总是因为各种原因拖延，今天晚上有时间静下心来记录一些最近学习的tableview的知识。下面进入正题，uitableview堪称uikit里面最复杂的一个控件了，使用起来不算难，但是要用好并不容易。当使用的时候我们必须要考虑到后台数据的设计，tableviewcell的设计和重用以及tableview的效率等问题。
上次介绍的uitableview，这里再做一个uitableview的小程序，汽车品牌，截图如下：
1.1创建项目，这里不多讲。
1.2 把所有汽车品牌的图片放到images.xcassets中，如下图：
1.3创建 plist数据，plist数据里面每个array为一个汽车品牌分组，每个array里面又有一个array，这里面存放每个分组下所有的品牌汽车数据，数据如下图。
1.4数据创建完之后，然后设计页面，页面很简单，直接放一个uitable view就可以了。
2.1后台代码，第一步导入
?| 1 |
<uitableviewdatasource,uitableviewdelegate,uialertviewdelegate>
|
只有导入这uitable view的这几个代理，我们才能在后面的代码中使用uitable view的一些相对应的方法。
2.2 创建uitable view控件的属性，和创建一个存储数据的数组，如下。
?
| 1 2 |
@property (weak, nonatomic) iboutlet uitableview *tableview;
@property(nonatomic,strong)nsarray *cargroups;
|
2.3 加载数据，这边先要创建两个模型类来保存数据，国为我们这里的数据都在本地的plist文化中，所以我们要把这个plist里面的数据读取出来保存在
创建的cargroups数组中，而本地的plist文件是一个array类型，而每个array里面又有一个array数组，所以我们要创建两个模型类来保存数据，一个模型类保存外面的array数据，一个模型类来保存array里面的子array数据，然后在模型类里面创建和plist里面对应的数据的属性和方法
代码如下：
?| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 |
#import <foundation/foundation.h>
@interface zkcarmodel : nsobject
//头像
@property(nonatomic,copy)nsstring * icon;
//名字
@property(nonatomic,copy)nsstring *name;
+(instancetype)carwithdict:(nsdictionary *)dic;
-(instancetype)initwithdict:(nsdictionary *)dic;
@end
#import "zkcarmodel.h"
@implementation zkcarmodel
-(instancetype)initwithdict:(nsdictionary *)dic
{
if(self=[super init])
{
[self setvaluesforkeyswithdictionary:dic];
}
return self;
}
+(instancetype)carwithdict:(nsdictionary *)dic
{
return [[self alloc] initwithdict:dic];
}
@end
#import <foundation/foundation.h>
#import "zkcarmodel.h"
@interface zkcargroupmodel : nsobject
//题目
@property(nonatomic,copy)nsstring *title;
@property(nonatomic,strong)nsarray *cars;
+(instancetype)cargroupwithdic:(nsdictionary *)dic;
-(instancetype)initwithdict:(nsdictionary *)dic;
@end
#import "zkcargroupmodel.h"
@implementation zkcargroupmodel
-(instancetype)initwithdict:(nsdictionary *)dic
{
if(self=[super init])
{
self.title=dic[@"title"];
nsmutablearray *array=[nsmutablearray array];
for (nsdictionary *dict in dic[@"cars"]) {
zkcarmodel *car=[zkcarmodel carwithdict:dict];
[array addobject:car];
}
self.cars=array;
}
return self;
}
+(instancetype)cargroupwithdic:(nsdictionary *)dic
{
return [[self alloc] initwithdict:dic];
}
@end
|
2.4，对应数据的模型类创建好以后，开始创建数组懒加载
代码如下：
?| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 |
#import <foundation/foundation.h>
@interface zkcarmodel : nsobject
//头像
@property(nonatomic,copy)nsstring * icon;
//名字
@property(nonatomic,copy)nsstring *name;
+(instancetype)carwithdict:(nsdictionary *)dic;
-(instancetype)initwithdict:(nsdictionary *)dic;
@end
#import "zkcarmodel.h"
@implementation zkcarmodel
-(instancetype)initwithdict:(nsdictionary *)dic
{
if(self=[super init])
{
[self setvaluesforkeyswithdictionary:dic];
}
return self;
}
+(instancetype)carwithdict:(nsdictionary *)dic
{
return [[self alloc] initwithdict:dic];
}
@end
#import <foundation/foundation.h>
#import "zkcarmodel.h"
@interface zkcargroupmodel : nsobject
//题目
@property(nonatomic,copy)nsstring *title;
@property(nonatomic,strong)nsarray *cars;
+(instancetype)cargroupwithdic:(nsdictionary *)dic;
-(instancetype)initwithdict:(nsdictionary *)dic;
@end
#import "zkcargroupmodel.h"
@implementation zkcargroupmodel
-(instancetype)initwithdict:(nsdictionary *)dic
{
if(self=[super init])
{
self.title=dic[@"title"];
nsmutablearray *array=[nsmutablearray array];
for (nsdictionary *dict in dic[@"cars"]) {
zkcarmodel *car=[zkcarmodel carwithdict:dict];
[array addobject:car];
}
self.cars=array;
}
return self;
}
+(instancetype)cargroupwithdic:(nsdictionary *)dic
{
return [[self alloc] initwithdict:dic];
}
@end
|
2.5，数据加载完以后，然后就要开始写uitable view中相对应的代理方法了
代码如下：
?| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 |
//设置分区
-(nsinteger)numberofsectionsintableview:(uitableview *)tableview
{
return self.cargroups.count;
}
//设置每个分区显示多少行数据
-(nsinteger)tableview:(uitableview *)tableview numberofrowsinsection:(nsinteger)section
{
zkcargroupmodel *model=self.cargroups[section];
return model.cars.count;
}
//每行显示的数据
-(uitableviewcell *)tableview:(uitableview *)tableview cellforrowatindexpath:(nsindexpath *)indexpath
{
static nsstring *id=@"a";
//从缓存中读取cell
uitableviewcell *cell=[tableview dequeuereusablecellwithidentifier:id];
//如果缓存中没有cell，创建一个新的cell
if(cell==nil){
cell=[[uitableviewcell alloc] initwithstyle:uitableviewcellstylesubtitle reuseidentifier:id];
}
//找到当前分区的索引
zkcargroupmodel *groupmodel=self.cargroups[indexpath.section];
//找到当前分区的行
zkcarmodel *carmodel=groupmodel.cars[indexpath.row];
//设置cell显示的文字
cell.textlabel.text=carmodel.name;
//设置cell显示的图片
cell.imageview.image=[uiimage imagenamed:carmodel.icon];
return cell;
}
|
上面3个代理方法是uitable view中最常用的3个方法。写完这3个方法运行xcode就可以看到数据了。
但这里还有些小问题，这里显示的所有品牌都是从上往下排的，没有一个分组，这样我们想找哪个品牌的汽车并不太好找，所以，我们要把同一个数据的汽车品牌加一个字母表示，这怎么做呢，这就要给uitable view的每个分区加一个头了，使用titleforheaderinsection代理方法
代码如下：
?| 1 2 3 4 5 6 7 8 9 |
//设置头样式
-(nsstring *)tableview:(uitableview *)tableview titleforheaderinsection:(nsinteger)section
{
//找到当前分区在数组中的索引
zkcargroupmodel *model=self.cargroups[section];
//返回当前分区的数据中的title
return model.title;
}
|
2.6上面的程序中，在屏幕的最右边还有一个索引，点这个索引就找找到相对应的分区数据，其实这个也很简单，也是调用一个
sectionindextitlesfortableview的代理方法，这个方法返回一个array的数组。
代码如下：
?| 1 2 3 4 5 |
//设置索引
-(nsarray *)sectionindextitlesfortableview:(uitableview *)tableview
{
return [self.cargroups valueforkeypath:@"title"];
}
|
2.7，这个程序中还做了一个，当你点击屏幕上每个汽车品牌的时候还会弹出一个对话框，为什么要做这个呢，因为很多时候屏幕上的图片和文字都是可以点击的，所以光做一个静态显示好不是很好，虽然这个对话框好像并没有什么用，但这里只是讲下这个方法的使用
代码如下：
?| 1 2 3 4 5 6 7 8 9 10 11 12 |
//点击cell时变化
-(void)tableview:(uitableview *)tableview didselectrowatindexpath:(nsindexpath *)indexpath
{
//创建对话框
uialertview *alertview=[[uialertview alloc] initwithtitle:@"汽车" message:@"取消" delegate:self cancelbuttontitle:@"确认" otherbuttontitles:@"取消", nil];
//设置样式
alertview.tag=1;
alertview.alertviewstyle=uitableviewcellstylesubtitle;
//[alertview ];
[alertview show];
}
|
3.1 一个uitableview做的汽车品牌就这样ok了，虽然这并不是一个app但，这里已经把uitableview的一些常用代理方法都写到了，当然uitableview还有很多代表方法，这里并没有讲，但会了这些以后，在以后的使用中我们可以再来查询，重要的是思想。
以上是uitableview 实现汽车品牌的全部内容，希望对大家有所帮助。
如果您对该产品感兴趣，请填写办理（客服微信：xiaoxiongyidong）
发表评论
◎欢迎参与讨论，请在这里发表您的看法、交流您的观点。