iOS学习之Table View的简单使用

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里的实现接口)

[cpp] view plaincopy

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

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

[cpp] view plaincopy

  1. @synthesize list = _list;


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

6、建立数据

[cpp] view plaincopy

  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实例。

[cpp] view plaincopy

  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返回之前添加如下代码

[cpp] view plaincopy

  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

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

[cpp] view plaincopy

  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

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

时间: 2024-10-04 02:43:30

iOS学习之Table View的简单使用的相关文章

IOS学习之table view controller、table view cell

A table view controller, like many objects, has more than one init method. There is: • initWithCoder, for view controllers that are automatically loaded from a storyboard • initWithNibName, for view controllers that you manually want to load from a n

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

今天简述一下简单的内存管理,在IOS5.0以后Apple增加了ARC机制(Automatic Reference Counting),给开发人员带来了不少的方便,但是为了能更好的理解IOS内存管理机制,还是需要对其比较了解. 1.在OC中,每个对象都有一个保留计数,创建时每个对象都有一个初始值为1的保留计数,释放时,保留计数都为0 2.创建自动释放的对象 要求以一个方法创建对象时,以自动释放的形式返回该对象是一个很好的编程实践 +(Car *)car { Car *myCar = [[Car a

IOS中Table View控件练习

之前两篇博客简单学习了Picker view控件的使用,接下来再学习IOS应用中很重要的一个视图--表视图. 在表视图中,每个表视图都是UITableView的一个实例,每个可见行都是UITableViewCell的一个实例. 表视图有两种基本格式,分组的表和普通表,普通表可以实现索引,实现了索引的表成为索引表.(PS.技术上,分组表也可以实现索引,不过好像苹果的设计规范中不支持) 一个简单的表视图应用 界面设计: 向storyboard中拖一个table view控件,他会自动占满屏幕,至于约

ios 官网文档翻译—Create a Table View(swift)

学习IOS中,翻译一下官方文档加深理解顺便提高自己的英文能力.英文很烂,翻译如若有错请谅解. 原文地址 如何创建一个TableView 在这一课中,你要创建FoodTracker(demo app)的主界面.你将创建一个基于table view的显示用户们的食物的列表,并且将完成如下图的自定义table cells来展示用户们的每份食物. 学习目标 在学习完这一劫课程后,你应该会: 创建一个storyboard场景 了解table view的关键组成部分 创建并设计一个自定义table view

iOS开发总结(A0)- make table view more responsive

table view 是ios中非常重要一个view,它的流畅程度非常影响app的体验. 下面总结使table view 运行流畅的一个做法(通过学习wwdc) 1. 异步执行(通常是从网络获取获取,或者打开数据太耗时) 这很好理解,就不详细说明了 2. concurrent draw cell (wwdc中介绍的),这个方面使用了cell内容复杂,耗时 (待续)

iOS开发基础之用三种不同方式创建Table View应用

在iOS中,有一种最常见的控件就是Table View,你也可以理解为是一个列表.在安卓中就是一个ListView.常常用在新闻客户端,邮箱,备忘录等应用上.但是在iOS实现这个列表项比Android更为简单.下面将会使用三种方法来实现一个Table View的界面. (1)模板Master-Detail Application 这是在创建一个iOS应用的时候可以选择的模板,里面已经非常好的集成了Table View控件,已经可以实现增加一项,删除一项,信息显示的功能了.我们可以在这个基础上进行

iOS学习笔记—— UItableView 控件的简单使用

UITableView 可以说是iOS开发中最常用的控件,除了游戏之外,几乎所有的应用中独会出现他的身影. 使用UITableView控件需要遵守两种协议 UITableViewDelegate和 UITableViewDataSource. 常用方法如下: 1.返回(每个分区)表单元个数(行数) - (NSInteger) tableView: (UItableView *) tableVIew numberOfRowsInSection: (NSInteger)section 2.返回表单元

IOS学习02简单动画

IOS学习第二天,今天做一个简单的动画的小程序! 程序截图如下: 1 这个程序,当点击屏幕左下方4个方向按键的时候,上面的图片就会跟着自动上下左右移动. 2 当点击屏幕右边变大和变小按键时候,上面的图片就会跟着变大和变小. 二 功能就说到这里,下面开始界面和代码说明. 2.1 首先还是先创建项目和设计界面,当然还要把相对应的图片导入项目images.xcassets下.截图如下: 2.2 界面图片和方向键,在这里我都是用Button做的,当然,用别的也可以. 2.3 界面上所以可以点击的按键,我

如何创建可扩展表视图中的iOS 学习和拓展优化(有待更新)

首先介绍老外的文章:<How To Create an Expandable Table View in iOS>这是老外用Swift实现 的,对应的老外github项目源码:https://github.com/appcoda/expandable-table-view 小编经过学习了老外的Expandable Table View然后用Objective-C实现了同样的效果,并且进行了很好的升级和封装. 小编的github项目源码:https://github.com/HeYang1234