iOS 高性能異構(gòu)滾動(dòng)視圖構(gòu)建方案- LazyScrollView 詳細(xì)用法

LazyScrollView 終于被開源了蜜暑,一些東西可以被拿出來(lái)繼續(xù)說(shuō)一下饶唤。

Github 鏈接 : https://github.com/alibaba/LazyScrollView

如果是第一次接觸LazyScrollView畅蹂,建議先看一下之前的文章霜第,了解一下具體原理http://pingguohe.net/2016/01/31/lazyscroll.html

Demo請(qǐng)直接Clone Github工程,在master分支名挥,打開LazyScrollViewDemo文件夾下的工程

具體用法都在ViewController這個(gè)類內(nèi)瓮顽。

TMMuiLazyScrollView *scrollview = [[TMMuiLazyScrollView alloc]init];
scrollview.frame = self.view.bounds;   
scrollview.dataSource = self;    
[self.view addSubview:scrollview];

和正常的ScrollView一樣init即可县好,只需要注意一點(diǎn)的是,需要有一個(gè)實(shí)現(xiàn)TMMuiLazyScrollViewDataSource的類趣倾,賦給LazyScrollView的dataSource

實(shí)現(xiàn) TMMuiLazyScrollViewDataSource

返回View個(gè)數(shù)

- (NSUInteger)numberOfItemInScrollView:(TMMuiLazyScrollView *)scrollView

這里需要返回view的個(gè)數(shù)聘惦,決定返回多少個(gè)rectModel

返回RectModel

- (TMMuiRectModel *)scrollView:(TMMuiLazyScrollView *)scrollView rectModelAtIndex:(NSUInteger)index

根據(jù)index返回TMMuiRectModel

TMMuiRectModel有兩個(gè)屬性某饰,一個(gè)是muiID儒恋,它是View的唯一標(biāo)識(shí)符, 另一個(gè)是absoluteRect善绎,是對(duì)應(yīng)的View在LazyScrollView內(nèi)的絕對(duì)坐標(biāo)

按需返回視圖

- (UIView *)scrollView:(TMMuiLazyScrollView *)scrollView itemByMuiID:(NSString *)muiID

這個(gè)方法在需要生成即將進(jìn)入屏幕的視圖的時(shí)候,會(huì)被LazyScrollView按需調(diào)用 muiID就是rectModel的muiID诫尽,可以根據(jù)muiID生成相關(guān)的View

這里一般會(huì)先去找復(fù)用的視圖禀酱,沒有再做生成

Demo中這個(gè)方法內(nèi)部的寫法是:

LazyScrollViewCustomView *label = (LazyScrollViewCustomView *)[scrollView dequeueReusableItemWithIdentifier:@"testView"];
    NSInteger index = [muiID integerValue];
    if (!label)
    {
        label = [[LazyScrollViewCustomView alloc]initWithFrame:[(NSValue *)[rectArray objectAtIndex:index]CGRectValue]];
        label.textAlignment = NSTextAlignmentCenter;
        label.reuseIdentifier = @"testView";
    }
    label.frame = [(NSValue *)[rectArray objectAtIndex:index]CGRectValue];
    label.text = [NSString stringWithFormat:@"%lu",(unsigned long)index];

流程是:先取一下復(fù)用池中可復(fù)用的View,有的話牧嫉,賦給對(duì)應(yīng)的frame剂跟,沒有的話,生成一個(gè)酣藻,并給予一個(gè)復(fù)用標(biāo)記曹洽。

在 LazyScrollView 中聲明的一個(gè)對(duì)UIView 的 category 中包含了 reuseIdentifier,可以給任意的View綁定這個(gè)屬性辽剧。如果沒有賦值reuseIdentifier或者給一個(gè)nil/空字符串送淆,會(huì)認(rèn)為這個(gè)組件不復(fù)用。

刷新視圖

設(shè)置一下contentSize 怕轿, 并且Reload一下即可偷崩。

scrollview.contentSize = CGSizeMake(CGRectGetWidth(self.view.bounds), 1230);
 [scrollview reloadData];

視圖生命周期

Demo中的LazyScrollViewCustomView實(shí)現(xiàn)了TMMuiLazyScrollViewCellProtocol的三個(gè)方法,可以在組件的生命周期的時(shí)候執(zhí)行相關(guān)代碼

- (void)mui_prepareForReuse

在即將被復(fù)用時(shí)調(diào)用撞羽,通常用于清空View內(nèi)展示的數(shù)據(jù)阐斜。類似與UITableViewCell 的 prepareForReuse

- (void)mui_didEnterWithTimes:(NSUInteger)times

進(jìn)入屏幕LazyScroll可視范圍內(nèi)時(shí)執(zhí)行,times是進(jìn)入可視范圍的次數(shù)诀紊,從0開始谒出。重置times可以調(diào)用LazyScrollView的resetViewEnterTimes重置times

- (void)mui_afterGetView

LazyScroll獲取到View后執(zhí)行。也就是執(zhí)行完- (UIView *)scrollView:(TMMuiLazyScrollView *)scrollView itemByMuiID:(NSString *)muiID方法獲取到視圖之后邻奠。

和didEnterWithTimes的區(qū)別是到推,因?yàn)長(zhǎng)azyScrollView有一個(gè)RenderBuffer的概念,實(shí)際渲染的視圖比可視范圍上下各增加了20個(gè)像素惕澎,使得展示更加流暢莉测。afterGetView會(huì)執(zhí)行的更早。

后續(xù)

LazyScrollView 屬于相對(duì)底層的視圖層唧喉,在復(fù)用上提供的比較高的靈活度捣卤。一些更高程度的封裝,比如類似UICollection的Layout八孝,對(duì)復(fù)用更簡(jiǎn)易的管理董朝,對(duì)組件的解析、賦值等管理干跛,我們都放在了Tangram里面子姜,關(guān)于Tangram 可見 http://pingguohe.net/2016/12/20/Tangram-design-and-practice.html

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市楼入,隨后出現(xiàn)的幾起案子哥捕,更是在濱河造成了極大的恐慌牧抽,老刑警劉巖,帶你破解...
    沈念sama閱讀 218,640評(píng)論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件遥赚,死亡現(xiàn)場(chǎng)離奇詭異扬舒,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)凫佛,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,254評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門讲坎,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人愧薛,你說(shuō)我怎么就攤上這事晨炕。” “怎么了毫炉?”我有些...
    開封第一講書人閱讀 165,011評(píng)論 0 355
  • 文/不壞的土叔 我叫張陵府瞄,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我碘箍,道長(zhǎng)遵馆,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,755評(píng)論 1 294
  • 正文 為了忘掉前任丰榴,我火速辦了婚禮货邓,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘四濒。我一直安慰自己换况,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,774評(píng)論 6 392
  • 文/花漫 我一把揭開白布盗蟆。 她就那樣靜靜地躺著戈二,像睡著了一般。 火紅的嫁衣襯著肌膚如雪喳资。 梳的紋絲不亂的頭發(fā)上觉吭,一...
    開封第一講書人閱讀 51,610評(píng)論 1 305
  • 那天,我揣著相機(jī)與錄音仆邓,去河邊找鬼鲜滩。 笑死,一個(gè)胖子當(dāng)著我的面吹牛节值,可吹牛的內(nèi)容都是我干的徙硅。 我是一名探鬼主播,決...
    沈念sama閱讀 40,352評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼搞疗,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼嗓蘑!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,257評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤桩皿,失蹤者是張志新(化名)和其女友劉穎豌汇,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體业簿,經(jīng)...
    沈念sama閱讀 45,717評(píng)論 1 315
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,894評(píng)論 3 336
  • 正文 我和宋清朗相戀三年阳懂,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了梅尤。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 40,021評(píng)論 1 350
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡岩调,死狀恐怖巷燥,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情号枕,我是刑警寧澤缰揪,帶...
    沈念sama閱讀 35,735評(píng)論 5 346
  • 正文 年R本政府宣布,位于F島的核電站葱淳,受9級(jí)特大地震影響钝腺,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜赞厕,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,354評(píng)論 3 330
  • 文/蒙蒙 一艳狐、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧皿桑,春花似錦毫目、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,936評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至沟绪,卻和暖如春刮便,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背绽慈。 一陣腳步聲響...
    開封第一講書人閱讀 33,054評(píng)論 1 270
  • 我被黑心中介騙來(lái)泰國(guó)打工诺核, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人久信。 一個(gè)月前我還...
    沈念sama閱讀 48,224評(píng)論 3 371
  • 正文 我出身青樓窖杀,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親裙士。 傳聞我的和親對(duì)象是個(gè)殘疾皇子入客,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,974評(píng)論 2 355

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