IOS基础学习日志（五）简单的表格及表视图

                                                         IOS基础学习日志（五）

    今天我们主要学习了IOS相关的一些简单的表格及表视图相关属性、定义和声明,如下便是我们今天所学内容。

本章要点：

1、表视图简介

2、实现一个简单的表

3、分组表和索引

4、其他控件

 

1、表格视图简介：

-表格视图是用于向用户显示数据列表的一种最常见的机制，数据列表中的每项都用行表示。

-表格视图是显示表数据的视图对象，它是UITableView类的一个实例。表中的每个可见行都由UITableViewCell类实现。

-表视图并不负责存储表中的数据，它们只存储足够绘制当前可见行的数据。

-表格视图从遵循UITableViewDelegate协议的对象获取配置数据，从遵循UITableViewDataSource协议的对象获取行数据。

 2、分组表与无格式表

-分组表中的每个组都由嵌入在圆角矩形中的多个行组成。注意，一个分组表可以只包含一个组。

-无格式表是默认的样式，任何没有圆角矩形属性的表都是无格式表视图。

-一个带有索引的无格式表，表中的每个部分被称为数据源中的分区(section)。在索引表中每个分区对应一个索引条目。

设计视图

-在xib文件中设计表格视图。在IB中调出控件库，找到Table View，并将它拖到View窗口即可。

-将表视图拖到View窗口上之后，通过单击操作来选定它，然后打开连接检查器，可以看到表视图的前两个可以连接是数据源和委托。从每个连接旁边的圆圈拖到File’s Owner图标。

编写控制器

-可以通过两种方法创建表格视图：

继承UIViewController,并且实现UITableViewDelegate和UITableViewDataSource协议

继承UITableViewController

用数组存储表格的数据

#import<UIKit/UIKit.h>

@interface SimpleTableViewController:UIViewController<UITableViewDelegate,UITableViewDataSource>

//用于存储表格的数据

@property (nonatomic, retain) NSArray *listData;

@end

要实现协议中的方法

-UITableViewDataSource协议中的方法:

//必须实现的方法:

//该方法的作用分区中共有多少行

(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section:

//该方法的作用是创建每一行UITableViewCell

(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath;

//选择实现的方法

//该方法的功能是设置该表格有几个分区

(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView;

要实现协议中的方法

-UITableViewDelegate协议中的主要方法:

//选择实现的方法:

//当表格单元被选中时调用的方法

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

//设置分组组名的显示信息

(NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section;

要实现协议中的方法

(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath;

应该注意的一些问题：

//当表格单元被选中时调用的方法

(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

{

static NSString *SimpleTableIdentifier = @“SimpleTableIdentifier”;

UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:SimpleTableIdentifier];

if (cell == nil)

{

//实现每一行的偏移

cell = [[[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:SimpleTableIdentifier]autorelease];

}

//row行数只能大于零，根据索引获取当前行数

NSUInteger row = [indexPath row];

//首先找到你当前行的标签的内容，然后改一下，根据数组里面的对应的行数取下标，能够保证每次取得不是同一个数据

cell.textLabel.text = [listData objectAtIndex:row];

return cell;

}

要获取正确的值，需要知道表视图需要显示哪些行。我们使用表的行数从数组获取相应的字符串，将它分配给单元的textLabel.text属性，获取行号代码如下：

//indexPath为函数的参数，row用来存放行号

NSUInteger row = [indexPath row];

//从数组中通过行号得到信息

cell.textLabel.text = [listData objectAtIndex:row];

为表格添加图像

在tableView:cellForRowAtIndexPath:方法中添加以下代码:

(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

{

static NSString *SimpleTableIdentifier = @“SimpleTableIdentifier”;

UITableViewCell * cell = [tableView dequeueReusableCellWithIdentifier:SimpleTableIdentifier];

if (cell == nil)

{

cell = [[[UITableViewCell alloc]initWithFrame:CGRrctZero reuseIdentifier:SimpleTableIdentifier]autorelease];

}

UIImage *image = [UIImage imageNamed:@“test.png”];

cell.imageView.image = image;

NSUInteger row = [indexPath row];

cell.textLabel.text = [listData objectAtIndex:row];

return cell;

}

点击表格更换图像

在tableView:cellForRowAtIndexPath:方法中添加以下代码:

//点击表格更换图像

UIImage *image = [UIImage imageNamed:@“test.png”];

UIImage *image2 = [UIImage imageNamed:@“test.png”];

//正常显示的表格图片

cell.imageView.image = image;

//点击 之后变换图片

cell.imageView.highlightedImage = image2;

更改单元格式

单元式样使用3种不同的单元元素:

图像：如果指定样式中包含图像，那么该图像将显示在单元文本左侧。

文本标签： 这是单元的主要文本。在我们之前使用的样式UITableViewCellStyleDefault中，文本标签是唯一在单元中显示的文本。

详细文本标签：这是单元的辅助文本，通常用作解释性的说明或标签。

将单元格格式UITableViewCellStyleDefault更改为UITableViewCellStyleSubtitle,两个文本元素都会显示。

3、相关代码:

1、在AppDelegate.h文件中

#import <UIKit/UIKit.h>

@class RootViewController;

@interface AppDelegate : UIResponder <UIApplicationDelegate>

@property (strong, nonatomic) UIWindow *window;

@property (retain, nonatomic) RootViewController *mRootVC;

@end

2、在AppDelegate.m文件中

#import "AppDelegate.h"

#import "RootViewController.h"

@implementation AppDelegate

- (void)dealloc

{

    [_window release];

    [_mRootVC release];

    [super dealloc];

}

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions

{

    self.window = [[[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]] autorelease];

    self.window.backgroundColor = [UIColor whiteColor];

    

    RootViewController *pRootVC = [[RootViewController alloc]initWithNibName:nil bundle:nil];

    self.mRootVC = pRootVC;

    [pRootVC release];

    

    self.window.rootViewController = self.mRootVC;

    

    [self.window makeKeyAndVisible];

    return YES;

}

- (void)applicationWillResignActive:(UIApplication *)application

{

}

- (void)applicationDidEnterBackground:(UIApplication *)application

{

}

- (void)applicationWillEnterForeground:(UIApplication *)application

{

}

- (void)applicationDidBecomeActive:(UIApplication *)application

{

}

- (void)applicationWillTerminate:(UIApplication *)application

{

}

@end

3、在RootViewController.h文件中

#import <UIKit/UIKit.h>

@interface RootViewController : UIViewController

<UITableViewDataSource,UITableViewDelegate,UIActionSheetDelegate>

@property (retain, nonatomic) UITableView *mTableView;

//存储表中的数据

@property (retain, nonatomic) NSArray *mArr;

@end

4、在RootViewController.m文件中

#import "RootViewController.h"

@interface RootViewController ()

@end

@implementation RootViewController

- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil

{

    self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];

    if (self) {

        // Custom initialization

    }

    return self;

}

- (void)viewDidLoad

{

    self.mArr = [UIFont familyNames];

    [super viewDidLoad];

    //创建初始化表视图

    self.mTableView = [[UITableView alloc]initWithFrame:self.view.frame style:UITableViewStylePlain];

    

    //设置表头的区域

    UIView *pView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 320, 50)];

    //设置表头的颜色

    pView.backgroundColor = [UIColor blueColor];

    //表头

    self.mTableView.tableHeaderView = pView;

    //表尾

    self.mTableView.tableFooterView = pView;

    //设置页眉高度

    

    self.mTableView.sectionHeaderHeight = 50;

    //设置委托对象

    self.mTableView.dataSource = self;

    self.mTableView.delegate = self;

    //添加到视图当中

    [self.view addSubview:self.mTableView];

}

#pragma mark-------------tableView DataSource-----

//每个分段中的行数

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section

{

    return [self.mArr count];

}

//每行的绘制

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

{

    static NSString *identifer = @"identifer";

    UITableViewCell *pCell = [tableView dequeueReusableCellWithIdentifier:identifer];

    

    if (nil == pCell)

    {

        pCell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:identifer];

    }

    //获取当前行

    NSUInteger cellRow = [indexPath row];

    //根据行数找到数组中对应下标的数据

    NSString *pTempStr = [self.mArr objectAtIndex:cellRow];

    //设置文本内容

    pCell.textLabel.text = pTempStr;

    //设置文本字体

    pCell.textLabel.font = [UIFont fontWithName:pTempStr size:18];

    

    pCell.detailTextLabel.text = @"detailText";

    pCell.imageView.image = [UIImage imageNamed:@"1.png"];

    pCell.accessoryType = UITableViewCellAccessoryCheckmark;

    return pCell;

}

//设置页眉

- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section

{

    return @"I'm Header_Title";

}

//设置表尾

- (NSString *)tableView:(UITableView *)tableView titleForFooterInSection:(NSInteger)section

{

    return @"I'm Footer_Title";

}

#pragma mark ----------------------table delegate---------------

//选中某一行会调用

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

{

    NSUInteger row = [indexPath row];

    NSString *pStr = [NSString stringWithFormat:@"你选中了第%d行", row];

    //模态视图

    UIActionSheet *pActionSheet = [[UIActionSheet alloc]initWithTitle:@"ActionSheet" delegate:self cancelButtonTitle:@"确认" destructiveButtonTitle:pStr otherButtonTitles:nil, nil];

    

    [pActionSheet showInView:self.view];

    //选中行逐渐淡出

    [self.mTableView deselectRowAtIndexPath:indexPath animated:YES];

}

//调整每一行的高度

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath

{

    return 44;

}

//调整header高度

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section

{

    return 20;

}

//对行内容进行偏移

- (NSInteger)tableView:(UITableView *)tableView indentationLevelForRowAtIndexPath:(NSIndexPath *)indexPath

{

    return [indexPath row];

}

#pragma mark -------------------actionSheet delegate----------

- (void)actionSheet:(UIActionSheet *)actionSheet clickedButtonAtIndex:(NSInteger)buttonIndex

{

    switch (buttonIndex) {

        case 0:

            NSLog(@"case 0");

            break;

        case 1:

            NSLog(@"case 1");

            break;

        default:

            break;

    }

}

- (void)didReceiveMemoryWarning

{

    [super didReceiveMemoryWarning];

    // Dispose of any resources that can be recreated.

}

- (void)dealloc

{

    [_mTableView release];

    [_mArr release];

    [super dealloc];

}

@end