博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
带波浪效果的CollapsingToolbarLayout + RecycleView
阅读量:5846 次
发布时间:2019-06-19

本文共 1171 字,大约阅读时间需要 3 分钟。

     小菜最近接到一个任务,实现包括波浪条的可折叠的ToolBar,准备用CollapsingToolbarLayout来尝试一下:

    1. 根据使用手册和网上大神们的例子,布局文件中 CollapsingToolbarLayout 里面添加需要展示的 Toolbar 和其他需要展示的控件,包括文字图片和需要自定义的波浪 View;

    2. CollapsingToolbarLayout 中,需要设置 layout_scrollFlags 中 scroll(滚动)/enterAlways(实现 quick return 效果, 当向下移动时,立即显示View)/exitUntilCollapsed(向上滚动时收缩View,但可以固定Toolbar一直在上面)/enterAlwaysCollapsed(当View已经设置minHeight属性又使用此标志时,你的View只能以最小高度进入,只有当滚动视图到达顶部时才扩大到完整高度);

      CollapsingToolbarLayout 里面的控件一般需要设置:

      (1) layout_collapseMode (折叠模式) -有两个值:

            pin -设置为这个模式时,当CollapsingToolbarLayout完全收缩后,Toolbar还可以保留在屏幕上;

            parallax -设置为这个模式时,在内容滚动时,CollapsingToolbarLayout中的View(比如ImageView)也可以同时滚动,实现视差滚动效果,通常和layout_collapseParallaxMultiplier(设置视差因子)搭配使用。

       (2) layout_collapseParallaxMultiplier(视差因子) - 设置视差滚动因子,值为:0~1

    3. 设置相应的展示效果(字体或图片的展示大小/颜色/属性等以及卡片展开压缩的效果);

    4. 根据需求绘制一个波浪效果,应用余玄函数进行绘制;

    5. 设置RecycleView,添加数据等


其中有两点需要注意:

1. 这个效果一定要建立在没有标题栏的主题下 android:theme="@style/AppTheme.NoActionBar"

2. 如果运行过程中提示找不到属性之类的, CollapsingToolbarLayout 使用时需要引入 android.support.design 的 lib,步骤如下:

  (1) File --> Progect Structure --> Dependencies

1240

  (2) 搜索 design 等关键字,找到相应的 libs,添加即可

1240

    实际的显示效果,例如 pin 与 parallax 的区别;视觉因子的大小;颜色值和展示位置等,需要大家根据实际情况调试,按需要展示。小菜的实际效果:

1240
1240

转载地址:http://kxzjx.baihongyu.com/

你可能感兴趣的文章
wordpress主题制作常用基本的模板及说明
查看>>
cocos2d-x学习日志(10) --射击游戏(喵星战争)
查看>>
乐在其中设计模式(C#) - 工厂方法模式(Factory Method Pattern)
查看>>
轻量级router[类似laravel router]
查看>>
在android创建bitmap避免低记忆法
查看>>
php 数组排序
查看>>
CPLD/FPGA基础知识(一)——FPGA的结构
查看>>
WPF快速精通版
查看>>
eclipse下遇到 无法解析类型 javax.servlet.http.HttpServletRequest
查看>>
jboss5优化
查看>>
北风网VIP6级学习视频地址
查看>>
PHP基础之 file_get_contents() 函数
查看>>
用platformio编写arduino程序
查看>>
InnoDB主键设计
查看>>
JS阻止链接跳转代码
查看>>
存储过程语法
查看>>
tomcat 内存大小配置
查看>>
微信小程序 - 拨打电话
查看>>
常见加解密算法及Delphi应用程序图标总结
查看>>
Windows下命令行直接编译程序
查看>>