IOS表视图(一)


在IOS中表视图是每个APP中都必须使用到的视图。
在IOS系统本身有一些应用采用表视图,例:通讯录(采用plain模式的表视图),系统设置界面(采用group模式的表视图),
使用表视图制作相关应用时,可以使我们的数据看起来更整齐,更有条理。



一、表视图组成

表视图由 表头视图(table header view) 表脚视图(table foot view) 节(section) 节头(section header) 节脚(section footer) 单元格(cell)组成
如下图所示:
UITableView

二、表视图涉及类

表视图(UITableView)继承类(UIScrollView),它拥有两个协议:UITableViewDelegate 委托协议 UITableViewDataSource数据源协议。
此外UITableView还包含其它类 UITableViewCell(单元格类) UITableViewControl(控制器类) UITableViewHeaderFooterView类分别用于UITableView的表头和表尾视图加载。

三、表视图的分类

在IOS中表视图的分类,主要根据视图的呈现形式进行分类。
3.1 普通表视图(plain),主要应用于动态表,单元格数目未知的情况下使用。
3.2 分组表视图(group),常用于应用于已知单元格数据的界面布局。
如下图所示:(下图是从IOS系统中选取的两种列表的模式)
UITableView-plain
图3.1 plain
UITableView-group
图3.2 group


四、单元格的组成和样式

系统默认单元格样式如下图所示:
UITableView-cell系统格式
在IOS中,单元格有很多种系统默认样式可以进行选择,如果系统提供的样式还是无法满足当前用户的需求,那么还可以通过自定义单元格的方式来设置单元格。

系统常见的单元格样式:

UITableViewCellStyleDefault 默认样式 只有图标和主标题
UITableViewCellStyleSubTitle 带有副标题的样式,(图标 主标题 副标题)模式
UITableViewCellStyleValue1 无图标 带用主标题(主标题着重显示)和副标题
UITableViewCellStyleValue2 无图标 带用主标题和副标题


系统单元格中扩展视图样式:

UITableViewCellAccessoryNone 没有扩展图标
UITableViewCellAccessoryDisclosureIndicator 将有一个扩展图标 “>”,指向下一级表视图
UITableViewCellAccessoryDetailDisclosureButton 右则将显示一个细节展示按钮 和 一个”>”指向下一级表视图的图标
UITableViewCellAccessoryCheckmark 选中标志 ☑️


五、委托, 数据源协议

表视图(UITableView)的数据源协议 UITableViewDataSource,
委托协议 UITableViewDelegate

UITableViewDataSource主要方法

通过以下方法,可以设置tableView中数据和设置节数及每节中的行数

方法名

返回类型

tableView:cellForRowAtIndexPath:

UITableViewCell *

为表视图单元格提供数据--此方法必须实现
tableView:numberOfRowsInSection

NSInteger

返回每一节里面的行数
tableView:titleForHeaderInSection

NSString

返回节头标题
tableView:titleForFooterInSection

NSString

返回节尾标题
numberOfSectionInTableView

NSInteger

返回tableView中节数
sectionIndexTitleForTableView

NSArray *

提供表视图节索引标题
tableView:commitEditingStyle:forRowAtIndexPath

void

为删除或修改提供数据


UITableViewDelegate主要方法

方法名

返回类型

tableView:viewForHeaderInSection:

UIView *

为节头准备自定义视图
tableView:viewForFooterInSection

UIView *

为节尾准备自定义视图
tableView:didEndDisplayingHeaderView:forSection

void

节头从屏幕中消失时触发事件
tableView:didEndDisplayingFooterView:forSection

void

节尾从屏幕中消失时触发事件
tableView:didEndDisplayingCell:forRowAtIndexPath

void

单元格从屏幕消失时触发
tableView:didSelectRowAtIndexPath

void

选中单元格行时触发

//
//  ViewController.h
//  tableViewTest
//  Copyright © 2016年 www.maomao365.com. All rights reserved.
 #import < UIKit / UIKit.h >
@interface ViewController : UIViewController
@end

//  ViewController.m
//  tableViewTest
 //  Copyright © 2016年 www.maomao365.com. All rights reserved.
  
#import "ViewController.h"
@interface ViewController ()
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    
    
    //创建一个表头视图
    UIView *tableHeaderView = [[UIView alloc] initWithFrame:CGRectMake(0, 10, self.view.frame.size.width,30)];
    UILabel *labe1 = [[UILabel alloc]initWithFrame:CGRectMake(tableHeaderView.frame.origin.x/2-3, tableHeaderView.frame.origin.y/2, 500, 30)];
    [labe1 setText:@"这是一个表头 视图"];
    [tableHeaderView addSubview:labe1];
    
    //创建一个表脚视图
    UIView *tableFooterView = [[UIView alloc] initWithFrame:CGRectMake(0,0, self.view.frame.size.width,30)];
    UILabel *label2 = [[UILabel alloc]initWithFrame:CGRectMake(tableHeaderView.frame.origin.x/2-3, tableHeaderView.frame.origin.y/2, 500, 30)];
    [label2 setText:@"这是一个表脚 视图"];
    [tableFooterView addSubview:label2];
    
    
    UITableView *tableViewTmp = [[UITableView alloc]initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height-30) style:UITableViewStylePlain];
    
    [tableViewTmp setDataSource:self]; //设置数据源委托
    [tableViewTmp  setDelegate:self];  //设置视图委托
    //[tableViewTmp setTableHeaderView:tableHeaderView]; //添加表头视图
    //[tableViewTmp setTableFooterView:tableFooterView]; //添加表脚视图
    [self.view addSubview:tableViewTmp];  //将表视图添加到当前视图
    //销毁使用过的视图
    tableViewTmp = nil;
    tableHeaderView = nil;
    tableFooterView =nil;
    labe1 =nil;
    label2 =nil;
   
}



//返回每节中的行头
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return 5;
}

//返回节头
- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section
{
    return @"节表头";
}

//返回节脚
- (NSString *)tableView:(UITableView *)tableView titleForFooterInSection:(NSInteger)section
{
   return @"节脚本";
}

//设置单元格
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
     {
           // 1.创建cell
         UITableViewCell *cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:nil];
         
         
         cell.textLabel.text = [[NSString alloc]initWithFormat:@"%i",indexPath.row];
         //cell.textLabel.text = @"主数据";
         cell.detailTextLabel.text = @"明细数据";
         cell.imageView.image = [UIImage imageWithData:[NSData dataWithContentsOfURL:[NSURL URLWithString:@"http://localhost/backgroundImage.jpg"]]];
         cell.accessoryType  = UITableViewCellAccessoryDetailButton;
         
         
         
         return cell;
    
      }


- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end