自定義TableView的分區頭視圖

tableView在項目的開發中使用頻率很高, 所以它的一些代理方法也要很熟悉, 接下來就講講tableView的分區頭視圖, 系統給的頭視圖中只有很少的屬性, 而且一般不能滿足我們的需求, 所以我們需要自定義, 雖然tableView有返回View的方法

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {

}

但需要注意的是tableView如果要自定義就要繼承于UITableViewHeaderFooterView

  1. 創建一個類繼承于UITableViewHeaderFooterView
  2. 重寫
- (instancetype)initWithReuseIdentifier:(NSString *)reuseIdentifier {
    self = [super initWithReuseIdentifier:reuseIdentifier];
    if (self) {
        // 在這里可以創建自定義View中子視圖,
        [self createSubViews];
    }
    return self;
}
  1. 注意子控件的frame要在layoutSubViews中寫(注意父類的調用)
- (void)layoutSubviews {
    [super layoutSubviews];
    
// 寫子控件的frame值
}
  1. 在VC中調用實現以下方法
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
// 這里創建的自定義View在上面tableView要先注冊
}

看一下效果


看一下具體實現代碼:
其中Model是一個數據模型
自定義的MyView.h

#import <UIKit/UIKit.h>
@class Model;
@interface MyView : UITableViewHeaderFooterView
@property (nonatomic, strong) Model *model;
@end

自定義的MyView.m

#import "MyView.h"
#import "Model.h"
@interface MyView ()
@property (nonatomic, strong) UILabel *label;
@property (nonatomic, strong) UIView *viewOfBottom;
@property (nonatomic, strong) UIButton *button;
@property (nonatomic, strong) UIImageView *imageViewOfMore;
@end
@implementation MyView
// init
- (instancetype)initWithReuseIdentifier:(NSString *)reuseIdentifier {
    self = [super initWithReuseIdentifier:reuseIdentifier];
    if (self) {
        [self createSubViews];
    }
    return self;
}
// 創建子視圖
- (void)createSubViews {

    self.label = [[UILabel alloc] initWithFrame:CGRectZero];
    [self.contentView addSubview:_label];
    self.label.textColor = [UIColor whiteColor];
    self.label.textAlignment = NSTextAlignmentCenter;
//    _label.backgroundColor = [UIColor redColor];
    self.viewOfBottom = [[UIView alloc] initWithFrame:CGRectZero];
    [self.contentView addSubview:_viewOfBottom];
    
    self.button = [UIButton buttonWithType:UIButtonTypeCustom];
    [self.viewOfBottom addSubview:_button];
//    _button.backgroundColor = [UIColor whiteColor];
    self.button.tintColor = [UIColor lightGrayColor];
    self.button.titleLabel.font = [UIFont systemFontOfSize:13];
    self.button.titleLabel.textAlignment = NSTextAlignmentRight;
    
    self.imageViewOfMore = [[UIImageView alloc] initWithFrame:CGRectZero];
    [self.viewOfBottom addSubview:_imageViewOfMore];
//    _imageViewOfMore.backgroundColor = [UIColor yellowColor];
}
// Layout布局
- (void)layoutSubviews {
    [super layoutSubviews];
    
    CGFloat width = CGRectGetWidth(self.contentView.bounds);
    CGFloat height = CGRectGetHeight(self.contentView.bounds);
    self.label.frame = CGRectMake(width / 4, 10, width / 2, height - 10);
    
    self.viewOfBottom.frame = CGRectMake(width - 80, height / 3, 65, height * 2 / 3);
    
    self.button.frame = CGRectMake(0, 0, CGRectGetWidth(self.viewOfBottom.bounds) * 2 / 3, CGRectGetHeight(self.viewOfBottom.bounds));
    
    self.imageViewOfMore.frame = CGRectMake(CGRectGetWidth(self.button.bounds), 0, CGRectGetWidth(self.viewOfBottom.bounds) / 3, CGRectGetHeight(self.viewOfBottom.bounds));
}
// 模型賦值
- (void)setModel:(Model *)model {
    _model = model;
   
    self.label.text = model.name;
    
    if (model.number != 0) {
        
        [self.button setTitle:@"更多" forState:UIControlStateNormal];
        self.imageViewOfMore.image = [UIImage imageNamed:@"more"];
    }  
}

@end

VC.m中創建tableVIew的時候注冊

 [_tableView registerClass:[MyView class] forHeaderFooterViewReuseIdentifier:@"header"];
/** 區頭視圖 */
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
    MyView *header = [tableView initWithReuseIdentifier:@"header"];
    header.model = self.mArrOfModel[section + 2];
    return header;
}

這樣就可以了

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 227,401評論 6 531
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 98,011評論 3 413
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 175,263評論 0 373
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 62,543評論 1 307
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,323評論 6 404
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 54,874評論 1 321
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 42,968評論 3 439
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,095評論 0 286
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 48,605評論 1 331
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,551評論 3 354
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 42,720評論 1 369
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,242評論 5 355
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 43,961評論 3 345
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,358評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,612評論 1 280
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,330評論 3 390
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 47,690評論 2 370

推薦閱讀更多精彩內容

  • *7月8日上午 N:Block :跟一個函數塊差不多,會對里面所有的內容的引用計數+1,想要解決就用__block...
    炙冰閱讀 2,506評論 1 14
  • 概述在iOS開發中UITableView可以說是使用最廣泛的控件,我們平時使用的軟件中到處都可以看到它的影子,類似...
    liudhkk閱讀 9,079評論 3 38
  • 微信朋友圈閑逛,“八卦”得知今天是方便面59歲生日! 1949年,原名吳家福的華裔日本人安藤百福用...
    令狐不聰閱讀 569評論 8 6
  • 夢如青春 青春如夢 一塵不染不染的青春 如一杯開水 少了一份激情 青春那些暗戀 那些沖動 是一種回憶 青春如歌 很...
    慕兮若閱讀 193評論 1 1
  • 七寶老街位于上海市閔行區七寶古鎮的新街青年路傍,乘坐上海地鐵,九號線二號出口可直達。老街并不算長,但整條街的建...
    種樹雷橐駝閱讀 666評論 1 3