Android協調佈局CoordinatorLayout 印象筆記
1.題記
本篇文章簡述下常見的協調佈局CoordinatorLayout的內部view之間的關係
2.正文
舉個最常見的佈局例子
<?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" > <android.support.design.widget.AppBarLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> <android.support.design.widget.CollapsingToolbarLayout android:layout_width="match_parent" android:layout_height="wrap_content" app:expandedTitleMarginEnd="64dp" app:expandedTitleMarginStart="48dp" app:layout_scrollFlags="scroll|exitUntilCollapsed"> <ImageView android:id="@+id/main.backdrop" android:layout_width="wrap_content" android:layout_height="300dp" android:scaleType="centerCrop" android:src="@drawable/material_img" app:layout_collapseMode="parallax" /> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?android:attr/actionBarSize" app:layout_collapseMode="pin" /> </android.support.design.widget.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout> <android.support.v4.widget.NestedScrollView android:layout_width="match_parent" android:layout_height="wrap_content" android:paddingTop="50dp" app:layout_behavior="@string/appbar_scrolling_view_behavior"> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="@string/my_txt" android:textSize="20sp" /> </android.support.v4.widget.NestedScrollView> </android.support.design.widget.CoordinatorLayout>
一開始看這個佈局是懵的,覺得就一個標題欄你給做的這麼複雜,嵌套了幾層,非常的不合理。我嘗試著一層層去掉它們的外殼執行看下效果(抱歉,萌新的我都是先看效果再去分析具體原因的),跑起來後發現,噫,標題欄是固定的,並不能像之前那樣隨著下面的NestedScrollView協調滾動,眉頭一緊發現事情並不簡單。
2.1 關於AppBarLayout
那看看這個AppBarLayout究竟是什麼東東,沒有了它為啥標題欄就不能和下面的NestedScrollView協調滾動了,看了api,知道它繼承至LinearLayout:
@CoordinatorLayout.DefaultBehavior(AppBarLayout.Behavior.class) public class AppBarLayout extends LinearLayout { //...todo }
嚯哦,有個很神奇的東西出現了,AppBarLayout通過註解的方式綁定了一個Behavior,Behavior可以說是CoordinatorLayout的非常重要的一個特性了,通過Behavior可以監聽和自定義控制子View的行為,這就是關鍵點,也是為什麼有了AppBarLayout才能協調滾動,沒有AppBarLayout標題欄就固定不動的原因,繼續看Behavior,發現它是AppBarLayout的內部類:
public static class Behavior extends HeaderBehavior<AppBarLayout> {//TODO...}
Behavior繼承自HeaderBehavior,HeaderBehavior裡面重寫觸控事件,伴隨監聽器實時變化:
abstract class HeaderBehavior<V extends View> extends ViewOffsetBehavior<V> {
@Override
public boolean onTouchEvent(CoordinatorLayout parent, V child, MotionEvent ev) {
switch (MotionEventCompat.getActionMasked(ev)) {
case MotionEvent.ACTION_DOWN: {
final int x = (int) ev.getX();
final int y = (int) ev.getY();
if (parent.isPointInChildBounds(child, x, y) && canDragView(child)) {
mLastMotionY = y;
mActivePointerId = MotionEventCompat.getPointerId(ev, 0);
ensureVelocityTracker();
} else {
return false;
}
break;
}
case MotionEvent.ACTION_MOVE: {
final int activePointerIndex = MotionEventCompat.findPointerIndex(ev,
mActivePointerId);
if (activePointerIndex == -1) {
return false;
}
final int y = (int) MotionEventCompat.getY(ev, activePointerIndex);
int dy = mLastMotionY - y;
if (!mIsBeingDragged && Math.abs(dy) > mTouchSlop) {
mIsBeingDragged = true;
if (dy > 0) {
dy -= mTouchSlop;
} else {
dy += mTouchSlop;
}
}
if (mIsBeingDragged) {
mLastMotionY = y;
// We're being dragged so scroll the ABL
scroll(parent, child, dy, getMaxDragOffset(child), 0);
}
break;
}
case MotionEvent.ACTION_UP:
if (mVelocityTracker != null) {
mVelocityTracker.addMovement(ev);
mVelocityTracker.computeCurrentVelocity(1000);
float yvel = VelocityTrackerCompat.getYVelocity(mVelocityTracker,
mActivePointerId);
fling(parent, child, -getScrollRangeForDragFling(child), 0, yvel);
}
// $FALLTHROUGH
case MotionEvent.ACTION_CANCEL: {
mIsBeingDragged = false;
mActivePointerId = INVALID_POINTER;
if (mVelocityTracker != null) {
mVelocityTracker.recycle();
mVelocityTracker = null;
}
break;
}
}
if (mVelocityTracker != null) {
mVelocityTracker.addMovement(ev);
}
return true;
}
private class FlingRunnable implements Runnable {
private final CoordinatorLayout mParent;
private final V mLayout;
FlingRunnable(CoordinatorLayout parent, V layout) {
mParent = parent;
mLayout = layout;
}
@Override
public void run() {
if (mLayout != null && mScroller != null) {
if (mScroller.computeScrollOffset()) {
setHeaderTopBottomOffset(mParent, mLayout, mScroller.getCurrY());
// Post ourselves so that we run on the next animation
ViewCompat.postOnAnimation(mLayout, this);
} else {
onFlingFinished(mParent, mLayout);
}
}
}
}
}
程式碼沒全貼,有興趣的可以看api跟下流程,綜上,這個比較特別的AppBarLayout的特別之處在於它綁定了一個特別的Behavior,這個Behavior重寫OnTouch事件,監聽父佈局(CoordinatorLayout)的變化動態,因而內部可以做出對應變化調整。
2.2 關於CollapsingToolbarLayout
關於CollapsingToolbarLayout,csdn上有篇文章講得很明白,我在這兒貼個連結:CollapsingToolbarLayout 詳細請摸我3.總結
以上,村通電沒有多久,寫得感覺挺亂,加油加油。