實(shí)例講解iOS應(yīng)用開發(fā)中使用UITableView創(chuàng)建自定義表格
一、帶索引目錄的表視圖
1.效果圖
2.數(shù)據(jù)源
本想獲取通訊錄中得名字，但為了用模擬器調(diào)試方便，就寫死了數(shù)據(jù)，所以也只寫了部分字母，總之有那么點(diǎn)意思就成
@interface ViewController ()<UITableViewDataSource,UITableViewDelegate>
{
NSArray *sectionTitles; // 每個(gè)分區(qū)的標(biāo)題
NSArray *contentsArray; // 每行的內(nèi)容
}
/** @brief 準(zhǔn)備數(shù)據(jù)源 在viewDidLoad方法中調(diào)用*/
- (void)readySource
{
sectionTitles = [[NSArray alloc] initWithObjects:
@"A",@"C",@"F",@"G",@"H",@"M",@"S",@"T",@"X",@"Z", nil];
contentsArray = [[NSArray alloc] initWithObjects:
@[@"阿偉",@"阿姨",@"阿三"],
@[@"蔡芯",@"成龍",@"陳鑫",@"陳丹",@"成名"],
@[@"芳仔",@"房祖名",@"方大同",@"芳芳",@"范偉"],
@[@"郭靖",@"郭美美",@"過兒",@"過山車"],
@[@"何仙姑",@"和珅",@"郝歌",@"好人"],
@[@"媽媽",@""],
@[@"孫",@"沈冰",@"嬸嬸"],
@[@"濤濤",@"淘寶",@"套娃"],
@[@"小二",@"夏紫",@"許",@"許"],
@[@"周",@"周",@"張",@"張"],nil];
}
3.顯示索引
// 每個(gè)分區(qū)的頁眉
-(NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section
{
return [sectionTitles objectAtIndex:section];
}
// 索引目錄
-(NSArray *)sectionIndexTitlesForTableView:(UITableView *)tableView
{
return sectionTitles;
}
④點(diǎn)擊索引，跳轉(zhuǎn)到點(diǎn)擊的分區(qū)
// 點(diǎn)擊目錄
-(NSInteger)tableView:(UITableView *)tableView sectionForSectionIndexTitle:(NSString *)title atIndex:(NSInteger)index
{
// 獲取所點(diǎn)目錄對(duì)應(yīng)的indexPath值
NSIndexPath *selectIndexPath = [NSIndexPath indexPathForRow:0 inSection:index];
// 讓table滾動(dòng)到對(duì)應(yīng)的indexPath位置
[tableView scrollToRowAtIndexPath:selectIndexPath atScrollPosition:UITableViewScrollPositionBottom animated:YES];
return index;
}
二、可以進(jìn)行行標(biāo)記的表視圖
1.效果圖
2.在cellForRow方法中，將Cell的accessoryType設(shè)置為None
// 定義其輔助樣式
cell.accessoryType = UITableViewCellAccessoryNone;
3.在didSelectRow方法中
// 點(diǎn)擊行事件
-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
// 獲取點(diǎn)擊行的cell
UITableViewCell *cell = [tableView cellForRowAtIndexPath:indexPath];
// 如果cell已經(jīng)被標(biāo)記
if (cell.accessoryType == UITableViewCellAccessoryCheckmark) {
// 取消標(biāo)記
cell.accessoryType = UITableViewCellAccessoryNone;
}
// 如果cell未標(biāo)記
else{
// 標(biāo)記cell
cell.accessoryType = UITableViewCellAccessoryCheckmark;
}
// 取消選中效果
[tableView deselectRowAtIndexPath:indexPath animated:YES];
}
此時(shí)，點(diǎn)擊行即可選中，取消選中，但是滾動(dòng)一下視圖吧，你會(huì)發(fā)現(xiàn)下面某些未被點(diǎn)擊的行也已經(jīng)被標(biāo)記了，這是因?yàn)閏ell的重用機(jī)制造成的，在第一篇文章中就這個(gè)問題有提到過
4.解決cell重用問題，在cellForRow方法中，定義cellIdetifier時(shí)，將其每一行都定義為不同的值，就不會(huì)出現(xiàn)覆蓋，重復(fù)等現(xiàn)象了，但是這個(gè)方法太過粗暴，并不是最好的解決辦法，情急之下可以先用，然后再慢慢調(diào)試Table上的數(shù)據(jù)
NSString *cellIdentifier = [NSString stringWithFormat:@"cellIdentifier%d%d",indexPath.row,indexPath.section];
三、定制表視圖的每一行內(nèi)容
1.我們做一個(gè)類似網(wǎng)易新聞客戶端的新聞列表的table，如下圖左；簡(jiǎn)易效果圖，如下圖右
2.數(shù)據(jù)源，在interface中聲明
NSMutableArray *news_MArray;// 新聞內(nèi)容數(shù)據(jù)源
新建一個(gè)model類，命名為"newsModel"，存放每一項(xiàng)數(shù)據(jù)
newsModel.h如下，.m中沒有添加其他代碼，如果需要拷貝，可以重載copyWithZone方法，
#import <Foundation/Foundation.h>
typedef NS_ENUM(NSInteger, NEWSReportType){
NEWSReportOrdinary, // 普通新聞
NEWSReportExclusive,// 獨(dú)家新聞
NEWSReportSpecial, // 專題新聞
};
@interface newsModel : NSObject
@property (nonatomic, copy)NSString * news_image; //圖片
@property (nonatomic, copy)NSString * news_title; //標(biāo)題
@property (nonatomic, copy)NSString * news_summary; //摘要
@property (nonatomic, assign)NSInteger news_replyNo; //跟帖數(shù)量
@property (nonatomic, assign)NEWSReportType reportType; //報(bào)道類型
@end
在viewDidLoad方法中
news_MArray = [[NSMutableArray alloc] init];
for(NSInteger index =0; index<10; index++){
newsModel *model = [[newsModel alloc] init];
model.news_image = [NSString stringWithFormat:@"%d.jpg",index+1];
model.news_title = @"曾在月光之下望煙花";
model.news_summary = @"曾共看夕陽漸降下 我怎么舍得去放下 要怎么舍得去放下";
model.news_replyNo = index+196;
model.reportType = index%3;
[news_MArray addObject:model];
}
3.行數(shù)
// 每個(gè)分區(qū)行數(shù)
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
return [news_MArray count];
}
4.自定義cell上控件
在cellForRow方法中if(cell==nil)前
/*****自定義cell******/
newsModel *model = [news_MArray objectAtIndex:indexPath.row];
UIImageView * image_view; //1.添加imageView
UILabel * title_label; //2.添加標(biāo)題Label
UILabel * summary_label; //3.添加摘要Label
UILabel * replyNo_label; //4.添加跟帖數(shù)量Label
UIButton * extra_view; //5.屬于專題或者獨(dú)家報(bào)道，進(jìn)行標(biāo)記
/********************/
在if(cell==nil)內(nèi)
/*****自定義cell******/
//1.添加imageView
CGRect imageViewF = CGRectMake(5, 5, 85, 65);
image_view = [[UIImageView alloc] initWithFrame:imageViewF];
[cell addSubview:image_view];
//2.添加標(biāo)題Label
CGRect titleLabelF = CGRectMake(95, 5, 230, 24);
title_label = [[UILabel alloc] initWithFrame:titleLabelF];
title_label.font = [UIFont systemFontOfSize:16];//字體大小
[cell addSubview:title_label];
//3.添加摘要Label
CGRect summaryLabelF = CGRectMake(97, 27, 210, 40);
summary_label = [[UILabel alloc] initWithFrame:summaryLabelF];
summary_label.font = [UIFont systemFontOfSize:12]; // 字體大小
summary_label.textColor = [UIColor darkGrayColor]; // 文字顏色
summary_label.numberOfLines = 2;
[cell addSubview:summary_label];
//4.跟帖數(shù)量Label
CGRect replyNoLabelF = CGRectMake(210, 45, 95, 24);
replyNo_label = [[UILabel alloc] initWithFrame:replyNoLabelF];
replyNo_label.font = [UIFont systemFontOfSize:12]; // 字體大小
replyNo_label.textColor = [UIColor darkGrayColor]; // 文字顏色
replyNo_label.textAlignment = NSTextAlignmentRight; // 文字右對(duì)齊
//5.專題extraView
CGRect extraViewF = CGRectMake(270, 50, 28, 14);
extra_view = [[UIButton alloc] initWithFrame:extraViewF];
extra_view.titleLabel.font = [UIFont boldSystemFontOfSize:10];
[extra_view setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
// 普通新聞，只添加跟帖數(shù)量
if (model.reportType==NEWSReportOrdinary) {
[cell addSubview:replyNo_label];
}
// 專題新聞，添加專題標(biāo)志，并添加跟帖數(shù)量
else if(model.reportType == NEWSReportSpecial){
// 設(shè)置背景色
extra_view.backgroundColor = [UIColor colorWithRed:120.0/255.0 green:170.0/255.0 blue:245.0/255.0 alpha:1.0];
[extra_view setTitle:@"獨(dú)家" forState:UIControlStateNormal];// 設(shè)置標(biāo)題
[cell addSubview:extra_view]; // 添加
replyNo_label.frame = CGRectMake(170, 45, 95, 24); // 改變跟帖數(shù)量Label的坐標(biāo)
[cell addSubview:replyNo_label]; // 添加跟帖數(shù)量Label
}
// 獨(dú)家新聞，只添加獨(dú)家標(biāo)志
else if(model.reportType == NEWSReportExclusive){
extra_view.backgroundColor = [UIColor redColor]; // 設(shè)置背景顏色
[extra_view setTitle:@"專題" forState:UIControlStateNormal]; // 設(shè)置標(biāo)題
[cell addSubview:extra_view]; // 添加到cell
}
/********************/
在if(cell==nil)后
/*****自定義cell******/
[image_view setImage:[UIImage imageNamed:model.news_image]];// 設(shè)置圖片
title_label.text = model.news_title; // 設(shè)置標(biāo)題
summary_label.text = model.news_summary; // 設(shè)置小標(biāo)題
replyNo_label.text = [NSString stringWithFormat:@"%d 跟帖",model.news_replyNo];// 設(shè)置跟帖數(shù)量
/********************/
5.設(shè)置行高
-(CGFloat) tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
return 75;
}
- iOS開發(fā)之UITableView左滑刪除等自定義功能
- 全面解析iOS應(yīng)用中自定義UITableViewCell的方法
- iOS應(yīng)用中UITableView左滑自定義選項(xiàng)及批量刪除的實(shí)現(xiàn)
- iOS中UITableView Cell實(shí)現(xiàn)自定義單選功能
- 詳解ios中自定義cell，自定義UITableViewCell
- iOS App開發(fā)中使用及自定義UITableViewCell的教程
- ios UITableView 自定義右滑刪除的實(shí)現(xiàn)代碼
- iOS自定義UITableView實(shí)現(xiàn)不同系統(tǒng)下的左滑刪除功能詳解
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了iOS圖片拉伸的4種方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-01-01
這篇文章主要為大家詳細(xì)介紹了iOS自定義UIDatePicker日期選擇器視圖，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-04-04
iOS粒子路徑移動(dòng)效果 iOS實(shí)現(xiàn)QQ拖動(dòng)效果
這篇文章主要為大家詳細(xì)介紹了iOS粒子路徑移動(dòng)效果，iOS實(shí)現(xiàn)QQ拖動(dòng)效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-07-07
本文通過兩種方法給大家介紹了判斷中英文混合的字符長(zhǎng)度，非常具有參考價(jià)值，特此分享供大家學(xué)習(xí)2016-05-05
iOS App使用SQLite之句柄的定義及數(shù)據(jù)庫的基本操作
SQLite中在定義過句柄之后就可以指向數(shù)據(jù)庫,從而利用iOS應(yīng)用程序進(jìn)行打開或關(guān)閉等各種操作,這里我們就來看一下iOS App使用SQLite之句柄的定義及數(shù)據(jù)庫的基本操作2016-06-06
這篇文章主要介紹了iPhoneX 媒體查詢適配的方法教程，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-11-11
在iOS應(yīng)用開發(fā)中，有三類視圖對(duì)象會(huì)打開虛擬鍵盤，進(jìn)行輸入操作，但如何關(guān)閉虛擬鍵盤，卻沒有提供自動(dòng)化的方法。這個(gè)需要我們自己去實(shí)現(xiàn)。2015-05-05
iOS中tableview實(shí)現(xiàn)編輯、全選及刪除等功能的方法示例
這篇文章主要給大家介紹了關(guān)于iOS中tableview實(shí)現(xiàn)編輯、全選及刪除等功能的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，不僅是介紹實(shí)現(xiàn)的方法，將實(shí)現(xiàn)過程中遇到的問題也都分享出來了，需要的朋友們下面來一起看看吧。2017-07-07
iOS11 SectionHeader 胡亂移動(dòng)且滑動(dòng)時(shí)出現(xiàn)重復(fù)內(nèi)容的解決方法
這篇文章主要介紹了iOS11 SectionHeader 胡亂移動(dòng)且滑動(dòng)時(shí)出現(xiàn)重復(fù)內(nèi)容的解決方法,需要的朋友可以參考下2017-11-11
UITableViewCell在編輯狀態(tài)下背景顏色的修改方法
這篇文章主要給大家介紹了關(guān)于UITableViewCell在編輯狀態(tài)下背景顏色的修改方法，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面跟著小編一起來學(xué)習(xí)學(xué)習(xí)吧。2017-07-07