UITableView自動(dòng)計(jì)算cell高度并緩存

原文鏈接:http://www.reibang.com/p/64f0e1557562

cell高度計(jì)算的歷史

在iOS8之前良风,如果UITableViewCell的高度是動(dòng)態(tài)的揉阎,如果想要顯示正確的話梅桩,我們需要在下面這個(gè)UITableView的代理方法中,返回每一行的精確高度:

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath;

如果cell的控件很多,樣式很復(fù)雜的話,在這里面我們就可能需要寫(xiě)很多代碼去做一些復(fù)雜的計(jì)算炼邀,甚至可能導(dǎo)致滑動(dòng)不流暢。

后來(lái)也有一些人寫(xiě)了一些第三方去解決這個(gè)問(wèn)題剪侮,例如UITableView-FDTemplateLayoutCell汤善。只要給cell自上而下加好約束,它就可以幫我們?nèi)ニ鉩ell的高度并且可以緩存票彪,省去了我們自己寫(xiě)計(jì)算代碼的成本红淡。具體可以進(jìn)鏈接里面看看它的demo。

但是在iOS10的系統(tǒng)下降铸, FDTemplateLayoutCell會(huì)卡界面在旱,而且tableview的行數(shù)越多表現(xiàn)的越卡。

而且蘋(píng)果在iOS8之后推掸,推出了一種超級(jí)簡(jiǎn)單的cell動(dòng)態(tài)自適應(yīng)的方法桶蝎,使用起來(lái)比FDTemplateLayoutCell也簡(jiǎn)單一些,而且現(xiàn)在iOS10都出來(lái)了谅畅,沒(méi)有必要去支持iOS7了登渣,所以最后我還是選擇了用系統(tǒng)的辦法。這樣我們以后就再也不用寫(xiě)heightForRowAtIndexPath方法了毡泻。

系統(tǒng)的cell自適應(yīng)高度的使用方法

首先我們需要把cell上的控件自上而下加好約束胜茧,如果對(duì)約束不熟悉的話建議看看下面這兩篇文章學(xué)習(xí)一下:
Auto Layout Tutorial in iOS 9 Part 1: Getting Started
Auto Layout Tutorial in iOS 9 Part 2: Constraints

注意約束一定要自上而下加好,讓系統(tǒng)知道怎么去計(jì)算高度仇味。在這篇文章的demo里面的cell加的約束是這樣的:

加好約束后呻顽,然后告訴tableView自己去適應(yīng)高度就可以了。有兩種寫(xiě)法:

self.tableView.rowHeight = UITableViewAutomaticDimension;self.tableView.estimatedRowHeight = 100;

或者直接寫(xiě)這個(gè)代理方法就可以了

- (CGFloat)tableView:(UITableView *)tableView estimatedHeightForRowAtIndexPath:(NSIndexPath *)indexPath
{    return 100;
}

這個(gè)的意思就是告訴tableView丹墨,你需要自己適應(yīng)高度廊遍。但是我們需要告訴它一個(gè)大概高度,例如上面的100贩挣,理論上這個(gè)是可以隨便寫(xiě)的喉前,并不影響顯示結(jié)果,但是越接近真實(shí)高度越好王财。

其實(shí)section的header和footer也是可以自動(dòng)適應(yīng)的卵迂,對(duì)應(yīng)的方法有:

- (CGFloat)tableView:(UITableView *)tableView estimatedHeightForHeaderInSection:(NSInteger)section;
- (CGFloat)tableView:(UITableView *)tableView estimatedHeightForFooterInSection:(NSInteger)section;

但是我們?cè)趯?shí)際開(kāi)發(fā)中,一般都是根本沒(méi)有header和footer搪搏,有的話一般也是給一個(gè)固定高度狭握。所以在這里就不講解了,原理都一樣疯溺。

可能遇到的問(wèn)題和解決辦法

1.高度不對(duì)

有時(shí)候有可能運(yùn)行出來(lái)后看到cell的高度顯示的不對(duì)论颅,就像這樣:

這個(gè)問(wèn)題是因?yàn)榧s束沒(méi)有滿足自上而下,從而系統(tǒng)不知道怎么去計(jì)算囱嫩。解決辦法就是去修改約束恃疯,直到滿足為止。一定要好好理解約束澳小今妄!

2.點(diǎn)擊狀態(tài)欄無(wú)法滾動(dòng)到頂部

我們知道,如果界面中有UIScrollView的話,點(diǎn)擊狀態(tài)欄會(huì)讓其滾動(dòng)到頂部盾鳞,就像這樣:

但是如果我們用了自動(dòng)計(jì)算高度的方法犬性,又調(diào)用了tableView的reloadData方法(例如我們的數(shù)據(jù)有分頁(yè)的時(shí)候,加載完下一頁(yè)的數(shù)據(jù)后會(huì)去刷新tableView)腾仅。這時(shí)候就會(huì)出現(xiàn)問(wèn)題乒裆,點(diǎn)擊狀態(tài)欄就有幾率不能精確滾動(dòng)到頂部了,解決這個(gè)問(wèn)題的辦法是去緩存cell的高度推励,代碼如下:

@property (nonatomic, strong) NSMutableDictionary *heightAtIndexPath;//緩存高度所用字典
#pragma mark - UITableViewDelegate-(CGFloat)tableView:(UITableView *)tableView estimatedHeightForRowAtIndexPath:(NSIndexPath *)indexPath
{    NSNumber *height = [self.heightAtIndexPath objectForKey:indexPath];    if(height)
    {        return height.floatValue;
    }    else
    {        return 100;
    }
}

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath
{    NSNumber *height = @(cell.frame.size.height);
    [self.heightAtIndexPath setObject:height forKey:indexPath];
}

解釋一下鹤耍,就是用一個(gè)字典做容器,在cell將要顯示的時(shí)候在字典中保存這行cell的高度验辞。然后在調(diào)用estimatedHeightForRowAtIndexPath方法時(shí)稿黄,先去字典查看有沒(méi)有緩存高度,有就返回跌造,沒(méi)有就返回一個(gè)大概高度杆怕。

這段代碼其實(shí)可以寫(xiě)在viewController基類(lèi)里面,這樣寫(xiě)一遍就可以每個(gè)地方都能緩存cell的高度了鼻听。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末财著,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子撑碴,更是在濱河造成了極大的恐慌撑教,老刑警劉巖,帶你破解...
    沈念sama閱讀 206,482評(píng)論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件醉拓,死亡現(xiàn)場(chǎng)離奇詭異伟姐,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)亿卤,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,377評(píng)論 2 382
  • 文/潘曉璐 我一進(jìn)店門(mén)愤兵,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人排吴,你說(shuō)我怎么就攤上這事秆乳。” “怎么了钻哩?”我有些...
    開(kāi)封第一講書(shū)人閱讀 152,762評(píng)論 0 342
  • 文/不壞的土叔 我叫張陵屹堰,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我街氢,道長(zhǎng)扯键,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 55,273評(píng)論 1 279
  • 正文 為了忘掉前任珊肃,我火速辦了婚禮荣刑,結(jié)果婚禮上馅笙,老公的妹妹穿的比我還像新娘。我一直安慰自己厉亏,他們只是感情好董习,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,289評(píng)論 5 373
  • 文/花漫 我一把揭開(kāi)白布。 她就那樣靜靜地躺著叶堆,像睡著了一般阱飘。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上虱颗,一...
    開(kāi)封第一講書(shū)人閱讀 49,046評(píng)論 1 285
  • 那天,我揣著相機(jī)與錄音,去河邊找鬼。 笑死鸽疾,一個(gè)胖子當(dāng)著我的面吹牛压汪,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播泌参,決...
    沈念sama閱讀 38,351評(píng)論 3 400
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了宣赔?” 一聲冷哼從身側(cè)響起,我...
    開(kāi)封第一講書(shū)人閱讀 36,988評(píng)論 0 259
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤瞪浸,失蹤者是張志新(化名)和其女友劉穎儒将,沒(méi)想到半個(gè)月后,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體对蒲,經(jīng)...
    沈念sama閱讀 43,476評(píng)論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡钩蚊,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 35,948評(píng)論 2 324
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了蹈矮。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片砰逻。...
    茶點(diǎn)故事閱讀 38,064評(píng)論 1 333
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖泛鸟,靈堂內(nèi)的尸體忽然破棺而出蝠咆,到底是詐尸還是另有隱情,我是刑警寧澤北滥,帶...
    沈念sama閱讀 33,712評(píng)論 4 323
  • 正文 年R本政府宣布刚操,位于F島的核電站,受9級(jí)特大地震影響碑韵,放射性物質(zhì)發(fā)生泄漏赡茸。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,261評(píng)論 3 307
  • 文/蒙蒙 一祝闻、第九天 我趴在偏房一處隱蔽的房頂上張望占卧。 院中可真熱鬧遗菠,春花似錦、人聲如沸华蜒。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 30,264評(píng)論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)叭喜。三九已至贺拣,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間捂蕴,已是汗流浹背譬涡。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 31,486評(píng)論 1 262
  • 我被黑心中介騙來(lái)泰國(guó)打工, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留啥辨,地道東北人涡匀。 一個(gè)月前我還...
    沈念sama閱讀 45,511評(píng)論 2 354
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像溉知,于是被迫代替她去往敵國(guó)和親陨瘩。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,802評(píng)論 2 345

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