展开

关键词

用 CoordinatorLayout 处理滚动

> </android.support.design.widget.AppBarLayout> 现在结果应该显示: ? 通常,我们设置 Toolbar 标题。现在,我们需要在 CollapsingToolBarLayout 而不是 Toolbar 上设置标题。 ); collapsingToolbar.setTitle("Title"); 注意,在使用 CollapsingToolbarLayout 时候,应该如此文档所述,状态栏设置成半透明(API 19 支持底部表有两种类型:persistent 和 modal。Persistent 类型底部显示应用内内容,而 modal 类型显示菜单或者简单对话框。 ? 但是,记住,你不应该 app:layout_behavior 属性放到 fragment 或者它内部列表上任何一个位置。

3.1K92

Material Design 实战 之 第六弹 —— 可折叠式标题栏(CollapsingToolbarLayout) & 系统差异型功能实现(充分利用系统状态栏空间)

充分利用系统状态栏空间(系统差异型) 2.1 控件(这里是ImageView)布局结构中所有父布局 android:fitsSystemWindows属性指定成true, 接着还可以在界面上再添加一个悬浮按钮, 当然并不是必需,只是如果加的话,我们免费获得一些额外动画效果。 FloatingActionButton中, app:layou_anchor属性(anchor n.锚状物)指定了一个锚点,这里锚点设置AppBarLayout,这样悬浮按钮就会出现在水果标题栏区域内 , 控件android:fitsSystemWindows属性指定成true,就表示该控件会出现在系统状态栏里。 这里除了android:fitsSystemWindows属性设置好,还必须在程序主题中将状态栏颜色指定成透明色。

98640
  • 广告
    关闭

    腾讯云校园大使火热招募中!

    开学季邀新,赢腾讯内推实习机会

  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    再学一遍android:fitsSystemWindows属性

    对于android:fitsSystemWindows这个属性你是否感觉又熟悉又陌生呢? 熟悉是因为大概知道它可以用来实现沉浸式状态栏效果,陌生是因为对它好像又不够了解,这个属性经常不灵。 我相信按照绝大多数人美好设想,android:fitsSystemWindows属性就应该像是一个开关一样,设置true就可以打开沉浸式状态栏效果,设置成false就可以关闭沉浸式状态栏效果。 在Google提供诸多布局当中,并不是只有CoordinatorLayout处理android:fitsSystemWindows属性,像CollapsingToolbarLayout、DrawerLayout CollapsingToolbarLayout,并且给CollapsingToolbarLayout设置了android:fitsSystemWindows属性,这样CollapsingToolbarLayout 接着我们给ImageView同样设置了android:fitsSystemWindows属性,如此一来,就可以让图片显示在状态栏背后了。

    9150

    CoordinatorLayout使用全解析

    例如,如果视图只有底部25%显示,它将折叠。相反,如果它底部75%可见,那么它将完全展开。 CollapsingToolbarLayout可以通过app:contentScrim设置折叠工具栏布局颜色,通过app:statusBarScrim设置折叠状态栏颜色。 CollapsingToolbarLayout子布局有3种折叠模式(Toolbar中设置app:layout_collapseMode) off:默认属性,布局正常显示,无折叠行为。 pin:CollapsingToolbarLayout折叠后,此布局固定在顶部。 parallax:CollapsingToolbarLayout折叠,此布局也会有视差折叠效果。 当CollapsingToolbarLayout子布局设置了parallax模式,我们还可以通过app:layout_collapseParallaxMultiplier设置视差滚动因子,值:0~

    13720

    使用CoordinatorLayout打造各种炫酷效果

    版权声明:本文博主原创文章,未经博主允许不得转载。 (当这个View到达 CollapsingToolbarLayout底部时候,这个View 将会被放置,即代替整个CollapsingToolbarLayout) 我们有两种方法可以设置这个常量, 底部时候,代替整个CollapsingToolbarLayout显示 接着说明TabLayout变化 从前面的描述我们已经知道当 没有指定app:layout_scrollFlags时候,最终 TabLayout静止,不会随着滑动 时候消失不见 拓展 如果我们仅仅 改变CollapsingToolbarLayoutapp:layout_scrollFlags=”scroll|exitUntilCollapsed - 对于AppBarLayout,我们主要 讲解了这个属性app:layout_scrollFlags,设置不同 属性我们可以在滚动时候显示不同 效果 - 对于CollapsingToolbarLayout

    4K10

    Android view滑动悬浮固定效果实现代码示例

    1.背景 在项目开发过程中,有时候碰到这样需求:在滑动过程中,在某时要将子view固定在顶部(常见界面中tab在滑动到顶部时候进行固定)。 4.扩展 a.关于CollapsingToolbarLayout中子view排列顺序对显示结果造成影响 如图: ? 推测—— CollapsingToolbarLayout中以上三种view不同排序剖面展示效果: 顺序:Toolbar—— ImageView—— TabLayout(设置layout_gravity (因此,1.在画布下内容就无法显示出来;2.无法覆盖画布内容就显示画布默认样式) 所以,如果不想要有视差效果的话,那么就将Toolbar与TabLayout高度设置一致。 (这样也避免了:在CollapsingToolbarLayout中,因为视图折叠覆盖问题,导致整个ImageView被TabLayout覆盖一部分而显示不完全问题。)

    17110

    高仿支付宝9.9.2版本生活模块界面来讲解CoordinatorLayout,AppBarLayout,CollapsingToolbarLayout

    内部子View通过在布局中加app:layout_scrollFlags设置执行动作。 最后snap这是属性是子View不会存在局部显示情况,滚动Child View部分高度,当我们松开手指,Child View要么向上全部滚出屏幕,要么向下全部滚进屏幕。 3.CollapsingToolbarLayout 是用来对Toolbar进行再次包装ViewGroup,主要是用于实现折叠App Bar效果。 CollapsingToolbarLayout只要有这方面: 1.title展开是最大,然后随着收缩越来越少,直到屏幕顶部,通过app:title设置title,不然就默认。 当verticalOffset=0时候即使整个展开是时候要做就是显示显示,隐藏要隐藏设置,在设置透明度,同理当verticalOffset等于appBarLayout.getTotalScrollRange

    54220

    CoordinatorLayout与滚动处理

    目前这个框架提供了几种不用写动画代码就能工作方法,这些效果包括: 让浮动操作按钮上下滑动,Snackbar留出空间 ? 扩展或者缩小Toolbar或者头部,让主内容区域有更多空间。 ? floatingActionButton弹出Snackbar,fab自动上移效果,app:layout_behavior自定义效果,当下滑,fab消失,上滑fab显示,详情请查看本人博客 Floating 通常,我们我们都是设置Toolbartitle,而现在,我们需要把title设置CollapsingToolBarLayout上,而不是Toolbar。 同时在用户滚动时候title高度也随着改变。 ? 为了制造出这种效果,我们添加一个定义了app:layout_collapseMode=”parallax” 属性ImageView。 当滚动发生时候,CoordinatorLayout尝试触发那些声明了依赖子view。

    15120

    界面无小事(九): 做个好看伸缩头部

    然后标题栏需要变成透明. 标题栏设置透明色 那由于5.0之前是不能变, styles.xml从5.0区分开, 5.0之前什么都不做, 之后版本设置标题栏透明色. 底部 parallax 视图将以视差方式滚动 是不是该怎么懵还是怎么懵, 来看效果图: ? 参数 效果 scroll 视图滚动与滚动事件直接相关. 需要设置此标志才能使任何其他标志生效. 如果在此之前任何兄弟视图没有此标志, 则此值无效. exitUntilCollapsed 退出(滚动屏幕), 视图滚动直到“折叠”. 折叠高度由视图最小高度定义。 但是我感觉体验不好, 让人有着操作不灵敏错觉. ?

    45920

    CollapsingToolbarLayout使用

    ,直至高度缩Toolbar高度并成为Toolbar背景色;向下滑动列表,Header部分逐渐显示。 关于CollapsingToolbarLayout属性在官网上可以查到,这里我只介绍案例中我们常用几个属性:title标题,布局展开放大显示在图片底部,布局折叠缩小显示在Toolbar左侧。 attr/colorPrimary",即显示Toolbar颜色,应用主题色;layout_collapseMode折叠模式,设置其他控件滚动自身交互行为,有两种取值:parallax,折叠视差效果 当设置1.0,滚动列表图片不会折叠移动; 代码实现: ? 表示控件向上折叠退出并以最小高度停留在顶部;前面介绍CollapsingToolbarLayout属性介绍到了statusBarScrim使用,其实也可以通过android:fitsSystemWindows

    73160

    细说 AppbarLayout,如何理解可折叠 Toolbar 定制

    当 AppBarLayout 中内容要从 CoordinatorLayout 外面进入内部,我们用 enter 指代这种行为,对应手势就是向下滑动。 当 AppBarLayout 中内容从 CoordinatorLayout 内部向外部方向移动,我们用 exit 指代这种行为,对应手势是向上滑动。 Toolbar 先滑动,等到视图可见范围高度 collapsed 指定高度它会静止,等到 NestedScrollView 内容完全显示在 Toolbar 下方它再一起滑动,它动作是 3 段式是包裹 CollapsingToolbarLayout AppbarLayout 需要设置 fitsSystemWindows true。 Pinned position children 子类位置固定行为 这个很好理解, CollapsingToolbarLayout 中某个子 View 固定,无论是否存在滚动事件,只要设置 app:

    1.2K30

    NestedScrollView 嵌套 ListView 实现滑动折叠效果

    当我们引入RecyclerView时候,恰好是压死骆驼最后一根稻草,故不得不采用其他方案来代替RecyclerView 和 CollapsingToolbarLayout实现折叠效果。 android:fitsSystemWindows,经本人代码测试,表示CollapsingToolbarLayout上边界是否扩展到statusbar,这里如果想使用透明statusbar,这里更新下应该该布局根布局该属性 enterAlways - 实现quick return效果, 当向下移动,立即显示View(比如Toolbar). exitUntilCollapsed - 向上滚动收缩View,但可以固定Toolbar enterAlwaysCollapsed - 当你View已经设置minHeight属性又使用此标志,你View只能以最小高度进入,只有当滚动视图到达顶部才扩大到完整高度。 解决方法在AppBarLayout添加 android:fitsSystemWindows="true"

    1.8K50

    Android TabLayout 使用进阶(含源码)

    因此你接触很多不同UI布局,你需要去绘制出来,在这过程中你已经接触过TabLayout。 这样标题就设置好了,不过你会看到这个标题我设置是英文小写,而这运行出来就变成了大写,这个原理有Button是一样,你只需要将textAllCaps属性设置false就可以了。 、下划线透明,选中文字颜色蓝色,默认是灰色,和刚才创建四个图标样式文件类似,选中切换蓝色图片,未选中灰色图片。 ()数据填充进去 Allocation tmpIn = Allocation.createFromBitmap(rs, inputBitmap); Allocation blurScript.forEach(tmpOut); // 数据填充到Allocation中 tmpOut.copyTo(outputBitmap

    77022

    第14章 使用Kotlin 进行 Android 开发(1)第14章 使用Kotlin 进行 Android 开发(1)

    最终运行效果如下 ? HelloWord.png 14.2 综合项目实战:开发一个电影指南应用程序 本节我们开发一个Android 应用程序, 列出流行/最高评级电影, 显示预告片和评论。 另外,它还生成一个本地视图缓存,当第一次使用属性,它将执行一个常规findViewById。但在下一次使用属性时候,视图将从缓存中恢复,因此访问速度更快。 setCustomAnimations(int enter, int exit) Fragment进入/退出设置指定动画资源。 commit() 提交事务。安排一个针对该事务提交。 Fragment 添加至 Activity 视图布局中有两种方式:一种是使用fragment标签加入,Fragment父视图应是一个ViewGroup;另一种使用代码动态加入,并将一个ViewGroup 由于平板比手机屏幕大多,因此平板上可以呈现更多内容,而 Fragment 可以实现同一视图布局在不同大小屏幕上显示不同效果, Fragment 加入到 Activity Layout 中,

    45730

    Android - 仿网易云音乐歌单详情页

    : 实现思路: 1、Activity设置自定义Shared Element切换动画 2、透明状态栏(透明Toolbar,使背景图上移) 3、Toolbar底部增加和背景一样高斯模糊图,并上移图片(为了使背景图底部作为 其中内容根布局不要设置android:fitsSystemWindows="true",这样额外添加一个状态栏。 其中StatusBarUtil,是一个Android App 设置状态栏工具类。 3、Toolbar背景图 仔细分析后发现网易云音乐Toolbar背景其实显示是高斯模糊图底部,所以这里基本套路是Toolbar是透明,后面背景图取是高斯模糊图底部一部分。 ? Toolbar背景图 监听图片显示,在显示之后将其设置透明色,然后在滑动时候渐变。

    65510

    全屏、沉浸式、fitSystemWindow使用及原理分析:全方位控制“沉浸式”实现

    可以这么理解:状态栏与导航栏拥有自己独立窗口,而且这两个窗口优先级较高,悬浮在所有窗口之上,可以把系统自身状态栏与导航栏看做全透明,之所有会有背景颜色,是因为下层显示界面在被覆盖区域添加了颜色 --关键点1 ,可以看到,根布局根据消耗状况,来评估到底底部,右边部分margin多少,并设置进去--> if (mContentRoot ! 会选择性进入设置了fitSystemWindowView,即设置fitsSystemWindows: android:fitsSystemWindows="true" 并回调fitSystemWindows 有一个小点需要注意下,那就是Theme中也支持fitsSystemWindows设置 <item name="android:<em>fitsSystemWindows</em>">true</item> 默认情况下上属性 false,如果设置True,就会被第一个未设置fitsSystemWindowsView消费掉。

    2K40

    通过来模仿稀土掘金个人页面的布局来学习使用CoordinatorLayout

    Scroll: 表示向下滚动,这个View会被滚出屏幕范围直到隐藏. enterAlways: 表示向上滚动,这个View随着滚动手势出现,直到恢复原来位置. enterAlwaysCollapsed CollapsingToolbarLayout子View中可以设置这两个属性 1、ayout_collapseMode (折叠模式) - 有两个值: pin - 设置这个模式,当CollapsingToolbarLayout parallax - 设置这个模式,在内容滚动CollapsingToolbarLayoutView(比如ImageView)也可以同时滚动,实现视差滚动效果,通常和layout_collapseParallaxMultiplier (还没有收缩)title向左填充距离 app:expandedTitleMarginEnd 这个同理是收缩结束向左填空距离 其他就不一一介绍了,具体去查看API文档即可获知。 我在做这里时候遇到一个问题,那就是CollapsingToolbarLayoutTitle问题,一般默认是显示,即使你不写,它也有一个默认值一直显示在那里,等折叠收缩完时候,停留在标题工具栏上

    63190

    ViewPager,ScrollView 嵌套ViewPager滑动冲突解决

    总结 当TouchEvent发生,首先ActivityTouchEvent传递给最顶层View,TouchEvent最先到达最顶层 view dispatchTouchEvent ,然后由 解决思路 看了上面三种情况,我们知道他们共同特点是父View 和子View都想争着响应我们触摸事件,但遗憾是我们触摸事件 同一刻只能被某一个View或者ViewGroup拦截消费,所以就产生了滑动冲突 那既然同一刻只能由某一个View或者ViewGroup消费拦截,那我们就只需要 决定在某个时刻由这个 View 或者 ViewGroup 拦截事件,另外 某个时刻由 另外一个 View 或者 ViewGroup ,滚动条自然就显示到顶部了。 (true); view.requestFocus(); 这段代码在初始化时候就让该界面的顶部某一个控件获得焦点,滚动条自然就显示到顶部了。

    4.7K41

    Android 沉浸式状态栏多种样式

    ---- 公共步骤: 布局文件中添加使用 Toolbar 控件(纯色 Toolbar 背景色颜色,图片 Toolbar 样式设置背景色图片或添加一个 ImageView 控件),在文件根布局与 Toolbar 中添加 android:fitsSystemWindows="true",这个很重要,可以使背景图片延伸至状态栏,当然在 Java 文件中设置一样效果; <? 被遮挡操作栏 Toolbar 在测试过程中会出现底部虚拟操作按纽栏目被隐藏,如下图,此时应注意设置 systemUiVisibility 属性。 测试发现,若将根布局高设为 android:layout_height="wrap_content" 图片正常展示,如果 android:layout_height="match_parent" 则图片会被拉伸,当然和尚我认为根布局设置 wrap_content 方式是不合理

    69341

    扫码关注腾讯云开发者

    领取腾讯云代金券