您的位置:首页 > 产品设计 > UI/UE

IOS--UI--LessonUITableView

2015-07-13 17:23 465 查看
/*

1.UITableView 即 表视图 继承 UIScrollView 因此可以滚动 是 OS 中非常重要的视图 很多应用程序都有用到

2.管理一组数据 通常和 UINavigationController 合用

3.还可以分区(块)显示内容 分区成为 section 行成为row

例子:分区(section),相当于班里的组, 每个分区又有很多行(row),相当于班里的组员

row: 表示 tableView 中某一行的位置,數量會決定 contentSize 的大小 這是系統根據 row的行數 進行分割

4.UITableViewCell 是真正負責顯示出本行內容的 一個新的類 而他最重要的則是 cell 的重用機制

好處:減少內容開銷

*/

1.基本應用

//    1.创建 tableView对象
UITableView *tableView = [[UITableView alloc]initWithFrame:[UIScreen mainScreen].bounds style:UITableViewStylePlain];

//    2.设置属性
//    1>.行高
tableView.rowHeight = 80;
//    2>.分割线颜色
tableView.separatorColor = [UIColor cyanColor];
//    3>.分割线的格式
tableView.separatorStyle = UITableViewCellSeparatorStyleSingleLine;//风格默认就是这样
//分離器的樣式 有三種
tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
//    4>.分割线边距(上左下右 逆时针设置)
tableView.separatorInset =UIEdgeInsetsMake(0, 10, 0, 10);
//5> 定义一个视图 UIView 对象 添加页眉 tableHeaderView  所有内容至上
//表头视图很重要 一般会在这里放置 轮播图
UIView *headView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 320, 50)];
headView .backgroundColor = [UIColor yellowColor];
tableView.tableHeaderView = headView;
[headView release ];
5.1> 如果方式頁眉的圖片
UIImageView *imageView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@“p”]];
imageView.frame = CGRectMake(0,0,320,60);
tableView.tableHeaderView = imageView;
[imageView release];
//当你的 tableView 没有东西的时候页脚和页眉就会重叠在一起
//    表头和表尾 如果表里面没有内容,添加表头和表尾 只会让他俩挨着一起 显示他们自己
//    5>.设置 页脚 默认为空 所有内容之下
UIView *footView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 320, 50)];
footView.backgroundColor = [UIColor redColor];
tableView.tableFooterView = footView;
[footView release];

//表尾如果没有内容 如何将那些没有内容的 Cell 去除
// 快速祛除方式 快速收起没有内容的表
tableView.tableFooterView = [[[UIView alloc]init]autorelease];


2.超級重要的兩個屬性

① SVVIP 数据源代理 :dataSource(提供数据)

② VVIP 业务代理 delegate (真正干活的)

① SVVIP 数据源代理 :dataSource(提供数据)

// 三種方法
@required  必須實現的
//配置tableView 你在这个分区有多少行
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section;
//設置每一個 row上的 cell
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath;
@optional   可選的
//設置 section 數量 你配置几个 就返回几个组
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView;


例:假設 我們有三個分區 第一個分區3行 第二區 4行 第三個區2行 那麼該怎麼寫呢?

//1.首先現在 viewDidLoad 裡面創建 tableView
- (void)viewDidLoad {
[super viewDidLoad];
UITableView *myTable = [[UITableView alloc]initWithFrame:CGRectMake(0, 0, 320, self.view.frame.size.height-40) style:(UITableViewStylePlain)];
[self.view addSubview:myTable];
[myTable release];
//2.設置代理
myTable.dataSource = self;
}
#pragma mark ---------UIDataSource 协议---------
//1.設置幾個分區 默認為1
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
return 3;
}
//2.//row 有多少行  因為每行不一樣 所以要加一個判斷
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
if (section ==0) {
return 2;
}else if (section ==1){
return 3;
}else{
return 5;
}

}
//3.重用 cell
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
//    NSIndexPath 继承 NSObject 用于存储 cell 所在的分区和在分区中的行数
//   如何重用 cell
//1.创建重用 cell 的标志
//    一般放在静态区 创建之后只能被初始化一次 就能使用很多次 并不再初始化
static NSString *indentifier = @"cell";

//    2.创建 cell 对象  这个时候 cell 就有了标志  根据重用标志 取出重用队列中被标志的 cell
UITableViewCell* cell= [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleSubtitle  reuseIdentifier:indentifier];

//3.判断是否成功取到 cell 这个 cell 一定是被标记的
if (!cell) {
//        如果 cell 是空的 就创建一个 cell  也要给一个标志 这个标志要和上面重建 cell 的标志一样
cell= [[[UITableViewCell alloc]initWithStyle:UITableViewCellStyleSubtitle  reuseIdentifier:indentifier ]autorelease];
#warning 这个地方的的 autorelease 的使用 只会在重用池中没有 cell 才会走 所以只会走一次  要记住
}


注:配置 UITableView 還有 section 這個屬性 存在於dataSource的協議中

section 是分區 分組的意思

//section 的頭部 也可以算是頁眉
- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section;
// section 的頁腳
- (NSString *)tableView:(UITableView *)tableView titleForFooterInSection:(NSInteger)section;
- // 類似通訊錄右邊的索引 快速到達想到的分組
-(NSArray *)sectionIndexTitlesForTableView:(UITableView *)tableView;


② VVIP 业务代理 delegate (真正干活的)

在 delegate 裡面 沒有什麼必須要實現的 可以查看API 文档 这里 最主要介绍的就是 cell 的行高

#pragma mark ---------业务代理方法---------
//当 tableView 的某一行 被选中就会走这个方法
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
//创建出下一个视图
DetailViewController *detail = [[DetailViewController alloc]init];

//通过 push 进入下一个页面
[self.navigationController pushViewController:detail animated:YES];
[detail release];

}
//cell 的行高
-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
//如果每个分区不一样呢 行不一样
if (indexPath.section ==0) {
return 40;
}else if (indexPath.section ==1){
if (indexPath.row ==1) {
return 50;
}
return 100;
}
return 200;
}


总结:

/*

1.UITableView 的基本配置 基本上都是通过代理来完成的 代理实现代理方法 给出返回值 tableView根据接收到返回值完成相应的配置

2.代理中的方法名有些只有细微的差别 要看好在做选择

*/

3.Cell 的 图例介绍

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: