自定義等高cell
frame自定義
- 建立一個繼承自UITableViewCell`的子類
@interface XMGTgCell : UITableViewCell
- 在
檔案中XMGTgCell.m
- 重寫
方法-initWithStyle:reuseIdentifier:
- 在這個方法中添加所有需要顯示的子控件
- 給子控件做一些初始化設定(設定字型、文字顔色等)
- 不能和系統自帶的屬性名相同
-
在這個方法中添加所有的子控件
-
(instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier])
return self;
- 在
- 重寫
方法-layoutSubviews
- 一定要調用
[super layoutSubviews]
- 在這個方法中計算和設定所有子控件的frame
-
在這個方法中計算所有子控件的frame
-
(void)layoutSubviews
{
[super layoutSubviews];
// ......
}
- 一定要調用
#### 在XMGTgCell.h檔案中提供一個模型屬性,比如XMGTg模型
@class XMGTg;
@interface XMGTgCell : UITableViewCell
/** 團購模型資料 */
@property (nonatomic, strong) XMGTg *tg;
@end
在XMGTgCell.m中重寫模型屬性的set方法
- 在set方法中給子控件設定模型資料
- (void)setTg:(XMGTg *)tg
{
_tg = tg;
// .......
}
在控制器中
- 注冊cell的類型
- 給cell傳遞模型資料
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
// 通路緩存池
XMGTgCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];
// 設定資料(傳遞模型資料)
cell.tg = self.tgs[indexPath.row];
return cell;
}
Autolayout自定義
- 建立一個繼承自
的子類UITableViewCell
- 建立一個xib檔案(檔案名最好跟類名一緻)
- 修改cell的class為指定類型
- 綁定循環利用辨別
- 添加子控件,設定子控件限制
将子控件連線到類擴充中
---
@interface XMGTgCell()
@property (weak, nonatomic) IBOutlet UIImageView *iconImageView;
@property (weak, nonatomic) IBOutlet UILabel *titleLabel;
@property (weak, nonatomic) IBOutlet UILabel *priceLabel;
@property (weak, nonatomic) IBOutlet UILabel *buyCountLabel;
@end
在XMGTgCell.h檔案中提供一個模型屬性,比如XMGTg模型
@class XMGTg;
@interface XMGTgCell : UITableViewCell
/** 團購模型資料 */
@property (nonatomic, strong) XMGTg *tg;
@end
```
在XMGTgCell.m中重寫模型屬性的set方法
- 在set方法中給子控件設定模型資料
- (void)setTg:(XMGTg *)tg
{
_tg = tg;
// .......
}
在控制器中
- 注冊xib檔案
[self.tableView registerNib:[UINib nibWithNibName:NSStringFromClass([XMGTgCell class]) bundle:nil] forCellReuseIdentifier:ID];
- 給cell傳遞模型資料
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
// 通路緩存池
XMGTgCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];
// 設定資料(傳遞模型資料)
cell.tg = self.tgs[indexPath.row];
return cell;
}
storybork
步驟與xib相似不同之處在于不要注冊可以自動加載storybork上的cell
在控制器中
- 給cell傳遞模型資料
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *ID = @"tg";
// 通路緩存池
XMGTgCell *cell = [tableView
dequeueReusableCellWithIdentifier:ID];
// 設定資料(傳遞模型資料)
cell.tg = self.tgs[indexPath.row];
return cell;
}
純代碼自定義不等高的cell
給模型增加frame資料
- 所有子控件的frame
- cell的高度
計算文字尺寸
CGSize textMaxSize = CGSizeMake(textW, MAXFLOAT);
NSDictionary *textAttrs = @{NSFontAttributeName : [UIFont systemFontOfSize:14]};
CGFloat textH = [self.text boundingRectWithSize:textMaxSize options:NSStringDrawingUsesLineFragmentOrigin attributes:textAttrs context:nil].size.height;
@interface XMGStatus : NSObject
/** 頭像的frame */
@property (nonatomic, assign) CGRect iconFrame;
/** cell的高度 */
@property (nonatomic, assign) CGFloat cellHeight;
@end
- 重寫模型cellHeight屬性的get方法
- (CGFloat)cellHeight
{
if (_cellHeight == 0) {
// ... 計算所有子控件的frame、cell的高度
}
return _cellHeight;
}
在控制器中
- 實作一個傳回cell高度的代理方法
- 在這個方法中傳回indexPath位置對應cell的高度
- 傳回每一行cell的具體高度
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
XMGStatus *status = self.statuses[indexPath.row];
return status.cellHeight;
}
- 給cell傳遞模型資料
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *ID = @"tg";
// 通路緩存池
XMGStatusCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];
// 設定資料(傳遞模型資料)
cell.status = self.statuses[indexPath.row];
return cell;
}
storybork自定義等高cell(iOS8開始才支援)
- 添加子控件和contentView之間的間距限制
- 設定tableViewCell的真實行高和估算行高
- 告訴tableView所有cell的真實高度是自動計算(根據設定的限制來計算)
self.tableView.rowHeight = UITableViewAutomaticDimension;
- 告訴tableView所有cell的估算高度
self.tableView.estimatedRowHeight = 44;
如果要支援iOS8之前
- 如果cell内部有自動換行的label,需要設定preferredMaxLayoutWidth屬性
- (void)awakeFromNib
{
// 手動設定文字的最大寬度(目的是:讓label知道自己文字的最大寬度,進而能 夠計算出自己的frame)
self.text_label.preferredMaxLayoutWidth = [UIScreen mainScreen].bounds.size.width - 20;
}
- 設定tableView的cell估算高度
告訴tableView所有cell的估算高度(設定了估算高度,就可以減少tableView:heightForRowAtIndexPath:方法的調用次數)
self.tableView.estimatedRowHeight = 200;
####在代理方法中計算cell的高度
XMGStatusCell *cell;
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath: (NSIndexPath *)indexPath
{
// 建立一個cell(cell的作用:根據模型資料布局所有的子控件,進而計算出cell 的高度)
if (!cell) {
cell = [tableView dequeueReusableCellWithIdentifier:ID];
}
// 設定模型資料
cell.status = self.statuses[indexPath.row];
return cell.height;
}
- (CGFloat)height
{
// 強制布局cell内部的所有子控件(label根據文字多少計算出自己最真實的尺寸)
[self layoutIfNeeded];
// 計算cell的高度
if (self.status.picture) {
return CGRectGetMaxY(self.pictureImageView.frame) + 10;
} else {
return CGRectGetMaxY(self.text_label.frame) + 10;
}
}
Google、百度
- 解決燃眉之需
stackoverflow(全英文, IT問答網站)
- 不能用中文關鍵詞
- 開發中遇到的問題,在這裡基本都有答案
翻轉頭檔案
蘋果官方文檔
- UI相關:CocoaTouch Layer -> UIKit -> Guides
- 關注WWDC會議視訊(學習新東西)
多關注别人的部落格\微網誌
- 簡書
轉載于:https://www.cnblogs.com/daizeng3344/p/4684794.html