碼上快樂

相關內容    簡體    繁體

iOS學習之UITableView

本文轉載自   查看原文   2015-12-24 00:13   3978    UITableView/ iOS/ cell/ cell重用

UITableView

UITableView繼承自UIScrollView，可以用來展示一組或多組內容樣式相似的數據。UITableView幾乎是iOS開發中運用最多的UI控件了，是iOS開發中必須掌握的控件之一。

什么是UITableView？

在眾多移動應用中，能看到各式各樣的列表數據：

在iOS中，要實現展示列表數據，最常用的做法就是使用UITableView。UITableView繼承自UIScrollView，因此支持垂直滾動，而且性能極佳。

UITableView的兩種樣式：

  • UITableViewStylePlain:

  • UITableViewStyleGrouped:

UITableViewCell簡介：

  • UITableView的每一行都是一個UITableViewCell，通過dataSource的tableView:cellForRowAtIndexPath:方法來初始化每一行。

  • UITableViewCell內部有個默認的子視圖:contentView，contentView是UITableViewCell所顯示內容的父視圖，可顯示一些輔助指示視圖。

  • 輔助指示視圖的作用是顯示一個表示動作的圖標，可以通過設置UITableViewCell的accessoryType來顯示，默認是UITableViewCellAccessoryNone(不顯示輔助指示視圖)，其他值如下:

    • UITableViewCellAccessoryDisclosureIndicator
    • UITableViewCellAccessoryDetailButton
    • UITableViewCellAccessoryDetailDisclosureButton
    • UITableViewCellAccessoryCheckmark
    • 還可以通過cell的accessoryView屬性來自定義輔助指示視圖（比如往右邊放一個開關）

UITableViewCell的contentView:

  • contentView下默認有3個子視圖

    • 其中2個是UILabel(通過UITableViewCell的textLabel和detailTextLabel屬性訪問)
    • 第3個是UIImageView(通過UITableViewCell的imageView屬性訪問)

  • UITableViewCell還有一個UITableViewCellStyle屬性，用於決定使用contentView的哪些子視圖，以及這些子視圖在contentView中的位置

UITableView的常見屬性：

/* tableView的樣式 */
@property (nonatomic, readonly) UITableViewStyle style;
// tableView有兩種樣式
//     UITableViewStylePlain  普通的表格樣式
//    UITableViewStyleGrouped  分組模式

/* tableView的數據源 */
@property (nonatomic, weak, nullable) id <UITableViewDataSource> dataSource;
/* tableView的代理 */
@property (nonatomic, weak, nullable) id <UITableViewDelegate> delegate;

#pragma mark - 高度相關
/* tableView每一行的高度，默認為44 */
@property (nonatomic) CGFloat rowHeight;
/* tableView統一的每一組頭部的高度 */
@property (nonatomic) CGFloat sectionHeaderHeight;
/* tableView統一的每一組頭部的高度 */
@property (nonatomic) CGFloat sectionFooterHeight;
/* 估算的tableView的統一的每一行行高 */
@property (nonatomic) CGFloat estimatedRowHeight;
/* 估算的統一的每一組頭部高度，設置估算高度可以優化性能 */
@property (nonatomic) CGFloat estimatedSectionHeaderHeight;
/* 估算的統一的每一組的尾部高度 */
@property (nonatomic) CGFloat estimatedSectionFooterHeight;

/* 總共有多少組 */
@property (nonatomic, readonly) NSInteger numberOfSections;
/* 選中行的indexPath */
@property (nonatomic, readonly, nullable) NSIndexPath *indexPathForSelectedRow;

#pragma mark - 索引條
/* 索引條文字的顏色 */
@property (nonatomic, strong, nullable) UIColor *sectionIndexColor;
/* 索引條的背景色 */
@property (nonatomic, strong, nullable) UIColor *sectionIndexBackgroundColor;

#pragma mark - 分隔線
/* 分隔線的樣式 */
@property (nonatomic) UITableViewCellSeparatorStyle separatorStyle;
// 分隔線的樣式有：
// UITableViewCellSeparatorStyleNone,  沒有分隔線
// UITableViewCellSeparatorStyleSingleLine, 正常分隔線
@property (nonatomic, strong, nullable) UIColor *separatorColor; // 分隔線的顏色

#pragma mark - 頭尾部控件
/* tableView的頭部控件，只能設置高度，寬度默認填充表格 */
@property (nonatomic, strong, nullable) UIView *tableHeaderView;
/* tableView的尾部控件，只能設置高度，寬度默認填充表格*/
@property (nonatomic, strong, nullable) UIView *tableFooterView;

#pragma mark - 編輯模式
/* 是否是編輯模式，默認是NO */
@property (nonatomic, getter=isEditing) BOOL editing;
/* tableView處在編輯模式的時候是否允許選中行，默認是NO */
@property (nonatomic) BOOL allowsSelectionDuringEditing;
/* tableView處在編輯模式的時候是否允許選中多行數據，默認是NO */
@property (nonatomic) BOOL allowsMultipleSelectionDuringEditing;

UITableViewCell的常見屬性：

#pragma mark - Cell內部子控件
/*  默認為nil，imageView是懶加載，用到時才加載 */
@property (nonatomic, readonly, strong, nullable) UIImageView *imageView;
/* 默認為nil，是懶加載，用到時才加載 */
@property (nonatomic, readonly, strong, nullable) UILabel *textLabel;
/* 只有當Cell的樣式為UITableViewCellStyleSubtitle時才會顯示出來，默認為nil，是懶加載，用到時才加載 */
@property (nonatomic, readonly, strong, nullable) UILabel *detailTextLabel;

/* 當你想要自定義一個cell的時候，子控件最好添加到cell的contentView上，方便編輯表格 */
@property (nonatomic, readonly, strong) UIView *contentView;

/* cell的復用標識 */
@property (nonatomic, readonly, copy, nullable) NSString *reuseIdentifier;

/* cell的選中樣式 */
@property (nonatomic) UITableViewCellSelectionStyle   selectionStyle;
/* cell是否是選中狀態 */
@property (nonatomic, getter=isSelected) BOOL         selected;

/* cell的編輯樣式，默認是UITableViewCellEditingStyleNone */
@property (nonatomic, readonly) UITableViewCellEditingStyle editingStyle;
// cell的編輯樣式有：
// UITableViewCellEditingStyleNone,
// UITableViewCellEditingStyleDelete, 刪除模式
// UITableViewCellEditingStyleInsert   插入模式

/* 指示器的樣式，默認是UITableViewCellAccessoryNone */
@property (nonatomic) UITableViewCellAccessoryType    accessoryType;
// 指示器的樣式有：
// UITableViewCellAccessoryNone   不顯示指示器
// UITableViewCellAccessoryDisclosureIndicator cell右側顯示一個箭頭
// UITableViewCellAccessoryDetailDisclosureButton cell右側顯示一個箭頭和一個詳情圖標
// UITableViewCellAccessoryCheckmark cell右側顯示一個對勾
// UITableViewCellAccessoryDetailButton cell右側顯示一個詳情圖標

/* cell右側指示器view，設置了以后，cell的accessoryType就會失效  */
@property (nonatomic, strong, nullable) UIView       *accessoryView;

UITableView的常用方法：

/* 全局刷新 */
- (void)reloadData;
/* 刷新索引條 */
- (void)reloadSectionIndexTitles;

/* 返回第section組有多少行 */
- (NSInteger)numberOfRowsInSection:(NSInteger)section;
/* 返回indexPath對應的那一行的cell */
- (nullable __kindof UITableViewCell *)cellForRowAtIndexPath:(NSIndexPath *)indexPath;

/* 返回第section組的頭部view */
- (nullable UITableViewHeaderFooterView *)headerViewForSection:(NSInteger)section;
/* 返回第section組的尾部view */
- (nullable UITableViewHeaderFooterView *)footerViewForSection:(NSInteger)section;

/**
 *  插入數據,刷新數據
 *  @param indexPaths 插入在哪個位置
 *  @param animation  動畫效果，枚舉UITableViewRowAnimation
 */
- (void)insertRowsAtIndexPaths:(NSArray<NSIndexPath *> *)indexPaths withRowAnimation:(UITableViewRowAnimation)animation;

/**
 *  刪除數據
 *  @param indexPaths 刪除數據的位置
 *  @param animation  動畫效果，枚舉UITableViewRowAnimation
 */
- (void)deleteRowsAtIndexPaths:(NSArray<NSIndexPath *> *)indexPaths withRowAnimation:(UITableViewRowAnimation)animation;
// 枚舉UITableViewRowAnimation包括：
// UITableViewRowAnimationFade,  淡入淡出
// UITableViewRowAnimationRight,  向右滑動
// UITableViewRowAnimationLeft,  向左滑動
// UITableViewRowAnimationTop,  向上滑動
// UITableViewRowAnimationBottom,  向下滑動
// UITableViewRowAnimationNone,  無動畫效果,iOS 3.0以后可用
// UITableViewRowAnimationMiddle,  保持cell的中間，iOS 3.2以后可用
// UITableViewRowAnimationAutomatic  自動選擇一個合適的動畫效果

/**
 *  刷新某一行的數據
 *  @param indexPaths 刷新數據的位置
 *  @param animation  動畫效果，枚舉UITableViewRowAnimation
 */
- (void)reloadRowsAtIndexPaths:(NSArray<NSIndexPath *> *)indexPaths withRowAnimation:(UITableViewRowAnimation)animation;

/** 動畫開啟/關閉編輯模式 */
- (void)setEditing:(BOOL)editing animated:(BOOL)animated;

/** 返回一個帶有復用標識的cell */
- (nullable __kindof UITableViewCell *)dequeueReusableCellWithIdentifier:(NSString *)identifier;

/**
 *  使用xib時注冊自定義的cell
 *  @param nib        要注冊的nib
 *  @param identifier 復用標識
 */
- (void)registerNib:(nullable UINib *)nib forCellReuseIdentifier:(NSString *)identifier;

/**
 *   代碼自定義cell時注冊自定義的cell
 *  @param cellClass  注冊的自定義cell的類型
 *  @param identifier 復用標識
 */
- (void)registerClass:(nullable Class)cellClass forCellReuseIdentifier:(NSString *)identifier;

/** 初始化一個帶有復用標識的cell */
- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(nullable NSString *)reuseIdentifier

UITableViewDataSource中的常用方法:

// 必須實現的方法：
/* 設置第section組有多少行數據 */
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section;
/* 設置每一行cell的內容，每當有一個cell進入視野屏幕的時候就會調用這個方法，所以在這個方法內部進行優化（cell的復用） */
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath;

// 可實現可不實現的方法：
/* 總共有多少組，如果不實現，默認是一組 */
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView;

/* 第section組的頭部標題 */
- (nullable NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section;
/* 第section組的尾部標題 */
- (nullable NSString *)tableView:(UITableView *)tableView titleForFooterInSection:(NSInteger)section;

/** 設置索引條 */
- (nullable NSArray<NSString *> *)sectionIndexTitlesForTableView:(UITableView *)tableView;

UITableViewDelegate中的常用方法：

/** 設置每一行cell的高度 */
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath;
/** 設置第section組的頭部高度 */
- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section;
/** 設置第section組的尾部高度 */
- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section;

/** 每一行的估算高度 */
- (CGFloat)tableView:(UITableView *)tableView estimatedHeightForRowAtIndexPath:(NSIndexPath *)indexPath;

/** 設置第section組的headerView */
- (nullable UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section;
/** 設置第section組的footerView */
- (nullable UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section;

/** 選中了某一行cell的時候就會調用這個方法 */
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath;

/**
 *  設置左滑刪除按鈕的文字
 *  @param tableView         被編輯的tableView
 *  @param indexPath         indexPath
 *  @return 返回刪除按鈕顯示的文字
 */
- (nullable NSString *)tableView:(UITableView *)tableView titleForDeleteConfirmationButtonForRowAtIndexPath:(NSIndexPath *)indexPath;

/**
 *  創建一個左滑出現按鈕的操作（UITableViewRowAction）數組
 *  @param tableView         添加操作的tableView
 *  @param indexPath         indexPath，可以指定每一行有不同的效果
 *  @return 返回一個操作（UITableViewRowAction）數組
 */
- (nullable NSArray<UITableViewRowAction *> *)tableView:(UITableView *)tableView editActionsForRowAtIndexPath:(NSIndexPath *)indexPath;

/**
 *  移動cell
 *  @param tableView            操作的tableView
 *  @param sourceIndexPath      移動的行
 *  @param destinationIndexPath 目標行
 */
- (void)tableView:(UITableView *)tableView moveRowAtIndexPath:(NSIndexPath *)sourceIndexPath toIndexPath:(NSIndexPath *)destinationIndexPath;

/** 根據editingStyle處理是刪除還是添加操作，完成刪除、插入操作刷新表格 */
- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath;

/**
 *  設置表格編輯模式，不實現默認都是刪除
 *  @param tableView 操作的tableView
 *  @param indexPath cell的位置
 *  @return 返回表格編輯樣式
 */
- (UITableViewCellEditingStyle)tableView:(UITableView *)tableView editingStyleForRowAtIndexPath:(NSIndexPath *)indexPath;

tableView如何展示數據：

  • UITableView需要一個數據源(dataSource)來顯示數據
  • UITableView會向數據源查詢一共有多少行數據以及每一行顯示什么數據等
  • 沒有設置數據源的UITableView只是個空殼
  • 凡是遵守UITableViewDataSource協議的OC對象，都可以是UITableView的數據源

tableView展示數據的過程:

設置數據源，遵守UITableViewDataSource協議，實現協議方法：

@interface ViewController ()<UITableViewDataSource,UITableViewDelegate>

@property (weak, nonatomic) IBOutlet UITableView *tableView;

@end

- (void)viewDidLoad{
    [super viewDidLoad];

    self.tableView.dataSource = self;
}

#pragma mark - UITableViewDataSource
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
    // 在這個方法中設置總共有多少組數據
    // 這個方法如果不實現，默認是一組
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    // 在這個方法中設置第section組有多行數據
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    // 1.定義一個cell的復用標識
      static NSString *ID = @"cell";

    // 2.根據復用標識，從緩存池中取出帶有同樣的復用標識的cell
      UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];

    // 3.如果緩存池中沒有帶有這種復用標識的cell，就創建一個帶有這種復用標識的cell
      if (cell == nil) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:ID];
    }

    // 4.設置cell的一些屬性

    return cell;
}

- (NSString *)tableView:(UITableView *)tableView titleForFooterInSection:(NSInteger)section{
    // 在這個方法中設置第section組的尾部標題
}

- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section{
    // 在這個方法中設置第section組的頭部標題
}

#pragma mark - UITableViewDelegate

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
    // 當選中了某一行的時候就會調用這個方法，可以在這里進行一些操作
}

Cell的重用原理：

iOS設備的內存有限，如果用UITableView顯示成千上萬條數據，就需要成千上萬個UITableViewCell對象的話，那將會耗盡iOS設備的內存。要解決該問題，需要重用UITableViewCell對象。

重用原理：當滾動列表時，部分UITableViewCell會移出窗口，UITableView會將窗口外的UITableViewCell放入一個緩存池中，等待重用。當UITableView要求dataSource返回UITableViewCell時，dataSource會先查看這個緩存池，如果池中有未使用的UITableViewCell，dataSource會用新的數據配置這個UITableViewCell，然后返回給UITableView，重新顯示到窗口中，從而避免創建新對象。

還有一個非常重要的問題：有時候需要自定義UITableViewCell(用一個子類繼承UITableViewCell)，而且每一行用的不一定是同一種UITableViewCell，所以一個UITableView可能擁有不同類型的UITableViewCell，緩存池中也會有很多不同類型的UITableViewCell，那么UITableView在重用UITableViewCell時可能會得到錯誤類型的UITableViewCell。

解決方案：UITableViewCell有個NSString *reuseIdentifier屬性，可以在初始化UITableViewCell的時候傳入一個特定的字符串標識來設置reuseIdentifier(一般用UITableViewCell的類名)。當UITableView要求dataSource返回UITableViewCell時，先通過一個字符串標識到緩存池中查找對應類型的UITableViewCell對象，如果有，就重用，如果沒有，就傳入這個字符串標識來初始化一個UITableViewCell對象。

通過代碼自定義cell(cell的高度不一致)：

這里提供的思路並未使用自動布局，是純手碼計算frame。

  • 1.新建一個繼承自UITableViewCell的類。
  • 2.重寫initWithStyle:reuseIdentifier:方法
    • 添加所有需要顯示的子控件(不需要設置子控件的數據和frame, 子控件要添加到contentView中)
    • 進行子控件一次性的屬性設置(有些屬性只需要設置一次, 比如字體、固定的圖片)
  • 3.提供2個模型
    • 數據模型: 存放文字數據、圖片數據
    • frame模型: 存放數據模型、所有子控件的frame、cell的高度
  • 4.cell擁有一個frame模型(不要直接擁有數據模型)
  • 5.重寫frame模型屬性的setter方法: 在這個方法中設置子控件的顯示數據和frame
  • 6.frame模型數據的初始化已經采取懶加載的方式(每一個cell對應的frame模型數據只加載一次)


免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。



猜您在找 ios學習:UITableView(一) IOS UITableView分組列表 UITableView學習筆記 IOS UITableview代理方法總結 ios UITableView頂部向下偏移 IOS 11 下適配UITableView IOS開發---菜鳥學習之路--（十七）-利用UITableView實現個人信息界面 IOS開發---菜鳥學習之路--（六）-UITableView幾個方法的使用說明 iOS: 在UIViewController 中添加Static UITableView iOS UITableView點擊按鈕滾到頂部
 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM