1. 程式人生 > >CoordinateLayout 自定義Behavior 仿百度外賣效果 實踐

CoordinateLayout 自定義Behavior 仿百度外賣效果 實踐

高仿百度外賣效果

程式碼地址:https://github.com/yaodiwei/CoordinatorLayoutTester

真百度外賣效果

自定義Behavior一半分為兩種型別

一種是重寫layoutDependsOn和onDependentViewChanged。然後根據dependency控制元件的大小或位置的改變,來使自己的控制元件改變。

一種是重寫onStartNestedScroll、onNestedPreScroll和onNestedScroll等跟scroll相關的方法。這個是針對一些NestedScrollView或RecyclerView這些只會內部滑動而不會改變自身大小和位置的控制元件。

關於自定義Behavior的介紹文章。有兩篇在用法方面介紹的很好。

關於這個仿百度外賣的控制元件,我本來是用第二種方法的。但是後來發現在 onNestedPreFling 方法上,不會回撥多次。所以最後只能在NestedScrollView.setOnScrollChangeListener 這個監聽類的 onScrollChange 方法上了。搞的最後好像跟 Behavior 沒多大關係.........

註釋都放在程式碼裡了,這裡實現該效果主要是依靠 HeaderBehavior 這個類。

放『附近商戶』和『此刻最熱』的稱為MiddleContent。裡面分為3部分

  1. MiddleContent 還處於在標題欄底下
  2. MiddleContent 已經和標題欄有重疊,屬於變形階段
  3. MiddleContent 在螢幕上方了,此時 MiddleContent 需要固定在標題欄上。

關鍵點幾個,

第二步時,需要把標題欄的背景顏色變透明。

第三步時,需要把 MiddleContent 這個 View 移動到標題欄上,就是parentView.removeView和addView方法。

還有在這3步狀態轉換時,要把所有的 View 重置,不然有時滾太快會讓這些 View 處於中間狀態。

程式碼地址:https://github.com/yaodiwei/CoordinatorLayoutTester