自定義TableView的分區(qū)頭視圖

tableView在項(xiàng)目的開(kāi)發(fā)中使用頻率很高, 所以它的一些代理方法也要很熟悉, 接下來(lái)就講講tableView的分區(qū)頭視圖, 系統(tǒng)給的頭視圖中只有很少的屬性, 而且一般不能滿(mǎn)足我們的需求, 所以我們需要自定義, 雖然tableView有返回View的方法

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

}

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

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

看一下效果


看一下具體實(shí)現(xiàn)代碼:
其中Model是一個(gè)數(shù)據(jù)模型
自定義的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;
}
// 創(chuàng)建子視圖
- (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中創(chuàng)建tableVIew的時(shí)候注冊(cè)

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

這樣就可以了

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末维哈,一起剝皮案震驚了整個(gè)濱河市赶么,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌鹃锈,老刑警劉巖窜醉,帶你破解...
    沈念sama閱讀 207,248評(píng)論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異艺谆,居然都是意外死亡榨惰,警方通過(guò)查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,681評(píng)論 2 381
  • 文/潘曉璐 我一進(jìn)店門(mén)静汤,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)琅催,“玉大人,你說(shuō)我怎么就攤上這事虫给√俾眨” “怎么了?”我有些...
    開(kāi)封第一講書(shū)人閱讀 153,443評(píng)論 0 344
  • 文/不壞的土叔 我叫張陵抹估,是天一觀的道長(zhǎng)缠黍。 經(jīng)常有香客問(wèn)我,道長(zhǎng)药蜻,這世上最難降的妖魔是什么瓷式? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 55,475評(píng)論 1 279
  • 正文 為了忘掉前任,我火速辦了婚禮语泽,結(jié)果婚禮上贸典,老公的妹妹穿的比我還像新娘。我一直安慰自己踱卵,他們只是感情好廊驼,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,458評(píng)論 5 374
  • 文/花漫 我一把揭開(kāi)白布。 她就那樣靜靜地躺著惋砂,像睡著了一般妒挎。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上班利,一...
    開(kāi)封第一講書(shū)人閱讀 49,185評(píng)論 1 284
  • 那天饥漫,我揣著相機(jī)與錄音,去河邊找鬼罗标。 笑死庸队,一個(gè)胖子當(dāng)著我的面吹牛积蜻,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播彻消,決...
    沈念sama閱讀 38,451評(píng)論 3 401
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼竿拆,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了宾尚?” 一聲冷哼從身側(cè)響起丙笋,我...
    開(kāi)封第一講書(shū)人閱讀 37,112評(píng)論 0 261
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎煌贴,沒(méi)想到半個(gè)月后御板,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 43,609評(píng)論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡牛郑,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,083評(píng)論 2 325
  • 正文 我和宋清朗相戀三年怠肋,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片淹朋。...
    茶點(diǎn)故事閱讀 38,163評(píng)論 1 334
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡笙各,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出础芍,到底是詐尸還是另有隱情杈抢,我是刑警寧澤,帶...
    沈念sama閱讀 33,803評(píng)論 4 323
  • 正文 年R本政府宣布仑性,位于F島的核電站惶楼,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏虏缸。R本人自食惡果不足惜鲫懒,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,357評(píng)論 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望刽辙。 院中可真熱鬧窥岩,春花似錦、人聲如沸宰缤。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 30,357評(píng)論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)慨灭。三九已至朦乏,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間氧骤,已是汗流浹背呻疹。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 31,590評(píng)論 1 261
  • 我被黑心中介騙來(lái)泰國(guó)打工, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留筹陵,地道東北人刽锤。 一個(gè)月前我還...
    沈念sama閱讀 45,636評(píng)論 2 355
  • 正文 我出身青樓镊尺,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親并思。 傳聞我的和親對(duì)象是個(gè)殘疾皇子庐氮,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,925評(píng)論 2 344

推薦閱讀更多精彩內(nèi)容

  • *7月8日上午 N:Block :跟一個(gè)函數(shù)塊差不多,會(huì)對(duì)里面所有的內(nèi)容的引用計(jì)數(shù)+1宋彼,想要解決就用__block...
    炙冰閱讀 2,473評(píng)論 1 14
  • 概述在iOS開(kāi)發(fā)中UITableView可以說(shuō)是使用最廣泛的控件弄砍,我們平時(shí)使用的軟件中到處都可以看到它的影子,類(lèi)似...
    liudhkk閱讀 8,995評(píng)論 3 38
  • 微信朋友圈閑逛,“八卦”得知今天是方便面59歲生日莱坎! 1949年桃熄,原名吳家福的華裔日本人安藤百福用...
    令狐不聰閱讀 554評(píng)論 8 6
  • 夢(mèng)如青春 青春如夢(mèng) 一塵不染不染的青春 如一杯開(kāi)水 少了一份激情 青春那些暗戀 那些沖動(dòng) 是一種回憶 青春如歌 很...
    慕兮若閱讀 184評(píng)論 1 1
  • 七寶老街位于上海市閔行區(qū)七寶古鎮(zhèn)的新街青年路傍,乘坐上海地鐵型奥,九號(hào)線(xiàn)二號(hào)出口可直達(dá)。老街并不算長(zhǎng)碉京,但整條街的建...
    種樹(shù)雷橐駝閱讀 637評(píng)論 1 3