android webview上滑显示toolbar,Android WebView滑动隐藏Toolbar

1. 前言

在我们浏览一个滑动视图列表的时候会动态的将ActionBar(Toolbar)隐藏(向下滑动显示,向上滑动隐藏),以留下更多的空间来显示内容。内容非常简单,先看看效果图:

FgkDl0_1g5RJRNyh3oJalEBOxM7w

2. 布局文件

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:orientation="vertical">

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:orientation="vertical">

android:id="@+id/toolbar"

android:layout_width="match_parent"

android:layout_height="?attr/actionBarSize"

android:background="@color/colorPrimary"

app:layout_scrollFlags="scroll|enterAlways"

app:popupTheme="@style/ThemeOverlay.AppCompat.Light"

app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"

app:titleTextColor="@color/white"/>

android:id="@+id/progress_bar"

style="@style/Base.Widget.AppCompat.ProgressBar.Horizontal"

android:layout_width="match_parent"

android:layout_height="2dp"

android:layout_gravity="center"/>

android:layout_width="match_parent"

android:layout_height="match_parent"

app:layout_behavior="@string/appbar_scrolling_view_behavior">

android:id="@+id/web_view"

android:layout_width="match_parent"

android:layout_height="match_parent"/>

Toolbar 的 app:layout_scrollFlags=”scroll|enterAlways” 属性。(19行)

NestedScrollView 的 app:layout_behavior=”@string/appbar_scrolling_view_behavior” 属性(36行,该值是一个固定值)

3 关于 Toolbar 的五种ScrollFlags

分别是:scroll,enterAlways,enterAlwaysCollapsed,snap,exitUntilCollapsed

3.1 scroll

The view will be scroll in direct relation to scroll events. This flag

needs to be set for any of the other flags to take effect. If any

sibling views before this one do not have this flag, then this value

has no effect.

Child View 伴随着滚动事件而滚出或滚进屏幕。注意两点:第一点,如果使用了其他值,必定要使用这个值才能起作用;第二点:如果在这个child View前面的任何其他Child View没有设置这个值,那么这个Child View的设置将失去作用。

app:layout_scrollFlags="scroll"

Fmph8WEF_-13zdc6vyn7Msxz4_aS

scroll

3.2 enterAlways

When entering (scrolling on screen) the view will scroll on any

downwards scroll event, regardless of whether the scrolling view is

also scrolling. This is commonly referred to as the ‘quick return’

pattern.

快速返回模式。其实就是向下滚动时Scrolling View和Child View之间的滚动优先级问题。对比scroll和scroll | enterAlways设置,发生向下滚动事件时,前者优先滚动Scrolling View,后者优先滚动Child View,当优先滚动的一方已经全部滚进屏幕之后,另一方才开始滚动。

app:layout_scrollFlags="scroll|enterAlways"

Fmph8WEF_-13zdc6vyn7Msxz4_aS

enterAlways

3.3 enterAlwaysCollapsed

An additional flag for ‘enterAlways’ which modifies the returning view

to only initially scroll back to it’s collapsed height. Once the

scrolling view has reached the end of it’s scroll range, the remainder

of this view will be scrolled into view. The collapsed height is

defined by the view’s minimum height.

enterAlways的附加值。这里涉及到Child View的高度和最小高度,向下滚动时,Child View先向下滚动最小高度值,然后Scrolling View开始滚动,到达边界时,Child View再向下滚动,直至显示完全。

...

android:layout_height="150dp"

android:minHeight="?attr/actionBarSize"

app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed"

...

/>

Frkpl24T88WrPdDpAwrejHLNAnLw

enterAlwaysCollapsed

3.4 exitUntilCollapsed

When exiting (scrolling off screen) the view will be scrolled until it

is ‘collapsed’. The collapsed height is defined by the view’s minimum

height.

这里也涉及到最小高度。发生向上滚动事件时,Child View向上滚动退出直至最小高度,然后Scrolling View开始滚动。也就是,Child View不会完全退出屏幕。

...

android:layout_height="150dp"

android:minHeight="?attr/actionBarSize"

app:layout_scrollFlags="scroll|exitUntilCollapsed"

...

/>

FqmtmDxaoJxFCFsd6_6bTjoyHcuy

exitUntilCollapsed

3.5 snap

Upon a scroll ending, if the view is only partially visible then it

will be snapped and scrolled to it’s closest edge. For example, if the

view only has it’s bottom 25% displayed, it will be scrolled off

screen completely. Conversely, if it’s bottom 75% is visible then it

will be scrolled fully into view.

简单理解,就是Child View滚动比例的一个吸附效果。也就是说,Child View不会存在局部显示的情况,滚动Child View的部分高度,当我们松开手指时,Child View要么向上全部滚出屏幕,要么向下全部滚进屏幕,有点类似ViewPager的左右滑动。

...

android:layout_height="150dp"

android:minHeight="?attr/actionBarSize"

app:layout_scrollFlags="scroll|snap"

...

/>

FhhDTVqi5fh9oU0uChwlugxZWqAj

snap

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值