UITableView表视图控件

来源:互联网 发布:match sql语句 编辑:程序博客网 时间:2024/04/30 01:11
最简单的表视图——》自定义Cell表——》可编辑表——》可动态移动表
以下是配合Navigation导航条控件演示的tableView各种实现。
一:基础表视图
我们看下表视图一个大致的界面模型
首先是navc的顶级视图
1336118680_8500.png 

这个视图控制器的代码基本很前面提到的导航那章一样,只是多了一个数组容器来保存要显示的三个二级视图控制器
看下m文件
  1. //
  2. // NonoFirstLevelViewController.m
  3. // NavTest
  4. //
  5. // Created by Nono on 12-4-26.
  6. // Copyright (c) 2012年 NonoWithLilith. All rights reserved.
  7. //

  8. #import "NonoFirstLevelViewController.h"
  9. #import "NonoSecondLevelViewController.h"
  10. #import "SimpleTableViewController.h"
  11. #import "CustomCellViewController.h"
  12. #import "EditViewController.h"
  13. @interface NonoFirstLevelViewController ()

  14. @end

  15. @implementation NonoFirstLevelViewController
  16. @synthesize controllers = _controllers;
  17. #pragma 实现头文件中自定义方法;
  18. - (void)initAllSecondControllers:(NSMutableArray *)array
  19. {
  20. SimpleTableViewController *controller1 = [[SimpleTableViewController alloc] init];
  21. [controller1 setTitle:@"简单表视图"];
  22. [array addObject:controller1];
  23. [controller1 release];

  24. CustomCellViewController *controller2 = [[CustomCellViewController alloc] init];
  25. [controller2 setTitle:@"自定义cell视图"];
  26. [array addObject:controller2];
  27. [controller2 release];


  28. EditViewController *controller3 = [[EditViewController alloc] init];
  29. [controller3 setTitle:@"可编辑视图"];
  30. [array addObject:controller3];
  31. [controller3 release];
  32. }

  33. - (id)initWithStyle:(UITableViewStyle)style
  34. {
  35. self = [super initWithStyle:style];
  36. if (self) {
  37. }
  38. return self;
  39. }

  40. - (void)viewDidLoad
  41. {
  42. [super viewDidLoad];
  43. self.title = @"表视图Demo";
  44. //实例化一个可变数组
  45. NSMutableArray *array = [[NSMutableArray alloc] init ];//
  46. self.controllers = array;
  47. [array release];
  48. [self initAllSecondControllers:self.controllers];
  49. }

  50. - (void)viewDidUnload
  51. {
  52. [super viewDidUnload];
  53. }

  54. - (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
  55. {
  56. return (interfaceOrientation == UIInterfaceOrientationPortrait);
  57. }

  58. #pragma mark - Table view data source
  59. - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
  60. {
  61. return [self.controllers count];
  62. }

  63. - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
  64. {
  65. static NSString *CellIdentifier = @"FirstLevelCell";
  66. UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
  67. if (cell == nil) {
  68. cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];
  69. }
  70. NSUInteger row = [indexPath row];
  71. NonoSecondLevelViewController *controller = [self.controllers objectAtIndex:row];
  72. cell.textLabel.text = [controller title];
  73. return cell;
  74. }

  75. #pragma mark - Table view delegate
  76. - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
  77. {
  78. NSUInteger row = [indexPath row];
  79. NonoSecondLevelViewController *secondVC = [self.controllers objectAtIndex:row];
  80. [self.navigationController pushViewController:secondVC animated:YES];

  81. }

  82. @end
复制代码

顶视图类基本就是一个导航作用。 
线面我么先看最简单的这条目

简单表视图:

1336119482_1811.png


  1. - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
  2. {
  3. //控件复用
  4. static NSString *CellIdentifier = @"simpleCell";
  5. UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
  6. if (cell == nil) {
  7. cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];

  8. }
  9. NSUInteger row = [indexPath row];
  10. NSString *string = [self.data objectAtIndex:row];
  11. cell.textLabel.text = string;

  12. //这个可以定义item右端小图标显示风格,默认是none;
  13. //cell.accessoryType = UITableViewCellAccessoryDetailDisclosureButton;
  14. [string release];
  15. return cell;
  16. }
复制代码


这边主要说如下几点:


1》。控件得复用,这个和Android很像,因此我们在获取cell对象时,先从原来得复用队列里查找(更具指定的标记,这点也告诉我们,我们可以设置多个标记),

若没有,那就新建一个

2》。整个tableview的style分两种,一种就是顶级视图界面的那种: self.tableView.style = UITableViewStylePlain,另一种就是这个视图的风格:

self.tableView.style = UITableViewStyleGrouped

3》.对于每个item,单元格样式使用了3个不同的单元格元素。依次左边开始有个图标,中间就是一个label,右侧会有一个详情栏。

4》。同样的对于每个cell也是有样式风格的 cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier]

针对3,4设置后得某种效果如下:

1336123541_1759.png


左端可以自己敬爱个图标进去,黑体字就是文本label,灰色的是详细文本标签,小箭头图标是accessoryType

以下就是代码

  1. static NSString *CellIdentifier = @"FirstLevelCell";
  2. UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
  3. if (cell == nil) {
  4. cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:CellIdentifier] autorelease];
  5. }
  6. NSUInteger row = [indexPath row];
  7. NonoSecondLevelViewController *controller = [self.controllers objectAtIndex:row];
  8. cell.textLabel.text = [controller title];
  9. cell.detailTextLabel.text = @"什么情况";
  10. //这个可以定义item右端小图标显示风格,默认是none;
  11. cell.accessoryType = UITableViewCellAccessoryDetailDisclosureButton;
  12. return cell;
复制代码


默认风格的cell是不能显示详情标签内容的。 

其实很多效果,代码都走一边就看出来了,具体就自己改动下代码就ok了

二:自定义的Cell

1336124146_1716.png



自定义的cell,xib实现

1336124287_5901.png



基本没什么好说的,看下该类额控制器文件

  1. //
  2. // CustomCellViewController.m
  3. // NavTest
  4. //
  5. // Created by Nono on 12-5-4.
  6. // Copyright (c) 2012年 NonoWithLilith. All rights reserved.
  7. //

  8. #import "CustomCellViewController.h"

  9. @interface CustomCellViewController ()

  10. @end
  11. @implementation CustomCellViewController
  12. @synthesize customCell = _customCell;
  13. - (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil
  14. {
  15. self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
  16. if (self) {
  17. // Custom initialization
  18. }
  19. return self;
  20. }

  21. - (void)viewDidLoad
  22. {
  23. [super viewDidLoad];
  24. NSMutableArray *array = [[NSMutableArray alloc] initWithObjects:@"陈凯",@"Nono",@"Lilith",@"窗前明月光",@"疑是地上霜",@"举头望明月",@"低头思故乡",@"锄禾日当午",@"汗滴禾下土",@"谁知盘中餐",@"粒粒皆幸苦",nil];
  25. self.data = array;
  26. [array release];
  27. // Do any additional setup after loading the view from its nib.
  28. }

  29. - (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
  30. {
  31. return (interfaceOrientation == UIInterfaceOrientationPortrait);
  32. }


  33. #pragma mark_
  34. #pragma 数据源方法
  35. - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
  36. {
  37. return [self.data count];

  38. }

  39. // Row display. Implementers should *always* try to reuse cells by setting each cell's reuseIdentifier and querying for available reusable cells with dequeueReusableCellWithIdentifier:
  40. // Cell gets various attributes set automatically based on table (separators) and data source (accessory views, editing controls)

  41. - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
  42. {

  43. static NSString *CellIdentifier = @"CustomCell";
  44. UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
  45. if (cell == nil) {
  46. NSArray *nib = [[NSBundle mainBundle] loadNibNamed:@"CustomCell" owner:self options:nil];
  47. if([nib count] > 0){
  48. cell = self.customCell;
  49. cell.backgroundColor = [UIColor redColor];
  50. }else{
  51. NSLog(@"加载 nib文件失败");
  52. }

  53. }
  54. NSUInteger row = [indexPath row];
  55. NSString *string = [self.data objectAtIndex:row];
  56. UILabel *customlabel =(UILabel*) [cell viewWithTag:11];
  57. customlabel.text = string;
  58. [string release];
  59. return cell;
  60. }
  61. @end
复制代码


提几个注意点: 

1》。cell的xib文件得拥有者设置成该类,在该类得头文件中定义一个输出口。


2》 我们看到cell的xib文件有3个label视图我们能看到,其实还有一个没有title的label视图,也就我们要动态添加数据的那个视图,

在xib文件中需要给他设置一个tag,这样我们在代码里才能根据tag找出该对象(和Android中得id很像)。这边我定义了11,所以

  1. UILabel *customlabel =(UILabel*) [cellviewWithTag:11];
  2.     customlabel.text = string;
复制代码


3》。xib文件加载,我是根据书上得列子方法。根据应用的束来获取。

4》。哦,还有点就是 static NSString *CellIdentifier = @"CustomCell";。这个在xib文件得指定器中定义,因为原本我们新建一个cell是有个传入指定标签,
而现在这个新建一个cell说白了就是直接从xib中加载一个实例化了,那么指定器怎需要在xib中定义下。
对于cell简单的自定义就是这样。

三:可编辑的tableView(删除,添加,移动)

1336125503_8541.png 
  1. //
  2. //  EditViewController.m
  3. //  NavTest
  4. //
  5. //  Created by Nono on 12-5-4.
  6. //  Copyright (c) 2012年 NonoWithLilith. All rights reserved.
  7. //
  8. #import "EditViewController.h"
  9. @interface EditViewController ()
  10. @end
  11. @implementation EditViewController
  12. @synthesize edittableView;
  13. - (void)editButtonPressed:(id)sender
  14. {   
  15.     [self.edittableView setEditing:!self.edittableView.editing animated:(YES)];
  16.     if (edittableView.editing) {
  17.         [self.navigationItem.rightBarButtonItem setTitle:@"完成"];
  18.     }else {
  19.         [self.navigationItem.rightBarButtonItem setTitle:@"编辑"];
  20.     };
  21.     NSLog(@"点击了按钮");
  22. }
  23. - (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil
  24. {
  25.     self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
  26.     if (self) {
  27.         // Custom initialization
  28.     }
  29.     return self;
  30. }
  31. - (void)viewDidLoad
  32. {
  33.     [super viewDidLoad];
  34.     NSMutableArray *array = [[NSMutableArray alloc] initWithObjects:@"陈凯",@"Nono",@"Lilith",@"窗前明月光",@"疑是地上霜",@"举头望明月",@"低头思故乡",@"锄禾日当午",@"汗滴禾下土",@"谁知盘中餐",@"粒粒皆幸苦",nil];
  35.     self.data = array;
  36.     [array release];
  37.     UIBarButtonItem *rigthButton = [[UIBarButtonItem alloc]  initWithTitle:@"编辑"  style:UIBarButtonItemStyleBordered  target:self  action:@selector(editButtonPressed:)];
  38.     self.navigationItem.rightBarButtonItem = rigthButton;
  39.     //self.navigationItem.prompt = @"加载";
  40.     [rigthButton release]; 
  41.     // Do any additional setup after loading the view from its nib.
  42. }
  43. - (void)viewDidUnload
  44. {
  45.     [super viewDidUnload];
  46.     // Release any retained subviews of the main view.
  47.     // e.g. self.myOutlet = nil;
  48. }
  49. - (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
  50. {
  51.     return (interfaceOrientation == UIInterfaceOrientationPortrait);
  52. }
  53. #pragma mark - Table view data source
  54. - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
  55. {
  56.     // Return the number of rows in the section.
  57.     return [self.data count];
  58. }
  59. - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
  60. {
  61.     static NSString *CellIdentifier = @"editLevelCell";
  62.     UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
  63.     if (cell == nil) {
  64.         cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];
  65.     }
  66.     NSUInteger row = [indexPath row];
  67.     NSString *string = [self.data objectAtIndex:row];
  68.     cell.textLabel.text = string;
  69.     [string release];
  70.     return cell;
  71. }
  72. #pragma 实现数据源协议中一些关于编辑操作方法
  73. - (BOOL)tableView:(UITableView *)tableView canEditRowAtIndexPath:(NSIndexPath *)indexPath
  74. {
  75.     //是否可以编辑,即是tableView setEditing的前提;默认是yes,实现这个方法估计主要是选择性的编辑条目。
  76.     return YES;
  77. }
  78. - (BOOL)tableView:(UITableView *)tableView canMoveRowAtIndexPath:(NSIndexPath *)indexPath
  79. {
  80.     //同理默认其实就是yes,移动模式(会显示可以触摸得移动button)必须是在实现了下面这个方法才有效,否则及时yes了,移动模式条也是不显示的,简单的说,你不能执行移动操作
  81.     return YES;
  82. }
  83. //移动操作
  84. - (void)tableView:(UITableView *)tableView moveRowAtIndexPath:(NSIndexPath *)sourceIndexPath toIndexPath:(NSIndexPath *)destinationIndexPath
  85. {
  86.     //拖动得思路就是先备份选中行,删除原来那份,将备份的一份插入到目标行
  87.     NSUInteger fromRow = [sourceIndexPath row];
  88.     NSUInteger toRow = [destinationIndexPath row];
  89.     id ob = [[self.data objectAtIndex:fromRow] retain];
  90.     [self.data removeObjectAtIndex:fromRow];
  91.     [self.data insertObject:ob atIndex:toRow];
  92.     [ob release];
  93. }
  94. - (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath
  95. {
  96.       NSUInteger row = [indexPath row];
  97.     //提交操作完的编辑
  98.     if (editingStyle == UITableViewCellEditingStyleDelete) {
  99.         [self.data removeObjectAtIndex:row]; //删除操作
  100.         [tableView deleteRowsAtIndexPaths:[NSArray arrayWithObject:indexPath] withRowAnimation:UITableViewRowAnimationFade];
  101.     }
  102.     
  103.     if (editingStyle == UITableViewCellEditingStyleInsert) {
  104.         [self.data insertObject:@"插入数据" atIndex:row];//插入操作
  105.         [tableView insertRowsAtIndexPaths:[NSArray arrayWithObject:indexPath] withRowAnimation:UITableViewRowAnimationLeft];
  106.     } 
  107. }
  108. #pragma 实现tableView委托中一些方法
  109. - (UITableViewCellEditingStyle)tableView:(UITableView *)tableView editingStyleForRowAtIndexPath:(NSIndexPath *)indexPath;
  110. {
  111.     //设置可编辑得样式:系统提供了三种,一种是删除,一种是插入,一种时是none
  112.     NSInteger row = [indexPath row];
  113.     if(row %2 == 0)//这边做了小处理,间隔显示删除和插入
  114.     {
  115.         return UITableViewCellEditingStyleDelete;
  116.     }
  117.     return UITableViewCellEditingStyleInsert;
  118. }
  119. @end
复制代码

基本代码如上。 

0 0