Android側滑(右滑、下拉)返回控制元件 - SwipeBackLayout

1004145468發表於2018-09-01
Android控制元件

1. 知識背景

專案中常用的側滑返回控制元件大部分都是通過內部封裝ViewDragHelper進行View拖拽實現的，而採用ViewDragHelper的方式必然會帶來另外兩個問題：

  • Q1：什麼樣的右滑才是退出介面，而不是滑動介面內容？

  • A1：ViewDragHelper傳入引數View作為ControllerView，通過改變它的佈局引數實現拖拽效果。為了達到Activity右滑返回的能力，那麼ControllerView可以是PhoneWindow下DecorView的子View，即ContentView，並將Activity的背景為透明，當ContentView被移出螢幕時，finish當前的Activity，這樣就實現了全屏右滑返回。理想的情況下一切都正常，但是當介面中存在滑動控制元件時，那麼棘手的滑動衝突的問題就出現。作為基本庫的封裝，為了儘量的避免這一問題，就需要將右滑觸發ContentView移動的條件設定得更為苛刻，恰恰ViewDragHelper為建立這一苛刻條件提供了幫助，通過ViewDragHelper設定setEdgeTrackingEnabled(ViewDragHelper.EDGE_LEFT)，即只在View的邊緣(可調整寬度)開始滑動才認為是拖拽。總之，通過ViewDragHelper實現的側滑返回有一個現象就是隻能在邊緣觸發。

  • Q2: 當Activity邊緣恰好有能右滑的控制元件，右滑時卻無法滑動該控制元件，而是導致應用退出，那麼滑動衝突問題真的沒解了麼？

  • A2: No~， 解決的辦法還是有的，在該自定義控制元件中建立setEnableGesture(boolean enable)方法，通過控制變數的方式來決定是否在ViewDragHelper消費觸控事件之前對觸控事件進行攔截。上層業務程式碼需要呼叫setEnableGesture(boolean)來開啟和禁用Activity側滑的能力，來避免滑動衝突。這種方案雖然是能解決問題，但是這樣的庫封裝就存在不合理性，因為上層業務需要關心底層實現。

2. SwipeBackLayout的優勢

  • 細節處理更優雅，支援全屏滑動返回，並在底層處理滑動衝突，做到讓上層業務對底層實現細節無感知。
  • 封裝完善，SwipeBackLayout提供豐富的控制介面，如果想快速實現介面滑動返回，可直接繼承（HorizontalSwipeBackActivity、VerticalSwipeBackActivity)
  • 採用智慧決策以及手動決策相結合，smartSmoothScroll()能根據當前的滑動所在位置，決策出平滑滑動到起始點還是結束位置；smoothToEnd() 會忽略當前的滑動所在位置，直接平滑到結束位置。

3. SwipeBackLayout屬性控制

  • 1. 是否強制禁用滑動手勢

setSwipeGestureEnable(boolean enable)

  • 2. 設定滑動返回方向

setSwipeOrientation(int orientation)

  • 3. 設定滑動返回敏感度

setSwipeSensitivity(float sensitivity)

  • 4. 設定滑動背景漸變色

setSwipeScrimColor(int color)

  • 5. 設定滑動返回速度

setSwipeSpeed(int duration)

  • 6. 滑動邊緣是否需要顏色加深效果

needSwipeShadow(boolean needShadow)

  • 7. 自動滑動到結尾

smoothToEnd()

  • 8. 智慧滑動（根據當前的偏移量決定滑動到起始還是結尾）

smartSmoothScroll()

  • 9. 滑動監聽
  • addOnSwipeProgressChangedListener(OnSwipeProgressChangedListener listener)
  • removeOnSwipeProgressChangedListener(OnSwipeProgressChangedListener listener)

4. 基於SwipeBackLayout的Activity封裝

  • HorizontalSwipeBackActivity 繼承後可快速實現右滑返回
  • VerticalSwipeBackActivity 繼承後可快速實現左滑返回，預設不帶滑動邊緣加深效果 通過getSwipeLayout() 可獲取SwipeBackLayout的例項

5. 專案整合

Step One:
allprojects {
		repositories {
			...
			maven { url 'https://jitpack.io' }
		}
	}
複製程式碼
Step Two:
dependencies {
	        implementation 'com.github.1004145468:swipeback-android:1.0.1'
	}
複製程式碼

4. 測試Demo

下載地址

相關文章