原文地址声明: https://blog.csdn.net/qq_23179075/article/details/52800723
Android CoordinatorLayout
自定义 Behavior
使用 CoordinatorLayout
需要在项目中加入Design
包。
dependencies {
compile 'com.android.support:design:24.1.1'
}
main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/activity_main2"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="zhengliang.com.animatorpath.Main2Activity">
<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:layout_scrollFlags="scroll|exitUntilCollapsed|snap">
<ImageView
android:layout_width="match_parent"
android:layout_height="300dp"
android:scaleType="centerCrop"
android:src="@mipmap/main_bg"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.9"/>
<FrameLayout
android:id="@+id/framelayout"
android:layout_width="match_parent"
android:layout_height="120dp"
android:layout_gravity="bottom"
android:background="@color/primary"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.3">
<LinearLayout
android:id="@+id/linearlayout_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:gravity="bottom|center"
android:text="LOVE"
android:textColor="@android:color/white"
android:textSize="24sp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="4dp"
android:text="I love you clover"
android:textColor="@android:color/white"/>
</LinearLayout>
</FrameLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="none"
app:behavior_overlapTop="20dp"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<android.support.v7.widget.CardView
android:id="@+id/card_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
app:cardElevation="8dp"
app:contentPadding="16dp"
app:cardCornerRadius="5dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:lineSpacingExtra="8dp"
android:text="@string/lorem"
android:textSize="18sp"
android:id="@+id/textView" />
</android.support.v7.widget.CardView>
</android.support.v4.widget.NestedScrollView>
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
android:background="@color/primaryDark"
app:layout_anchor="@id/framelayout"
app:theme="@style/ThemeOverlay.AppCompat.Dark">
</android.support.v7.widget.Toolbar>
<TextView
android:id="@+id/tv_title"
android:textColor="#fff"
android:textSize="18sp"
android:gravity="center"
android:text="UC头条"
android:background="@color/primaryDark"
android:layout_width="match_parent"
android:layout_height="56dp"
app:layout_behavior=".DrawerBehavior"/>
</android.support.design.widget.CoordinatorLayout>
Behavior
是 Android5.0
新出的 Design
包里新增的布局概念。Behavior
只有是 CoordinatorLayout
的直接子 View
才有意义。可以为任何 View
添加一个Behavior
。Behavior
是一系列回调。让你有机会以非侵入的为 View
添加动态的依赖布局,和处理父布局 CoordinatorLayout
滑动手势的机会。不过官方只有少数几个 Behavior
的例子。对于理解 Behavior
实在不易。开发过程中也是很多坑。
DrawerBehavior.java
public class DrawerBehavior extends CoordinatorLayout.Behavior<TextView> {
private int mStartY;
public DrawerBehavior(Context context, AttributeSet attrs) {
super(context, attrs);
}
@Override
public boolean layoutDependsOn(CoordinatorLayout parent, TextView child, View dependency) {
return dependency instanceof Toolbar;
}
@Override
public boolean onDependentViewChanged(CoordinatorLayout parent, TextView child, View dependency) {
//记录开始的Y坐标 也就是toolbar起始Y坐标
if (mStartY==0){
mStartY = (int) dependency.getY();
}
//计算toolbar从开始移动到最后的百分比
float percent = dependency.getY()/mStartY;
//改变child的坐标(从消失,到可见)
child.setY(child.getHeight()*(1-percent) - child.getHeight());
child.startAnimation(new AlphaAnimation(1,(1-percent)));
return true;
}
}
CoordinatorLayout.Behavior<T>
基类是一个泛型,泛型传递的是你需加入效果的 View
,比如我这里是给TextView
。
实现:两个必须的方法
@Override
public boolean layoutDependsOn(CoordinatorLayout parent, TextView child, View dependency) {
return dependency instanceof Toolbar;
}
@Override
public boolean onDependentViewChanged(CoordinatorLayout parent, TextView child, View dependency) {
return true;
}
上面的两个方法根据名字就看出 layoutDependsOn()
是 View
依赖于的控件是什么,这里是依赖于 Toolbar
所以写法就如上,其它的根据需要而变。第二方法是当依赖的组件发生变化时调用,可以在这里动态改变 View
的属性(拿这里来说就是:TextView
跟随 ToolBar
改变)。
自定义类 DrawerBehavior.java
写好以后,需要在使用这个 Behavior
的 View
加上:app:layout_behavior
属性 ,给 TextView
加上以下属性
app:layout_behavior="包路径.DrawerBehavior"