Table View简单描述:

在iPhone和其他iOS的很多程序中都会看到Table View的出现,除了一般的表格资料展示之外,设置的属性资料往往也用到Table View,Table View主要分为以下两种:

  • Plain:这是普通的列表风格
  • Grouped :这是分块风格。
 
对于UITableView,我們有一些特殊的概念和术语,比如说我们成Table View的一行为Cell,而许多的Cell可以组成Section,每个Section上下又分別有Header和Footer,许多个的Section则组成了整个Table ,当然Table也有Header和Footer,下面看两种图就能明白这几个拗口名词了:
 
 
现在理论知识了解的差不多了。今天先做一个Plain样式的例子,这样加强对Table view的熟练使用。
 

1、新建项目

新建一个Single View Application,命名为TableViewDemo,开发环境是:Xcode 4.3,iPhone 5.1模拟器。
2、Table View放上控件
打开ViewController.xib文件,往ViewController.xib界面上拖拽一个Table View控件到现有的View上,
对齐。
3、连接新添加的TableView和ViewController。
选中新添的TableView控件,打开连接检查器(Connection Inspector), 找到delegate和datasource并点中圆圈拉线连接到左边File's Owner图标上,为什么要把这两个连接File's Owner上呢?这是因为iOS使用的MVC设计模式,View和ViewController之间的对应关系,需要一个桥梁来进行连接的(即,对于一个视图,他如何知道自己的界面的操作应该由谁来响应),这个桥梁就是File's Owner。
4、打开ViewController.h,添加协议和Property (类似与java里的实现接口)
  1. #import <UIKit/UIKit.h>
  2. @interface ViewController : UIViewController<UITableViewDelegate, UITableViewDataSource>
  3. @property (strong, nonatomic) NSArray *list;
  4. @end

5、打开.m文件,添加:

  1. @synthesize list = _list;


这是发现有两个警告,提示未完成的实现,这提示的是UITableViewDelegate, UITableViewDataSource这个两个头文件里的协议的方法未实现。待会我们去实现它。

6、建立数据
  1. - (void)viewDidLoad
  2. {
  3. [super viewDidLoad];
  4. // Do any additional setup after loading the view, typically from a nib.
  5. NSArray *array = [[NSArray alloc] initWithObjects:@"美国", @"菲律宾",
  6. @"黄岩岛", @"中国", @"泰国", @"越南", @"老挝",
  7. @"日本" , nil];
  8. self.list = array;
  9. }
  10. - (void)viewDidUnload
  11. {
  12. [super viewDidUnload];
  13. // Release any retained subviews of the main view.
  14. self.list = nil;
  15. }

7、生成row

关键的步骤来了,实现tableview添加数据源,返回TableView的行数,返回各行cell实例。
  1. - (UITableViewCell *)tableView:(UITableView *)tableView
  2. cellForRowAtIndexPath:(NSIndexPath *)indexPath {
  3. static NSString *TableSampleIdentifier = @"TableSampleIdentifier";
  4. UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:
  5. TableSampleIdentifier];
  6. if (cell == nil) {
  7. cell = [[UITableViewCell alloc]
  8. initWithStyle:UITableViewCellStyleDefault
  9. reuseIdentifier:TableSampleIdentifier];
  10. }
  11. NSUInteger row = [indexPath row];
  12. cell.textLabel.text = [self.list objectAtIndex:row];
  13. return cell;
  14. }
上面的第二个方法中,
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier: TableSampleIdentifier];
这个语句根据标识符TableSampleIdentifier寻找当前可以重用的UITableViewCell。当某行滑出当前可见区域后,我们重用它所对应的UITableViewCell对象,那么就可以节省内存和资源。
这里UITableViewCellStyleDefault是表示UITableViewCell风格的常数,除此之外,还有其他风格,后面将会用到。
注意参数(NSIndexPath *)indexPath,它将行号row和部分号section合并了,通过[indexPath row];获取行号。之后给cell设置其文本:
cell.textLabel.text = [self.list objectAtIndex: row];
 

8、现在一个简单的TableView就弄好看,运行下看效果

、、
 
9、添加图片。
在项目上add files到项目,提交两张小图片,然后在cell返回之前添加如下代码
  1. NSUInteger row = [indexPath row];
  2. cell.textLabel.text = [self.list objectAtIndex:row];
  3. UIImage *image = [UIImage imageNamed:@"qq"];
  4. cell.imageView.image = image;
  5. UIImage *highLighedImage = [UIImage imageNamed:@"youdao"];
  6. cell.imageView.highlightedImage = highLighedImage;
  7. return cell;

效果如下:

 
 
10、设置行的风格
表示UITableViewCell风格的常量有:

UITableViewCellStyleDefault
UITableViewCellStyleSubtle
UITableViewCellStyleValue1
UITableViewCellStyleValue2

可以自己修改看看效果。可以添加一个detail

cell.detailTextLabel.text =@"打打打打";

return cell;

 
 
11、选择table里的某一行
 
在.m文件@end之前编写  -(void)table  这时会自动提示可以实现的方法,
 
我们选择这个方法

-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath

选中是做个提示,提示选中了那个信息,代码实现如下:

  1. -(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
  2. NSString *rowString = [self.list objectAtIndex:[indexPath row]];
  3. UIAlertView * alter = [[UIAlertView alloc] initWithTitle:@"选中的行信息" message:rowString delegate:self cancelButtonTitle:@"确定" otherButtonTitles:nil, nil];
  4. [alter show];
  5. }

效果:

 
以上是Plain风格的TableView
 
 
 

 

简介:上篇做了Table View的一些介绍 ,还做了一个TableView 的Plain样式的例子,这篇我们学习Grouped样式表的例子,还有用到前面读取Plist的知识(见iOS学习之 plist文件的读写),把Plist文件中的数据读取出来,放到Table view里展示出来。这里把全国30多个省份的城市,都列出来了,plist文件里还有城市的行政区,不过这里只列出省份和城市就ok了。效果图如下:

那么开始吧。

1、新建项目

新的一个名称为TableViewGrouped的Single View Application项目,打开项目的xib文件,拖拽TableView控件到xib文件中,摆正位置。

2、给新建的TableView找到他的归属

选中新添的TableView ,Connection Inspector,找到delegate和datasource,从它们右边的圆圈拉线到Files Owner图标上,参考上篇的第3步:

3、设置Table View的属性为Grouped样式

 

4、导入plist文件

从其他文件夹导入Provineces.plist文件,这个文件我会传到源代码里,大家都能方便使用了,包括全国30个省份和城市,还有城市的区也有。

 

5、添加.h .m的实现代码。

.h文件添加一个property

  1. #import <UIKit/UIKit.h>
  2. @interface ViewController : UIViewController
  3. @property (strong, nonatomic) NSArray *provinces;
  4. @end

第一步从Plist读取出数据,第二步给Table添加数据。

在viewDidLoad读取Plist,plist是个array类型的,所以使用Array读取。

.m文件的实现。

  1. @implementation ViewController
  2. @synthesize provinces;
  3. - (void)viewDidLoad
  4. {
  5. [super viewDidLoad];
  6. // Do any additional setup after loading the view, typically from a nib.
  7. NSBundle *bundle = [NSBundle mainBundle];
  8. NSString *plistPath = [bundle pathForResource:@"Provineces" ofType:@"plist"];
  9. NSMutableArray *array=[[NSMutableArray  alloc] initWithContentsOfFile:plistPath];
  10. self.provinces = array;
  11. }
 

实现TableView表格部分,下面这些方法看方法名就能大概明白意思。

  • 这个方法用来告诉表格有几个分组
  1. - (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
  2. return [provinces count];
  3. }
  • 这个方法告诉表格第section个分段有多少行
  1. - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
  2. NSArray *cities = [[provinces objectAtIndex:section]objectForKey:@"Citys"];
  3. return [cities count];
  4. }
  • 这个方法用来告诉某个分组的某一行是什么数据,返回一个UITableViewCell
  1. - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
  2. NSUInteger section = [indexPath section];
  3. NSUInteger row = [indexPath row];
  4. NSArray *cities = [[provinces objectAtIndex:section]objectForKey:@"Citys"] ;
  5. static NSString *GroupedTableIdentifier = @"cell";
  6. UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:
  7. GroupedTableIdentifier];
  8. if (cell == nil) {
  9. cell = [[UITableViewCell alloc]
  10. initWithStyle:UITableViewCellStyleDefault
  11. reuseIdentifier:GroupedTableIdentifier];
  12. }
  13. //给Label附上城市名称  key 为:C_Name
  14. cell.textLabel.text = [[cities objectAtIndex:row] objectForKey:@"C_Name"];
  15. return cell;
  16. }
  • 这个方法用来告诉表格第section分组的名称
  1. - (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section {
  2. NSString *provincName = [[provinces objectAtIndex:section] objectForKey:@"p_Name"];
  3. return provincName;
  4. }
  • 重点介绍下这个方法:
  1. - (NSArray *)sectionIndexTitlesForTableView:(UITableView *)tableView {
  2. //返回省份的数组
  3. NSMutableArray *array = [NSMutableArray arrayWithCapacity:35];
  4. for (NSDictionary *dict in provinces) {
  5. [array addObject:[dict objectForKey:@"p_Name"]];
  6. }
  7. return array;
  8. }

返回所有省份名称的数组 ,通过点击右边的省份名称能快速定位到这个省份的城市,也就是快速定位到这个section。

OK,运行。效果如下:

试试改成plain样式的分段TableView看看:

以上例子的全部

例子的代码:http://download.csdn.net/detail/totogo2010/4361876

https://github.com/schelling/YcDemo/tree/master/TableViewGrouped

***iOS学习之Table View的简单使用和DEMO示例(共Plain普通+Grouped分组两种)的更多相关文章

  1. iOS学习之Table View的简单使用

    Table View简单描述: 在iPhone和其他iOS的很多程序中都会看到Table View的出现,除了一般的表格资料展示之外,设置的属性资料往往也用到Table View,Table View ...

  2. IOS学习笔记3—Objective C—简单的内存管理

    今天简述一下简单的内存管理,在IOS5.0以后Apple增加了ARC机制(Automatic Reference Counting),给开发人员带来了不少的方便,但是为了能更好的理解IOS内存管理机制 ...

  3. 【iOS开发-56】案例BUG:button的enabled、控件的userInteractionEnabled以及两种提示框UIAlert和UIActionSheet

    接上述案例找BUG:[iOS开发-51]案例学习:动画新写法.删除子视图.视图顺序.延迟方法.button多功能使用方法及icon图标和启动页设置 (1)BUG:答案满了就不能再点击optionbut ...

  4. iOS学习之UITableView中Cell的操作

    接着iOS学习之Table View的简单使用 这篇,这里主要讲UITableView 中的Cell的操作,包括标记.移动.删除.插入. 为了简单快捷,直接从原来那篇的代码开始,代码下载地址:http ...

  5. Table View Programming Guide for iOS---(五)---Creating and Configuring a Table View

    Creating and Configuring a Table View Your app must present a table view to users before it can mana ...

  6. Table View Programming Guide for iOS---(一)---About Table Views in iOS Apps

    About Table Views in iOS Apps Table views are versatile user interface objects frequently found in i ...

  7. Table View Programming Guide for iOS---(二)----Table View Styles and Accessory Views

    Table View Styles and Accessory Views 表格视图的风格以及辅助视图 Table views come in distinctive styles that are ...

  8. 在iOS中怎样创建可展开的Table View?(上)

    原文地址 本文作者:gabriel theodoropoulos 原文:How To Create an Expandable Table View in iOS 原文链接 几乎所有的app都有一个共 ...

  9. iOS 利用长按手势移动 Table View Cells

    本文译自:Cookbook: Moving Table View Cells with a Long Press Gesture 目录: 你需要什么? 如何做? 如何将其利用至UICollection ...

随机推荐

  1. Jenkins+Ant+Jmeter搭建轻量级接口自动化

    软件准备 本文所用软件版本如下: Jenkins2.176.1 Tomcat9.0.21 Ant1.9.14 Jmeter5.1.1 我已经把相应的软件上传到我的网盘中,下载地址如下: 下载链接:ht ...

  2. javascript中 if(变量)和if(变量==true)的区别

    if(判断表达式){执行内容} 如果判断表达式为true,则执行括号中的内容.这里,变量如果不为0,null,undefined,false,都会被处理为true.只要变量有非0的值或是某个对象,数组 ...

  3. 洛谷 P2788 数学1(math1)- 加减算式

    题目背景 蒟蒻HansBug在数学考场上,挠了无数次的头,可脑子里还是一片空白. 题目描述 好不容易啊,HansBug终于熬到了做到数学最后一题的时刻了,眼前是一堆杂乱的加减算式.显然成功就在眼前了. ...

  4. 使用JavaScript将当前页面保存成PDF,支持图片和文字的保存

    前端开发的朋友们可能会遇到这个需求:将您负责开发的网页的全部内容,包括文字和图片,一起保存成一个PDF文件.如果采用屏幕截图的话,默认Windows操作系统的截图按钮无法完整截取超过一屏幕的屏幕内容. ...

  5. SQLite_Home

    SQLite教程 SQLite是一个库,实现了一个独立的软件,serverless zero-configuration.事务SQL数据库引擎.SQLite是世界上最广泛的部署SQL数据库引擎.SQL ...

  6. (转)编码剖析@Resource注解的实现原理

    http://blog.csdn.net/yerenyuan_pku/article/details/52860046 上文我们已经学会使用@Resource注解注入属性.学是学会了,但也仅限于会使用 ...

  7. Android接入支付宝和微信支付

    然后把下载下来的aar包,放到项目目录下面的libs目录下,通过下面的gradle依赖进来 // 支付宝 SDK AAR 包所需的配置compile(name: 'alipaySdk-15.6.0-2 ...

  8. tcp 三次握手四次挥手

    1.三次握手 置位概念:根据TCP的包头字段,存在3个重要的标识ACK.SYN.FIN ACK:表示验证字段 SYN:位数置1,表示建立TCP连接 FIN:位数置1,表示断开TCP连接 三次握手过程说 ...

  9. dropuser - 删除一个 PostgreSQL 用户帐户

    SYNOPSIS dropuser [ option...] [ username] DESCRIPTION 描述 dropuser 删除一个现有 PostgreSQL 用户 和 该用户所有的数据库. ...

  10. js 数组元素排序?

    Part.1  sort 方法 js 有自带排序方法 sort(),  默认 升序 排列 如: data() { return { arr: [1,3,2,5,6,8,7,4,9] } }, 控制台如 ...