如何寫一套下拉刷新的控件?《MJRefresh原理淺析》

相信大家有很多人在做項目的時候都在使用MJRefresh控件來實現(xiàn)下拉刷新的功能;

MJRefresh經(jīng)過不斷的重構(gòu)與更新迭代栅炒,現(xiàn)在不管是功能上還是代碼結(jié)構(gòu)上都是相當(dāng)不錯的,都是很值我們?nèi)W(xué)習(xí)的.

下面就是MJRefresh開源框架中中主要的一些類文件

MJRefresh主要的類文件

MJRefresh的使用相信都難不倒大家

今天我主要想和大家分享一下MJRefresh的想法术羔,因為我覺得這才是最重要的,獻丑了赢赊,有理解的不對和不深入的地方,請大家多多點評哈级历!

試想释移,如果沒有MJRefresh開源框架,公司讓你來寫這樣一個框架寥殖?

你應(yīng)該怎么寫玩讳?

應(yīng)該從哪幾個方面考慮?

應(yīng)該怎么下手嚼贡?

應(yīng)該注意一些什么熏纯?

下面我分了六個步驟給大家說一下

第 1 步: 主要說了一下大體思路和注意事項

第 2 步:為什么使用UIScrollView ?

第 3 步:如何給UIScrollView增加新的屬性header 粤策?

第 4 步:Header類里主要寫一些什么? 樟澜?

第 5 步:如何利用KVO的方式來監(jiān)聽偏移量的變化(設(shè)置刷新狀態(tài))?

第 6 步:實例化Header類的對象 去給 UIScrollView的屬性header賦值 叮盘?

step1:

如果想給UITableView 和UICollectionView 增加下拉刷新 上提加載的功能

其實不要想的太復(fù)雜秩贰,其實就是給他們:

1.先增加一個頭視圖(header) 和 尾視圖(footer)

2.然后就是考慮狀態(tài)的變化(正在刷新啊,刷新完成叭岷稹)毒费,通過偏移量來判斷

3.最后給這些狀態(tài)設(shè)置一些監(jiān)聽事件(下拉刷新的時候調(diào)用什么方法,沒有數(shù)據(jù)了調(diào)用什么方法等)

如果能實現(xiàn)上面幾點的話愈魏,一個簡單粗糙的下拉刷新的控件就可以實現(xiàn)了

但是具體操作的時候我們還是要考慮幾點問題:

1.首先要滿足以后能夠很方便給TableView和CollectionView的去增加這個特性蝗罗,

2.能夠很好的去適配最新的SDK

3.增加特性后要減少甚至避免此特性(下拉刷新)不與其它UI控件和其他特性發(fā)生沖突

根據(jù)上面的幾點問題我們有以下兩種選擇:

1.自己重寫一套UIScrollView并且加上下拉刷新的特性(但是很有難度,不建議這樣);

2.最好的方式是使用IOS的特性Category來增加下拉刷新的功能(選擇這種方式來實現(xiàn));

step2:

接下來我們要考慮的就是給TableView加還是給UICollectionView?(其實很簡單蝌戒,大神們可以忽略這個問題)我們選擇的是UIScrollView

為什么使用ScrollView串塑?而不使用TableView 和 CollectionView增加Category ? __

大家應(yīng)該都知道 UITableView 和 UICollectionView 都是繼承于 ScrollView

如果我們使用UIScrollView的話,以后不管是tableView 和 CollectionView都可以直接使用下拉刷新的特性

但我們?nèi)绻褂肬ITableView的話北苟,我們肯定還必須為UICollectionView 寫一套新的下拉刷新的方法;

使用UIScrollView 會很大程度上提高我們這個下拉組件的延展性和兼容性__

step3:

接下來就是需要來考慮我們?nèi)绾问褂肬IScrollView和Catgory的特性來增加下拉刷新和上提加載的功能 ? ? ?

滿足下面兩點:

1.下拉刷新桩匪?上提加載?

2.為了方便以后容易使用?

最好的方式是給UIScrollView 添加兩個屬性 一個是header 一個是Footer 友鼻,這樣以后就可以直接利用這兩個屬性做事情了傻昙;

這個時候我們就需要考慮給UIScrollView添加屬性了,如何給UIScrollView添加屬性?

有點IOS基礎(chǔ)的應(yīng)該都知道闺骚,我們不能直接給Category添加屬性;

但是可用通過采用動態(tài)添加屬性的方法objc_setAssociatedObject()和objc_getAssociatedObject()函數(shù)給UIScrollView動態(tài)添加屬性

這是一種關(guān)聯(lián)對象的技巧(AssociatedObject)

給UIScrollView增加header屬性

當(dāng)然添加Footer的方法也是這樣妆档,添加Footer的時候只需要修改一下Key 就好僻爽,就先不講Footer的實現(xiàn)了

step4:

既然添加完屬性,那此時我們就需要想著如何給屬性賦值贾惦?

所以接下來我們的工作就是寫一個header的類

然后用Header類的對象給我們新增加的scrollView的header屬性賦值

#當(dāng)然現(xiàn)在MJRefresh這個框架已經(jīng)進行了代碼重構(gòu)胸梆,現(xiàn)在框架的結(jié)構(gòu)比較清晰,但是對一些剛開始接觸IOS的同學(xué)看起來就會有些費勁了_#現(xiàn)在咱們只講一些主要的代碼须板,先不考慮MJRefresh的代碼結(jié)構(gòu)#因為它現(xiàn)在的代碼是重構(gòu)之后的碰镜,而咱們現(xiàn)在講的是實現(xiàn)的思路#先按照我們正常的思路來分析一下

首先創(chuàng)建一個類Header去繼承UIView 但header類里面要寫什么呢?

1.首先肯定少不了一些主要的布局 如 下拉的ImageView习瑰,以及UIActivityIndicatorView等

2.其次是 下拉刷新那一塊會有很多的狀態(tài)的變化绪颖,比如 正在刷新中,刷新完成甜奄,剛開始刷新等狀態(tài)的判斷柠横,(這些狀態(tài)我們需要通過 UIScrollView 的偏移量來計算這些狀態(tài)。這一塊主要就是一些邏輯判斷课兄,如何計算這次暫時不講了

3.最后就是看需求了牍氛,如果需要時間的加時間,需要GIF的加GIF動畫第喳;

普通的Header

帶GIF的header

step5:

如何計算刷新狀態(tài)呢 ?

所以此時我們不得不需要另一個知識點:事件監(jiān)聽(監(jiān)聽 UIScrollView的偏移量變化情況);

說到監(jiān)聽的話踱稍,IOS有幾種經(jīng)典的方式用來監(jiān)聽(以后有時間會給大家講一下它們的優(yōu)缺點和用法):

1.KVO

2.NSNotificationCenter

3.Delegate等

MJRefresh中使用的是KVO的方式監(jiān)聽偏移量:

下面的willMoveToSuperView方法中傳過來的newSuperView是你實現(xiàn)此功能的UITableView 和 UICollectionView的對象曲饱,此方法只在設(shè)置tableView的下拉和上提的時候執(zhí)行一次(或者說只在當(dāng)前頁面初始化的時候執(zhí)行一次);

此時我們通過 addObserver forKeyPath 的方式監(jiān)聽了ContentOffset的變化

設(shè)置偏移量監(jiān)聽

由于我們在上面設(shè)置了偏移量的監(jiān)聽珠月,那么當(dāng)UIScrollView的偏移量變化時扩淀,都會執(zhí)行 observerValueForKeyPath方法

在這里面我們可以做一系列的邏輯判斷,比如 刷新狀態(tài)的變化啤挎,一些動畫效果什么的(具體的判斷就不說了驻谆,不然就就偏離了這篇文章的主題)

監(jiān)聽事件的執(zhí)行

具體的偏移量變化判斷暫不講解;

偏移量邏輯判斷方法

step6:

至此庆聘,我們基本上就把MJRefresh的下拉刷新的實現(xiàn)的大體流程給過了一遍胜臊,以后如果想豐富一下MJRefresh的話,比如增加時間的變化伙判,或者增加GIF圖片的效果象对,我覺得都不是太難的問題了,因為框架已經(jīng)搭起來了以后想往里面塞什么東西宴抚,那就看需求了

最后我們要做的就是 寫一個方法去實例化一個header的對象勒魔,然后將這個對象賦值給我們的UIScrollView的header屬性

實例化一個header的對象

這樣就可以實現(xiàn)一個簡單的下拉刷新控件

這邊文章主要講了一下我們寫MJRefresh的思路甫煞,沒有講一些具體實現(xiàn)方法

個人認(rèn)為 編程重要的是思路,是想法冠绢,把想法理解透了抚吠,以后不管是OC 還是Android 還是Java PHP都是可以用的上的

以上只是個人對MJRefresh的理解,有一些理解不到的地方希望大家多多指教弟胀,多多批評

鏈接:http://www.reibang.com/p/9d5a3c543768

來源:簡書

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末楷力,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子邮利,更是在濱河造成了極大的恐慌弥雹,老刑警劉巖,帶你破解...
    沈念sama閱讀 217,185評論 6 503
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件延届,死亡現(xiàn)場離奇詭異剪勿,居然都是意外死亡,警方通過查閱死者的電腦和手機方庭,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,652評論 3 393
  • 文/潘曉璐 我一進店門厕吉,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人械念,你說我怎么就攤上這事头朱。” “怎么了龄减?”我有些...
    開封第一講書人閱讀 163,524評論 0 353
  • 文/不壞的土叔 我叫張陵项钮,是天一觀的道長。 經(jīng)常有香客問我希停,道長烁巫,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,339評論 1 293
  • 正文 為了忘掉前任宠能,我火速辦了婚禮亚隙,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘违崇。我一直安慰自己阿弃,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 67,387評論 6 391
  • 文/花漫 我一把揭開白布羞延。 她就那樣靜靜地躺著渣淳,像睡著了一般。 火紅的嫁衣襯著肌膚如雪伴箩。 梳的紋絲不亂的頭發(fā)上水由,一...
    開封第一講書人閱讀 51,287評論 1 301
  • 那天,我揣著相機與錄音,去河邊找鬼砂客。 笑死泥张,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的鞠值。 我是一名探鬼主播媚创,決...
    沈念sama閱讀 40,130評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼彤恶!你這毒婦竟也來了钞钙?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 38,985評論 0 275
  • 序言:老撾萬榮一對情侶失蹤声离,失蹤者是張志新(化名)和其女友劉穎芒炼,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體术徊,經(jīng)...
    沈念sama閱讀 45,420評論 1 313
  • 正文 獨居荒郊野嶺守林人離奇死亡本刽,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,617評論 3 334
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了赠涮。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片子寓。...
    茶點故事閱讀 39,779評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖笋除,靈堂內(nèi)的尸體忽然破棺而出斜友,到底是詐尸還是另有隱情,我是刑警寧澤垃它,帶...
    沈念sama閱讀 35,477評論 5 345
  • 正文 年R本政府宣布鲜屏,位于F島的核電站,受9級特大地震影響国拇,放射性物質(zhì)發(fā)生泄漏洛史。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,088評論 3 328
  • 文/蒙蒙 一贝奇、第九天 我趴在偏房一處隱蔽的房頂上張望虹菲。 院中可真熱鬧靠胜,春花似錦掉瞳、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,716評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至址愿,卻和暖如春该镣,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背响谓。 一陣腳步聲響...
    開封第一講書人閱讀 32,857評論 1 269
  • 我被黑心中介騙來泰國打工损合, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留省艳,地道東北人。 一個月前我還...
    沈念sama閱讀 47,876評論 2 370
  • 正文 我出身青樓嫁审,卻偏偏與公主長得像跋炕,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子律适,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 44,700評論 2 354

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