美文网首页
2018-08-06

2018-08-06

作者: yeccc | 来源:发表于2018-08-06 17:14 被阅读0次

                                        折叠功能

前言:

想实现折叠功能需要用到

CoordinatorLayout+AppBarLayout+CollapsingToolbarLayout

需先引入依赖

compile'com.android.support:design:27.1.1'

compile'com.android.support:cardview-v7:27.1.1'

compile'com.android.support:palette-v7:27.1.1'

1. CoordinatorLayout

CoordinatorLayout是一个直接继承自 ViewGroup 并实现 NestedScrollingParent 接口的控件,是一个增强型的FrameLayout,它主要的功能,作为顶层布局协调多个 View 进行互动。

1.1 布局属性

app:layout_anchor  设置CoordinatorLayout  的直接子控件的锚点(以某个 Coordinatorlayout直接或间接子控件 为参考设置本控件的位置),这个值通常设置为控件的id

app:layout_anchorGravity设置CoordinatorLayout  直接子控件 相对锚点的位置,值有 bottom、center、right、left、top等。

app:layout_behavior : CoordinatorLayout  的精华, 直接子控件使用,设置子控件的行为(如平移,缩放,位置,显示状态等),可以用系统自带的属性,也可自己自定义。

2. AppBarLayout

AppbarLayout继承于LinearLayout,是一个垂直的LinearLayout,它实现了Material Design的许多功能和特性,即滚动手势(Scrolling Gestures)

我们可以定义行为Behavior,当某个可滑动View(如ListView)滑动手势发生改变时,AppbarLayout 内部的子View该做什么动作

AppBarLayout需要使用AppBarLayout.ScrollingViewBehavior behavior 行为类绑定一个滚动的View,以便知道何时结束滚动 app:layout_behavior=”@string/appbar_scrolling_view_behavior”

AppbarLayout严重依赖于CoordinatorLayout,必须作为CoordinatorLayout的子View来使用.如果在不同的ViewGroup中使用AppbarLayout,那么会有大部分的功能无效.

AppBarLayout 依赖于CoordinatorLayout,一般结合ToolBar和TabLayout,以及滚动View(ScrollView/NestedScrollView)使用

2.1 控件属性

app:expanded 设置AppBarLayout默认的状态(ture为展开,false为折叠) 要同时设置 app:layout_scrollFlags 才有效果

app:layout_scrollFlags

5种状态: scroll , enterAlways , enterAlwaysCollapsed , exitUntilCollapsed , snap

五种状态效果说明:

Scroll

AppBarLayoutd的子View设置了该属性时,这个View将跟随滚动View滚动

换句话说->默认显示Toolbar的layout_height内容,跟随ScrollView滚动

enterAlways

其实就是向下滚动时ScrollView和Child View之间的滚动优先级问题.对比scroll和scroll | enterAlways设置,当向下滑动时,前者优先滚动ScrollView,后者优先滚动Child View,当优先滚动的一方已经全部滚进屏幕之后,另一方才开始滚动.

换句话说->默认显示Toolbar的layout_height,上滑时Toolbar跟随ScrollView,下滑时不用滑动到底部就显示完上滑时Toolbar跟随ScrollView的layout_height的内容

注意需要 scroll | enterAlways 搭配使用,否则滑动没响应

enterAlwaysCollapsed

AppBarLayoutd的子View设置了该属性时,当滚动View向下滑到最低时,子View会继续滑动一部分距离,这部分距离通过子View设置的android:minHeight决定

换句话说->默认显示Toolbar的部分layout_height内容,上滑跟随ScrollView滚动,下滑先显示Toolbar设置的minHeight部分内容,下滑到底部再显示Toolbar完整的layout_height

需要scroll | enterAlways | enterAlwaysCollapsed 搭配使用

exitUntilCollapsed

AppBarLayoutd的子View设置了该属性时,当滚动View向下滑到最低时,子View会继续滑动一部分距离,这部分距离通过子View设置的android:minHeight 决定,但滚动view向上滑动一直到底前,子view设置的minHeight高度保持固定

换句话说->默认显示Toolbar的layout_height内容,上滑显示Toolbar设置的minHeight内容,下滑到底部前先显示Toolbar设置的minHeight内容,下滑到底部后继续下滑显示Toolbar的layout_height内容

需要scroll | exitUntilCollapsed 搭配使用

snap

AppBarLayoutd的子View设置了该属性时,当滚动View向下滑动超出其25%,被拉伸的子View会将滚动View回滑到子View固定高度android:minHeight,滚动View向上滑动时同理

换句话说->默认显示Toolbar的layout_height内容.上滑时,当layout_height显示少于一半松手,layout_height内容自动滚出屏幕理,下滑时,当layout_height显示多余一半松手,layout_height的内容全部滚进屏幕

需要scroll | snap 搭配使用

3.  CollapsingToolbarLayout

CollapsingToolbarLayout作用是提供了一个可以折叠的工具栏,它继承至FrameLayout,给它设置layout_scrollFlags就可以实现折叠效果!

3.1 控件属性

app:title

ToolBar的标题,当CollapsingToolbarLayout展开时,title显示的是大字体,在折叠的过程中,title不断变小到一定大小的效果。

app:contentScrim

ToolBar被折叠到顶部固定时候的背景。

app:statusBarScrim

折叠后状态栏的背景。

app:scrimVisibleHeightTrigger

设置收起多少高度时,显示ContentScrim的内容。

app:scrimAnimationDuration

展开状态和折叠状态之间,内容转换的动画时间。

下面两个属性是作为CollapsingToolbarLayout的子View才能设置并生效的:

app:layout_collapseMode折叠模式

none: 跟随滚动的手势进行折叠。

parallax: 视差滚动,搭配layout_collapseParallaxMultiplier(视差因子)使用。

pin: 固定不动。

app:layout_collapseParallaxMultiplier

视差因子,范围:0-1,默认0.5。

4. 代码实现

注意:最顶层的布局必须是CoordinatorLayout。CoordinatorLayout的直接子View必须是一个可滑动的控件(如recycleview。listview),并且内部有内容可以滑动。同时需要设置app:layout_behavior。

5. 遇到的问题

布局预览中不显示CoordinatorLayout

原因:可能是由于sdk 28不兼容

解决方法:将sdk版本降到27

相关文章

网友评论

      本文标题:2018-08-06

      本文链接:https://www.haomeiwen.com/subject/jtewvftx.html