favimg
FMChannelEdit
這是一個類似“今日頭條”頻道編輯功能
前言
- 站在巨人的肩膀上編程:這個項目的channel編輯頁面是在兩位前輩代碼的基礎上,進一步的修改,封裝。
前輩一:codeWorm2015(GitHubID)
源碼地址
前輩二:HelloYeah(GitHubID)
源碼地址
PS:這兩位具體是誰,我也不認識,想和他們具體交流的,請去GitHub上給他們留言,我這能幫你們到這了。
進入正題 (以下均為個人見解,理解不對還望見諒)
- 之所以用著兩位前輩的代碼,是因為,雖然實現是同一UI效果,但是思路不同,下面一一講解
方式一:(對應前輩一的實現思路)
思路:完全自定義。自定義channelView(項目中名稱:TouchView)繼承于UIView,綁定需要的label,imageView,pan,tap,longPress手勢,在對應的手勢實現中計算出每個channel的index,然后刷新frame(具體實現請參考代碼)
優點:自定義程度高,自定義功能的添加修改比較方便,尤其動畫比較流暢;
缺點:要同時處理四個數組的數據(兩個數據源的,兩個視圖的),frame刷新頻率較高,且都是自己實現的frame刷新,性能可能不如原生的控件(只是可能)
我的完善:原框架功能已經比較完善,只是缺少個下滑移除功能(已添加)
GIF效果圖:
ChannelDemo1.gif
方式二:(對應前輩二的實現思路)
思路:在UICollectionView的基礎上進一步的修改封裝。(具體實現請參考代碼)
優點:只需要處理兩個數據源就可以(上部&下部),視圖由UICollectionView自己處理,包括動畫效果也是系統自己完成;
缺點:基于UICollectionView,功能的拓展受到一定的限制,動畫不如方式一看這舒服。
我的完善:原框架功能較少(相對于今日頭條的channel編輯效果),只有上部分的排序和刪除。(下部及其他功能已添加)
GIF效果圖:
ChannelDemo2.gif
其他功能
- 標題內容對應滑動,滑動后標題居中
- 標題隨滑動,字體大小變化
- 子視圖內,有顏色漸變小Demo
GIF效果圖:
ChannelDemo3.gif
- QQ Popover彈框效果
GIF效果圖:
ChannelDemo4.gif
ChannelDemo5.gif