輕松學(xué)習(xí)之四--最簡化原生效果集成UITableViewCell左滑多個(gè)按鈕

側(cè)滑刪除是iOS中非常容易實(shí)現(xiàn)的一種效果,你只需要為你的UITableViewDataSource重寫這個(gè)方法,系統(tǒng)就會(huì)自動(dòng)添加這種操作。

    - (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath
gif_01.gif

從iOS8開始,蘋果開放了這樣一個(gè)API:

- (nullable NSArray<UITableViewRowAction *> *)tableView:(UITableView *)tableView editActionsForRowAtIndexPath:(NSIndexPath *)indexPath

返回一個(gè)UITableViewRowAction數(shù)組,每一個(gè)"Action"代表一個(gè)側(cè)滑刪除的Button。這樣側(cè)滑每一行Cell可以有更多按鈕提供給用戶交互。

gif_02.gif

不幸地是這個(gè)API只在iOS8才有,這樣iOS8以下就沒辦法使用到這種效果。這種情況下我們不得不使用第三方庫或者自己重寫UITableViewCell來“模擬”出這種效果,當(dāng)然有幾個(gè)庫在側(cè)滑控件上已經(jīng)做得非常成熟了(這里我就推薦一個(gè)精品:https://github.com/MortimerGoro/MGSwipeTableCell 支持多種側(cè)滑模式,算得上是側(cè)滑控件里的瑪莎拉蒂)。


但是,如果你跟我一樣,更喜歡蘋果的原生效果,又想在iOS8系統(tǒng)以下使用,那么你也許可以試下這個(gè)庫 JZTableViewRowAction https://github.com/JazysYu/JZTableViewRowAction
只要拖兩個(gè).m文件到工程里,你的iOS8以下設(shè)備也就會(huì)自動(dòng)集成這種效果了。


雖然我還是建議你至少要下載使用一次并閱讀一下我的源碼,不過你仍然可以在沒有任何準(zhǔn)備的情況下來看下面的講解(下面的內(nèi)容只圍繞iOS8系統(tǒng)版本以下):

我的做法是,在側(cè)滑出來的View(那個(gè)紅色的"Delete" button),上面增加若干個(gè)我們想要的Button,所以需要找到一個(gè)合適的時(shí)機(jī)去做這個(gè)事情,我們知道,UITableViewCell有一個(gè)

- (void)willTransitionToState:(UITableViewCellStateMask)state

方法,當(dāng)用戶在某一行剛開始進(jìn)行側(cè)滑并且側(cè)滑的Button還沒有展現(xiàn)出來時(shí),state的值就為 UITableViewCellStateShowingDeleteConfirmationMask,這個(gè)時(shí)機(jī)就再合適不過,但是,由于Cell的側(cè)滑View是懶加載,所以這時(shí)它還沒有被創(chuàng)建出來,但要等到與之對應(yīng)的方法

- (void)didTransitionToState:(UITableViewCellStateMask)state

調(diào)用的話,卻又已經(jīng)展現(xiàn)給用戶了,為時(shí)已晚,能想到的最好、最穩(wěn)定的時(shí)機(jī)就是只要一過 willTransitionToState:這個(gè)方法,就開始“改造”這個(gè)View,所以最好的辦法就是延時(shí),只要這個(gè)方法一過,側(cè)滑的View就會(huì)被創(chuàng)建了,之后我們可以通過遍歷UICollectionViewCell的Subviews找到這個(gè)View,我們在這里模擬UITableView調(diào)用一次UITableViewDataSource的這個(gè)方法來獲取外部創(chuàng)建的UITableViewRowAction數(shù)組:

- (nullable NSArray<UITableViewRowAction *> *)tableView:(UITableView *)tableView editActionsForRowAtIndexPath:(NSIndexPath *)indexPath
pic_01.png

根據(jù)數(shù)組里的每一個(gè)"rowAction"在這個(gè)View上面增加對應(yīng)個(gè)數(shù)的UIButton就可以了。

但是這樣返回的數(shù)組會(huì)永遠(yuǎn)是空,沒錯(cuò),因?yàn)?code>UITableViewRowAction這個(gè)類在iOS8以下根本不存在,所以我們需要自己創(chuàng)建一個(gè)叫做UITableViewRowAction的類,再把它當(dāng)作普通NSObject幫我們儲(chǔ)存一些信息就好了,于是,在閱讀@我就叫Sunny怎么了FDStuckView源碼后給我?guī)砹嗽S多靈感,按照他的思路,我們新建一個(gè)與UITableViewRowAction接口一模一樣的類JZTableViewRowAction,在程序運(yùn)行時(shí)創(chuàng)建一個(gè)叫UITableViewRowAction的類作為JZTableViewRowAction的子類,最后把它注冊到運(yùn)行時(shí)中去,這樣我們就擁有了一個(gè)“很像”UITableViewRowAction類。

pic_03.png

pic_02.png

這里可能有些朋友會(huì)有疑問,為什么要?jiǎng)?chuàng)建一個(gè)JZTableViewRowAction并且根本沒有用到?這個(gè)問題可以這樣回答你:如果你不創(chuàng)建它的話,你就需要寫更多的運(yùn)行時(shí)代碼來為你新創(chuàng)建的UITableViewRowAction增加方法、屬性等等,所以,相比于這個(gè)情況,我更喜歡利用繼承的特性來做。這樣就實(shí)現(xiàn)了我們想要的效果:

gif_03.gif

最后JZTableViewRowAction同時(shí)也支持給側(cè)滑控件的按鈕設(shè)置圖片,設(shè)置enable狀態(tài),除非必要,未來也許會(huì)增加更多可自定義接口,歡迎學(xué)習(xí)或使用 https://github.com/JazysYu/JZTableViewRowAction

我更喜歡寫一些拋磚引玉的文章分享給大家,希望能給大家?guī)硇┰S靈感,也歡迎微博@J_雨 一起探討。One should coding to live,not live to coding :-).

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

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

  • 發(fā)現(xiàn) 關(guān)注 消息 iOS 第三方庫、插件、知名博客總結(jié) 作者大灰狼的小綿羊哥哥關(guān)注 2017.06.26 09:4...
    肇東周閱讀 12,198評論 4 61
  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 173,024評論 25 708
  • 生活真的很像一場戲 一眨眼我們也就17,18歲啦 現(xiàn)在好像可以把一生看透? 就是隨流?讀書實(shí)習(xí)工作結(jié)婚生子變老 哈...
    我有句話想和你說閱讀 247評論 0 0
  • 馬上就要初冬了,秋季似乎沒有留下什么。 有些抱怨工作的壓力,也有些對疾病的恐懼。 習(xí)慣了生活,也習(xí)慣了這個(gè)年紀(jì)。 ...
    jinlei_1523閱讀 240評論 0 1
  • IMSong閱讀 370評論 0 0