???? 小菜最近接到一個(gè)任務(wù),實(shí)現(xiàn)包括波浪條的可折疊的ToolBar饺鹃,準(zhǔn)備用CollapsingToolbarLayout來(lái)嘗試一下:
? ? 1. 根據(jù)使用手冊(cè)和網(wǎng)上大神們的例子莫秆,布局文件中 CollapsingToolbarLayout 里面添加需要展示的 Toolbar 和其他需要展示的控件,包括文字圖片和需要自定義的波浪 View悔详;
? ? 2. CollapsingToolbarLayout 中镊屎,需要設(shè)置 layout_scrollFlags 中 scroll(滾動(dòng))/enterAlways(實(shí)現(xiàn) quick return 效果, 當(dāng)向下移動(dòng)時(shí),立即顯示View)/exitUntilCollapsed(向上滾動(dòng)時(shí)收縮View茄螃,但可以固定Toolbar一直在上面)/enterAlwaysCollapsed(當(dāng)View已經(jīng)設(shè)置minHeight屬性又使用此標(biāo)志時(shí)缝驳,你的View只能以最小高度進(jìn)入,只有當(dāng)滾動(dòng)視圖到達(dá)頂部時(shí)才擴(kuò)大到完整高度)归苍;
? ? ? CollapsingToolbarLayout 里面的控件一般需要設(shè)置:
????? (1) layout_collapseMode (折疊模式) -有兩個(gè)值:
??????????? pin -設(shè)置為這個(gè)模式時(shí)用狱,當(dāng)CollapsingToolbarLayout完全收縮后,Toolbar還可以保留在屏幕上拼弃;
??????????? parallax -設(shè)置為這個(gè)模式時(shí)夏伊,在內(nèi)容滾動(dòng)時(shí),CollapsingToolbarLayout中的View(比如ImageView)也可以同時(shí)滾動(dòng)吻氧,實(shí)現(xiàn)視差滾動(dòng)效果溺忧,通常和layout_collapseParallaxMultiplier(設(shè)置視差因子)搭配使用。
?????? (2) layout_collapseParallaxMultiplier(視差因子) - 設(shè)置視差滾動(dòng)因子盯孙,值為:0~1
? ? 3. 設(shè)置相應(yīng)的展示效果(字體或圖片的展示大小/顏色/屬性等以及卡片展開(kāi)壓縮的效果)鲁森;
? ? 4. 根據(jù)需求繪制一個(gè)波浪效果,應(yīng)用余玄函數(shù)進(jìn)行繪制镀梭;
? ? 5. 設(shè)置RecycleView刀森,添加數(shù)據(jù)等
其中有兩點(diǎn)需要注意:
1. 這個(gè)效果一定要建立在沒(méi)有標(biāo)題欄的主題下 android:theme="@style/AppTheme.NoActionBar"
2. 如果運(yùn)行過(guò)程中提示找不到屬性之類的, CollapsingToolbarLayout 使用時(shí)需要引入 android.support.design 的 lib报账,步驟如下:
? (1) File --> Progect Structure --> Dependencies
? (2) 搜索 design 等關(guān)鍵字研底,找到相應(yīng)的 libs,添加即可
? ? 實(shí)際的顯示效果透罢,例如 pin 與 parallax 的區(qū)別榜晦;視覺(jué)因子的大小羽圃;顏色值和展示位置等乾胶,需要大家根據(jù)實(shí)際情況調(diào)試,按需要展示朽寞。小菜的實(shí)際效果: