用recyclerView實(shí)現(xiàn)最美應(yīng)用底欄

先看效果圖:


效果圖

在實(shí)現(xiàn)這個(gè)效果的時(shí)候,我考慮過使用自定義view或者viewgroup來實(shí)現(xiàn)十艾。但是自定義view有一個(gè)很大的缺陷抵代,關(guān)于上面的條目,都應(yīng)該是從服務(wù)器獲取的忘嫉,不能直接draw bitmap就解決了荤牍。然后就是自己來實(shí)現(xiàn)viewgroup了案腺,用viewgroup來實(shí)現(xiàn)上圖效果并不難。但是view的循環(huán)利用卻是一個(gè)痛點(diǎn)康吵,所以最后我選擇用recyclerview來實(shí)現(xiàn)這個(gè)效果劈榨。

首先你需要了解recyclerView的基本使用,參考鴻洋blog:傳送門

接下來晦嵌,我們來拆解這個(gè)效果同辣。(recyclerView以下簡稱為rv)

1.至少,先把控件View展示出來惭载。這里可以直觀的看到旱函,每一個(gè)item占rv的寬度1/7.在rv的設(shè)計(jì)初衷里,對于item的布局描滔,測量棒妨,回收等都托付給layoutmanager來實(shí)現(xiàn)。所以我們要寫一個(gè)layoutmanager來展示item含长。說實(shí)話券腔,這是塊很難啃的骨頭,我現(xiàn)在也是一知半解拘泞。參考:傳送門這個(gè)博主寫的很詳細(xì)纷纫,我這里不再贅述,直接看關(guān)鍵代碼陪腌。


測量item

上面把每個(gè)item設(shè)置為寬度的1/7.


把item縮起來

在這個(gè)效果中辱魁,與其他layoutmanager不同的關(guān)鍵點(diǎn)就在這里,固定分配1/7的寬度偷厦,把item縮下去商叹。其他的滾動,回收基本一個(gè)套路只泼,請看上面那個(gè)傳送門剖笙。

2.擴(kuò)展自己的recyclerView。主要流程分析:觸屏事件:點(diǎn)擊一個(gè)item请唱,從這個(gè)item開始向兩邊梯度下降item弥咪。放開后,兩側(cè)item下落回到原點(diǎn)十绑。然后判斷要不要滾動聚至,把選中的item滾到中間。切換事件:提供兩個(gè)方法切換上一個(gè)下一個(gè)本橙。都是先把當(dāng)前選中的item落下扳躬,升起上一個(gè)或下一個(gè)item,然后判斷要不要滾動到中間。

反正這個(gè)效果不需要用戶通過touch事件滑動rv贷币,所以我們直接setOnTouchListener覆蓋rv原有的touch邏輯击胜。

點(diǎn)擊和移動事件

上面是實(shí)現(xiàn)梯度的關(guān)鍵,通過判斷間距來設(shè)置translationY役纹。需要注意的是rv.getChildAt 這個(gè)方法偶摔,所傳的參數(shù)是從第一個(gè)可視item開始算的,相對于第一個(gè)可視item的位置促脉,并不是所有數(shù)據(jù)的序號辰斋。

記錄選擇的item,回調(diào)

開始下落動畫瘸味,下落完成后判斷滾動

下落動畫
滾動

smoothScrollBy是可以傳超過滾動范圍的值的宫仗,它內(nèi)部已經(jīng)幫你處理好了,我這里就不再判斷了硫戈。

然后是提供外部調(diào)用的切換方法

落下選擇的item


升起下一個(gè)item锰什,并判斷要不要滾動

基本流程如上。我知道這樣子看會一頭霧水丁逝,所以這里給出可以運(yùn)行的demo:github?求star~

一點(diǎn)小事:坐標(biāo)廣州,有需要實(shí)習(xí)生梭姓,初級android開發(fā)么霜幼,2017屆應(yīng)屆生。請聯(lián)系我誉尖!

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末罪既,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子铡恕,更是在濱河造成了極大的恐慌琢感,老刑警劉巖,帶你破解...
    沈念sama閱讀 222,183評論 6 516
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件探熔,死亡現(xiàn)場離奇詭異驹针,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)诀艰,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,850評論 3 399
  • 文/潘曉璐 我一進(jìn)店門柬甥,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人其垄,你說我怎么就攤上這事苛蒲。” “怎么了绿满?”我有些...
    開封第一講書人閱讀 168,766評論 0 361
  • 文/不壞的土叔 我叫張陵臂外,是天一觀的道長。 經(jīng)常有香客問我,道長漏健,這世上最難降的妖魔是什么嚎货? 我笑而不...
    開封第一講書人閱讀 59,854評論 1 299
  • 正文 為了忘掉前任,我火速辦了婚禮漾肮,結(jié)果婚禮上厂抖,老公的妹妹穿的比我還像新娘。我一直安慰自己克懊,他們只是感情好忱辅,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,871評論 6 398
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著谭溉,像睡著了一般墙懂。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上扮念,一...
    開封第一講書人閱讀 52,457評論 1 311
  • 那天损搬,我揣著相機(jī)與錄音,去河邊找鬼柜与。 笑死巧勤,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的弄匕。 我是一名探鬼主播颅悉,決...
    沈念sama閱讀 40,999評論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼迁匠!你這毒婦竟也來了剩瓶?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,914評論 0 277
  • 序言:老撾萬榮一對情侶失蹤城丧,失蹤者是張志新(化名)和其女友劉穎延曙,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體亡哄,經(jīng)...
    沈念sama閱讀 46,465評論 1 319
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡枝缔,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,543評論 3 342
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了磺平。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片魂仍。...
    茶點(diǎn)故事閱讀 40,675評論 1 353
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖拣挪,靈堂內(nèi)的尸體忽然破棺而出擦酌,到底是詐尸還是另有隱情,我是刑警寧澤菠劝,帶...
    沈念sama閱讀 36,354評論 5 351
  • 正文 年R本政府宣布赊舶,位于F島的核電站,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏笼平。R本人自食惡果不足惜园骆,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,029評論 3 335
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望寓调。 院中可真熱鬧锌唾,春花似錦、人聲如沸夺英。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,514評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽痛悯。三九已至余黎,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間载萌,已是汗流浹背惧财。 一陣腳步聲響...
    開封第一講書人閱讀 33,616評論 1 274
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留扭仁,地道東北人垮衷。 一個(gè)月前我還...
    沈念sama閱讀 49,091評論 3 378
  • 正文 我出身青樓,卻偏偏與公主長得像乖坠,于是被迫代替她去往敵國和親帘靡。 傳聞我的和親對象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,685評論 2 360

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