掌握CoordinatorLayout

原文链接
the
在 I/0 2015大会上,发布了一个与 相关的控件支持库,在这个控件库中我们可以找到很多新的控件,例如 ,out和.
考虑到这些新的控件非常有用,因此我决定写一篇文章来介绍其相关的配置和使用技巧.
这个控件的作用和它的名字描述一样,是用来协调它里面所有子view行为的控件.
考虑下面的例子:
我们可以看到View之间是相互配合的,View会根据其他View的滑动而做出相应的变化.
举一个使用的简单例子:

在上面的布局文件中,直接包含了3个子控件,分别是:
【掌握CoordinatorLayout】,和.

是一个继承的,默认是垂直方向.它可以控件它里面子控件的滚动行为.直接听起来可能比较疑惑,我用一个git图片来描述一下:
在上面的gif图片中,是那个整体的蓝色View,它里面包含了可以收缩的图片,一个,一个用来包含标题和副标题,以及一个.
我们可以通过设置来直接控制中的子控件.在这个例子中,大部分子View的属性都设置了,如果没有设置的话,当可滚动的View进行滚动时,这些没有设置属性的View的位置会保持不变.
设置值为snap,可以避免进入动画中间状态,这意味着动画会一直持续到View完全显示或者完全隐藏为止.

掌握CoordinatorLayout

文章插图
其中包含了一个标题和一个副标题,当用户向上移动时是一直显示的,直到移出屏幕.而是会一直可见的,因为我们没有在上设置任何滚动属性.
正如你所见,的强大管理能力是通过给子View设置不同的属性来实现的.

这些参数的设置需要参考docs.我建议大家通过代码练习来掌握它们,我会在文章的末尾提供几个上的例子来供大家学习参考.
flags
WAYS: 当任何向下滚动事件发生时,View都会移入,不管 view是否正杂滚动.
: 它是””的附件属性,它是的View恢复到指定的最小高度后来开始显示,然后再慢慢展开.
:当向上移出屏幕时,View会一直收缩到最小高度后,再移出屏幕.
:View会根据指定方向进行滚动.
:当滚动结束时,如果这个View只有部分可见,它将会自动滚动到最近的边界(完全可见或者完全隐藏).
让我们来做一个小测试,打开 (大于1.4版本),使用 模板来创建一个,编译运行之后如下所示:
当我们来生成的代码,不过是还是java类中我们都找不到滚动变化的源码.为什么呢?
答案在的源代码里,从 .2版本开始,增加了ctrl+click可以查看源代码,源码如下:
/** Copyright (C) 2015 The Android Open Source Project**Floating action buttons are used for a*special type of promoted action. *They are distinguished by a circled icon *floating above the UI and have special motion behaviors *related to morphing, launching, and the transferring anchor point.* *blah.. blah.. */@CoordinatorLayout.DefaultBehavior(FloatingActionButton.Behavior.class)public class FloatingActionButton extends ImageButton {...public static class Behavior extends CoordinatorLayout.Behavior {private boolean updateFabVisibility(CoordinatorLayout parent, AppBarLayout appBarLayout, FloatingActionButton child {if (a long condition) {// If the anchor's bottom is below the seam, // we'll animate our FAB outchild.hide();} else {// Else, we'll animate our FAB back inchild.show();}}}...}
负责缩放动画的是 引入的新元素,在这个例子中是..它会根据一些滚动条件,来判断是否显示.
继续深入理解源码,我们可以在库的源码中发现一个类.通过这个,我们可以通过轻松实现滑动删除的效果.
@Overridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_swipe_behavior);mCardView = (CardView) findViewById(R.id.swype_card);final SwipeDismissBehavior swipe = new SwipeDismissBehavior();swipe.setSwipeDirection(SwipeDismissBehavior.SWIPE_DIRECTION_ANY);swipe.setListener(new SwipeDismissBehavior.OnDismissListener() {@Override public void onDismiss(View view) {Toast.makeText(SwipeBehaviorExampleActivity.this,"Card swiped !!", Toast.LENGTH_SHORT).show();}@Override public void onDragStateChanged(int state) {}});LayoutParams coordinatorParams = (LayoutParams) mCardView.getLayoutParams();coordinatorParams.setBehavior(swipe);}
创建一个自定义的,不像大家想象的那么难.在开始之前,我们必须明确两个元素: child和.
and
child是指使用的view,是的触发器,并和child进行互动.在这个例子中,child是一个,是,当发生了移动,也跟随移动.
现在我们已经明确了child和的概念,接下来我们讲一下如何实现.
第一步我们需要继承.,其中T是View对象,在上面的例子中是.接下来,我们必须重写两个方法:
方法在布局发生变化时被回调,我们需要在发生变化时返回true.在上面的例子中,当用户滑动屏幕时这个方法被自动调用,我们需要让child做出相应的反应.
@Overridepublic boolean layoutDependsOn(CoordinatorLayout parent, CircleImageView child, View dependency) {return dependency instance of Toolbar;}
当返回true时,ed函数就会被调用.在这个方法中,我们需要实现动画效果.
public boolean onDependentViewChanged(?CoordinatorLayout parent, CircleImageView avatar, View dependency) {?modifyAvatarDependingDependencyState(avatar, dependency);}private void modifyAvatarDependingDependencyState(CircleImageView avatar, View dependency) {//avatar.setY(dependency.getY());//avatar.setBlahBlat(dependency.blah / blah);}
完整的自定义代码:
?public static class AvatarImageBehavior extends ?CoordinatorLayout.Behavior {@Overridepublic boolean layoutDependsOn(?CoordinatorLayout parent, CircleImageView, child, View dependency) {return dependency instanceof Toolbar; } ??public boolean onDependentViewChanged(?CoordinatorLayout parent, CircleImageView avatar, View dependency) {?modifyAvatarDependingDependencyState(avatar, dependency);}private void modifyAvatarDependingDependencyState(CircleImageView avatar, View dependency) {//avatar.setY(dependency.getY());//avatar.setBlahBlah(dependency.blah / blah);}}
-
-
toon-