先上效果圖：
自定義Behavior,實現(xiàn)滑動卡片
上傳GIF圖到簡書搞了半天睡毒，后來發(fā)現(xiàn)是文件太大的原因，于是在這個網(wǎng)站壓縮了一下：壓縮GIF
至于是怎么錄制這個GIF的璃俗，很簡單:用Vysor同步手機(jī)屏幕到電腦上章蚣，然后用licecap錄制即可。
1迎瞧、自定義視圖
注意點：
- 自定義組合視圖+自定義屬性，沒啥說的
- 布局中使用了merge標(biāo)簽逸吵，（僅可）代替FrameLayout凶硅，減少布局層次,注意：這里不用merge會有詭異事件發(fā)生！
- Adapter使用了我自己的一個庫扫皱，引用和使用參見：Adapter的封裝之路足绅，注意：這里使用ListView會有詭異事件發(fā)生！
- 監(jiān)聽onSizeChanged方法韩脑，獲取headerHeight
- 通過注解綁定該控件對應(yīng)的Behavior
package com.che.slidingcard.slidingcard;
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Color;
import android.graphics.Rect;
import android.support.design.widget.CoordinatorLayout;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.FrameLayout;
import android.widget.TextView;
import com.che.slidingcard.R;
import com.che.superadapter.SingleAdapter;
import com.che.superadapter.SuperViewHolder;
import java.util.ArrayList;
import java.util.List;
/**
* 作者：余天然 on 16/9/13 下午11:15
*/
@CoordinatorLayout.DefaultBehavior(SlidingCardBehavior.class)
public class SlidingCardView extends FrameLayout {
private int headerHeight;
public SlidingCardView(Context context) {
this(context, null);
}
public SlidingCardView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public SlidingCardView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init(context, attrs, defStyleAttr);
}
private void init(final Context context, AttributeSet attrs, int defStyleAttr) {
LayoutInflater.from(context).inflate(R.layout.view_slidingcard, this);
TextView textView = (TextView) findViewById(R.id.tv);
RecyclerView recyclerView = (RecyclerView) findViewById(R.id.rv);
TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.SlidingCardView, defStyleAttr, 0);
int color = array.getColor(R.styleable.SlidingCardView_card_color, Color.GREEN);
String text = array.getString(R.styleable.SlidingCardView_card_text);
array.recycle();
textView.setText(text);
textView.setBackgroundColor(color);
SingleAdapter<String> adapter = new SingleAdapter<String>(context, R.layout.list_item) {
@Override
protected void bindData(SuperViewHolder holder, String item) {
TextView textView = holder.getView(R.id.text);
textView.setText(item);
}
};
recyclerView.addItemDecoration(new RecyclerView.ItemDecoration() {
@Override
public void getItemOffsets(Rect outRect, View view,
RecyclerView parent, RecyclerView.State state) {
final int position = parent.getChildViewHolder(view).getAdapterPosition();
final int offset = parent.getResources()
.getDimensionPixelOffset(R.dimen.activity_vertical_margin);
outRect.set(offset,
position == 0 ? offset : 0,
offset,
offset);
}
});
recyclerView.setLayoutManager(new LinearLayoutManager(context));
recyclerView.setAdapter(adapter);
adapter.setData(getData());
}
private List<String> getData() {
List<String> data = new ArrayList<>();
data.add("Android");
data.add("Java");
data.add("Web");
data.add("PHP");
data.add("Python");
data.add("Html");
data.add("Css");
data.add("Js");
return data;
}
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
if (w != oldw || h != oldh) {
headerHeight = findViewById(R.id.tv).getMeasuredHeight();
}
}
public int getHeaderHeight() {
return headerHeight;
}
}
2.自定義Behavior
注意點：
- 首先重寫onMeasureChild()氢妈，重新測量子控件的寬高，MeasureSpec的用法不熟悉的自己補(bǔ)去：三桿火槍干掉自定義View
- 然后重寫onLayoutChild(),重新布局子控件的位置段多，這里主要是通過offsetTopAndBottom()來設(shè)置偏移值來改變位置的
- onStartNestedScroll()判斷方向來決定是否要配合子view做出響應(yīng)首量。
- onNestedPreScroll()與onNestedScroll()執(zhí)行嵌套滑動之前和之后的處理
package com.che.slidingcard.slidingcard;
import android.support.design.widget.CoordinatorLayout;
import android.support.v4.view.ViewCompat;
import android.view.View;
/**
* 作者：余天然 on 16/9/13 下午11:16
*/
public class SlidingCardBehavior extends CoordinatorLayout.Behavior<SlidingCardView> {
private int defaultOffset;//默認(rèn)偏移值
@Override
public boolean onMeasureChild(CoordinatorLayout parent, SlidingCardView child, int parentWidthMeasureSpec, int widthUsed, int parentHeightMeasureSpec, int heightUsed) {
int offset = getChildMeasureOffset(parent, child);
int height = View.MeasureSpec.getSize(parentHeightMeasureSpec) - offset;
int heightMeasureSpec = View.MeasureSpec.makeMeasureSpec(height, View.MeasureSpec.EXACTLY);
child.measure(parentWidthMeasureSpec, heightMeasureSpec);
return true;
}
@Override
public boolean onLayoutChild(CoordinatorLayout parent, SlidingCardView child, int layoutDirection) {
parent.onLayoutChild(child, layoutDirection);
SlidingCardView previous = getPreviousChild(parent, child);
if (previous != null) {
int offset = previous.getTop() + previous.getHeaderHeight();
child.offsetTopAndBottom(offset);
}
defaultOffset = child.getTop();
return true;
}
/**
* 有嵌套滑動到來了，問下父View是否接受嵌套滑動
*
* @param coordinatorLayout
* @param child 嵌套滑動對應(yīng)的父類的子類(因為嵌套滑動對于的父View不一定是一級就能找到的，可能挑了兩級父View的父View加缘，child的輩分>=target)
* @param directTargetChild
* @param target 具體嵌套滑動的那個子類
* @param nestedScrollAxes 支持嵌套滾動軸粥航。水平方向，垂直方向生百，或者不指定
* @return 是否接受該嵌套滑動
*/
@Override
public boolean onStartNestedScroll(CoordinatorLayout coordinatorLayout, SlidingCardView child, View directTargetChild, View target, int nestedScrollAxes) {
//判斷監(jiān)聽的方向
boolean isVertical = (nestedScrollAxes & ViewCompat.SCROLL_AXIS_VERTICAL) != 0;
return isVertical && child == directTargetChild;
}
/**
* 在嵌套滑動的子View未滑動之前告訴過來的準(zhǔn)備滑動的情況
*
* @param parent
* @param child
* @param target 具體嵌套滑動的那個子類
* @param dx 水平方向嵌套滑動的子View想要變化的距離
* @param dy 垂直方向嵌套滑動的子View想要變化的距離
* @param consumed 這個參數(shù)要我們在實現(xiàn)這個函數(shù)的時候指定，回頭告訴子View當(dāng)前父View消耗的距離
* consumed[0] 水平消耗的距離柄延，consumed[1] 垂直消耗的距離 好讓子view做出相應(yīng)的調(diào)整
*/
@Override
public void onNestedPreScroll(CoordinatorLayout parent, SlidingCardView child, View target, int dx, int dy, int[] consumed) {
if (child.getTop() > defaultOffset) {
//1蚀浆、控制自己的滑動
int minOffset = defaultOffset;
int maxOffset = defaultOffset + child.getHeight() - child.getHeaderHeight();
consumed[1] = scroll(child, dy, minOffset, maxOffset);
//2、控制上面和下面的滑動
shiftScroll(consumed[1], parent, child);
}
}
/**
* 嵌套滑動的子View在滑動之后報告過來的滑動情況
*
* @param parent
* @param child
* @param target 具體嵌套滑動的那個子類
* @param dxConsumed 水平方向嵌套滑動的子View滑動的距離(消耗的距離)
* @param dyConsumed 垂直方向嵌套滑動的子View滑動的距離(消耗的距離)
* @param dxUnconsumed 水平方向嵌套滑動的子View未滑動的距離(未消耗的距離)
* @param dyUnconsumed 垂直方向嵌套滑動的子View未滑動的距離(未消耗的距離)
*/
@Override
public void onNestedScroll(CoordinatorLayout parent, SlidingCardView child, View target, int dxConsumed, int dyConsumed, int dxUnconsumed, int dyUnconsumed) {
//1搜吧、控制自己的滑動
int minOffset = defaultOffset;
int maxOffset = defaultOffset + child.getHeight() - child.getHeaderHeight();
int scrollY = scroll(child, dyUnconsumed, minOffset, maxOffset);
//2市俊、控制上面和下面的滑動
shiftScroll(scrollY, parent, child);
}
/**
* 處理自己的滑動
*
* @param child
* @param dy
* @param minOffset
* @param maxOffset
* @return
*/
private int scroll(SlidingCardView child, int dy, int minOffset, int maxOffset) {
int top = child.getTop();
int offset = clamp(top - dy, minOffset, maxOffset) - top;
child.offsetTopAndBottom(offset);
return -offset;
}
/**
* 處理其它的滑動
*
* @param scrollY
* @param parent
* @param child
*/
private void shiftScroll(int scrollY, CoordinatorLayout parent, SlidingCardView child) {
if (scrollY == 0) return;
if (scrollY > 0) {//往上推
SlidingCardView current = child;
SlidingCardView card = getPreviousChild(parent, current);
while (card != null) {
int delta = calcOtherOffset(card, current);
if (delta > 0) {
card.offsetTopAndBottom(-delta);
}
current = card;
card = getPreviousChild(parent, current);
}
} else {//往下推
SlidingCardView current = child;
SlidingCardView card = getNextChild(parent, current);
while (card != null) {
int delta = calcOtherOffset(current, card);
if (delta > 0) {
card.offsetTopAndBottom(delta);
}
current = card;
card = getNextChild(parent, current);
}
}
}
/**
* 獲取卡片的默認(rèn)偏移值
*
* @param parent
* @param child
* @return
*/
private int getChildMeasureOffset(CoordinatorLayout parent, SlidingCardView child) {
int offset = 0;
for (int i = 0; i < parent.getChildCount(); i++) {
View view = parent.getChildAt(i);
//排除自己
if (view != child && view instanceof SlidingCardView) {
SlidingCardView slidingCardView = (SlidingCardView) view;
offset += slidingCardView.getHeaderHeight();
}
}
return offset;
}
/**
* 計算其它卡片的偏移值
*
* @param above
* @param below
* @return
*/
private int calcOtherOffset(SlidingCardView above, SlidingCardView below) {
return above.getTop() + above.getHeaderHeight() - below.getTop();
}
/**
* 獲取上一個卡片
*
* @param parent
* @param child
* @return
*/
private SlidingCardView getPreviousChild(CoordinatorLayout parent, SlidingCardView child) {
int cardIndex = parent.indexOfChild(child);
for (int i = cardIndex - 1; i >= 0; i--) {
View view = parent.getChildAt(i);
if (view instanceof SlidingCardView) {
return (SlidingCardView) view;
}
}
return null;
}
/**
* 獲取下一個卡片
*
* @param parent
* @param child
* @return
*/
private SlidingCardView getNextChild(CoordinatorLayout parent, SlidingCardView child) {
int cardIndex = parent.indexOfChild(child);
for (int i = cardIndex + 1; i < parent.getChildCount(); i++) {
View view = parent.getChildAt(i);
if (view instanceof SlidingCardView) {
return (SlidingCardView) view;
}
}
return null;
}
/**
* 取上下限之間的值
*
* @param i
* @param minOffset
* @param maxOffset
* @return
*/
private int clamp(int i, int minOffset, int maxOffset) {
if (i < minOffset) {
return minOffset;
} else if (i > maxOffset) {
return maxOffset;
} else {
return i;
}
}
}
3.依賴的資源:
R.layout.activity_main:
<?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:background="#00F5FF"
android:layout_height="match_parent">
<com.che.slidingcard.slidingcard.SlidingCardView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:card_color="#cc3399"
app:card_text="卡片1"/>
<com.che.slidingcard.slidingcard.SlidingCardView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:card_color="#99ffcc"
app:card_text="卡片2"/>
<com.che.slidingcard.slidingcard.SlidingCardView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:card_color="#33ccff"
app:card_text="卡片3"/>
<com.che.slidingcard.slidingcard.SlidingCardView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:card_color="#F4A460"
app:card_text="卡片4"/>
</android.support.design.widget.CoordinatorLayout>
R.layout.view_slidingcard:
<?xml version="1.0" encoding="utf-8"?>
<merge
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.RecyclerView
android:id="@+id/rv"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="@dimen/card_header_height"
android:background="#C0C0C0"/>
<TextView
android:id="@+id/tv"
android:layout_width="match_parent"
android:layout_height="@dimen/card_header_height"
android:background="#000000"
android:gravity="center_vertical"
android:text="頭部"/>
</merge>
R.styleable.SlidingCardView:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="SlidingCardView">
<attr name="card_color" format="color"/>
<attr name="card_text" format="string"/>
</declare-styleable>
</resources>
R.layout.list_item:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
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="?android:attr/listPreferredItemHeight"
app:cardCornerRadius="4dp"
app:cardElevation="2dp"
android:foreground="?android:attr/selectableItemBackground">
<TextView
android:id="@+id/text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingStart="16dp"
android:paddingEnd="16dp"
android:gravity="center_vertical"
android:textAppearance="?android:attr/textAppearanceLarge"/>
</android.support.v7.widget.CardView>
最后，奉上源碼滤奈，歡迎拍磚摆昧！
