自定义CoordinatorLayout的Behavior(2):实现淘宝和QQ ToolBar透明渐变效果

最新推荐文章于 2024-04-15 11:18:41 发布
最新推荐文章于 2024-04-15 11:18:41 发布
阅读量8.1k 收藏 15
点赞数 3
分类专栏： Android 文章标签： 淘宝网 toolbar 透明渐变 android
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/tiankong1206/article/details/50696887
版权
本文介绍了如何通过自定义CoordinatorLayout的Behavior实现类似淘宝和QQ ToolBar的透明渐变效果。文章详细讲解了布局设计、自定义Behavior的实现以及Behavior的配置过程，并展示了简易实现后的效果。
摘要由CSDN通过智能技术生成

更好的阅读体验请查看简书

自定义CoordinatorLayout的Behavior实现知乎和简书快速返回效果

自定义CoordinatorLayout的Behavior(2):实现淘宝和QQ ToolBar透明渐变效果

每天用淘宝和QQ 会发现淘宝的商品详情页和qq的好友动态页都不约而同的用了工具栏透明渐变效果，淘宝是为了不挡住商品图片，qq设置为了不挡住header image背景，效果感觉还挺好看，老有人问怎么做的。

那我们来分析一下他们的效果

淘宝效果:图片向上滑动的时候，toolbar慢慢的由透明变成完全不透明，向下滑动则相反

淘宝效果

QQ效果:(请自行查看手机，模拟器打死都安装不了，录不了gif) qq的效果类似不过有点不同 下面会分析

QQ效果

看完他们的效果我们可以发现：

  • 页面进来 toolbar开始都是透明的
  • 向上滑动 toolbar的透明度由透明变成透明，再向下滑动时，又由不透明变成透明

但是仔细体验会发现它们还是有一点点不同，qq的好友动态是要滑到快要出现文字时才会瞬间

最低0.47元/天 解锁文章
NoBlueSky
关注
专栏目录
仿淘宝客户端电商平台android初级速成
01-08
本教程从当下火热的商城项目入手，以讲师多年商城项目开发为核心，与北风网强强联手录制了《北风商城》Android客户端开发详解，全部基于真实的项目开发流程与真实的网络交互。 本课程基于2017年Android的稳定技术，实现了的敏捷开发，能够让同学们学会如何在短期内，通过各种成熟的开发技术，完成一款线上级别的商城项目开发。
Android CoordinatorLayout进阶教程-自定义Behavior实例-标题抽屉效果-标题透明度渐变效果
aaaym的博客
12-21 664
Behavior名为行为控制，当我们需要在CoordinatorLayout中我们要实现与子视图中复杂的手势交互时，这个时候我们可能需要自定义Behavior行为控制，在自定义的Behavior我们可以通过对应的回调去处理相应的业务逻辑。
Android 滑动渐变背景Toolbar、点击置顶ScrollView
最新发布
2401_84118608的博客
04-15 674
/设置滑动到多少出现//设置滚动置顶按钮以及其点击监听事件,//重写滚动改变返回的回调// l oldl 分别代表水平位移// t oldt 代表当前左上角距离Scrollview顶点的距离@Override/**滑动距离超过500px,出现置顶按钮,可以做为自定义属性滑动距离如果用户设置了使用用户的 如果用户没有设置使用默认的*///当 当前的左上角距离顶点距离 大于某个值的时候就显现置顶按钮出来 如果小于某个值就隐藏= 0) {} else {
Android CoordinatorLayout+AppBarLayout实现toolbar背景渐变透明
热门推荐
qq402164452的博客
12-20 2万+
现在很多APP上面都有滚动视图使顶部的Toolbar背景透明度渐变的效果，有两种实现方式，一种是自定义一个ViewGroup,通过监听scroll或者recyclerview的滚动高度来改变透明度，一种是使用 CoordinatorLayout+AppBarLayout+CollapsingToolbarLayout来实现，因为CoordinatorLayout 有Behavior对象，可以通过设置
自定义Scrollview--实现仿淘宝Toolbar透明度渐变效果
08-29
本示例探讨的主题是如何自定义ScrollView以实现类似淘宝应用中的Toolbar透明度渐变效果。这种效果通常被称为“沉浸式”或“半透明”状态栏，它在用户滚动页面时会改变Toolbar的透明度，从而增强视觉体验。 首先，...
Android中Toolbar随着ScrollView滑动透明度渐变效果实现
08-31
在Android开发中，为了提供更好的用户体验，经常需要实现一些动态效果，例如让Toolbar随着ScrollView的滑动而改变其透明度。这种效果可以让用户在滚动内容时感觉到更自然的过渡，提高应用的美观度和易用性。下面我们...
安卓利用ToolBar控件实现仿QQ顶部渐变色效果
01-03
安卓利用Toolbar控件实现仿QQ顶部渐变色效果 前言 前几天用了一周的时间做了一个手机蓝牙同下位机硬件通讯的安卓小软件，但是因为是安卓小白，加上这个小项目是由我个人进行开发，而本人又是不怎么擅长界面美化，...
CoordinatorLayout AppBarLayout 标题渐变 悬浮
09-16
android demoCoordinatorLayout AppBarLayout 标题渐变 悬浮android demoCoordinatorLayout AppBarLayout 标题渐变 悬浮
CoordinatorLayout 滑动置顶及背景渐变
09-26
滑动置顶，title颜色渐变，最近项目有这么个要求，百度了好多，感觉不符合公司项目的需求，所以就开始了搬运的模式，还好最后弄出来了这个效果，不过感觉少了沉浸式状态栏，哪位大神要是有沉浸式状态栏的可以发我哈，QQ 528804904
使用CoordinatorLayout协调者布局实现仿京东发现页面效果
03-28
使用CoordinatorLayout协调者布局实现仿京东发现页面效果，有兴趣的可以深入研究下，相关博客https://blog.csdn.net/hq942845204/article/details/88844272
Toolbar随滚动透明效果
11-23
源码对应的博客地址：https://blog.csdn.net/gaoxiaoweiandy/article/details/84349368
Android5.0+(CollapsingToolbarLayout)实现上划toolbar渐变效果
纯植物
11-30 7398
Android5.0+(CollapsingToolbarLayout)实现上划toolbar渐变效果 效果图类似于这个:(这个效果图是网上的资源,本案例只实现了上划效果,没有实现下面的瀑布流) 本案例主要使用了几个新的类 CoordinatorLayout AppBarLayout CollapsingToolbarLayout 对这些安卓新特性的详细介绍,可以参考:
自定义CoordinatorLayout的Behavior，实现ToolBar透明渐变效果
Memetjan
11-05 2006
1.布局 <?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.and...
自定义Behavior之ToolBar上滑TabLayout颜色渐变
提辖鲁的博客
02-15 2626
本篇文章介绍使用CoordinatorLayout的自定义Behavior来实现如下的效果分析本例效果首先我们来分析下整个例子需要实现哪些效果: ToolBar的上滑和下滑 TabLayout跟随ToolBar上移和下移 TabLayout颜色会跟随距离的变化发生渐变 滑动时会有黏性效果 滑动距离超过中间值后放开会自动滑向想要的方向 滑动距离未超过中间值放开则会自动回弹 本例需要的几个重要方法介绍
Android 监听手指滑动，Toolbar颜色渐变
会飞的小驴粪蛋
09-22 1498
Step 1：布局文件 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-...
Android使用Material Design自带CoordinatorLayout+AppBarLayout+CollapsingToolbarLayout+Toolbar组件实现标题栏滑动渐变色
Flutter|Android移动开发
02-26 1426
效果图如下： 未滑动颜色界面： 滑动完颜色界面： 1.首先要在app.gradle文件中添加 implementation 'com.android.support:design:26.1.0' 2.布局文件如下： &amp;amp;lt;?xml version=&amp;quot;1.0&amp;quot; encoding=&amp;quot;utf-8&amp;quot;?&amp;amp;gt; &amp;amp;lt;
自定义ScrollView实现Toolbar（标题栏）渐变
yanjunhui2011的专栏
12-26 1609
当下，越来越多的页面Toolbar都会随着界面的滑动呈现不同的透明状态。 如图： 要做成这样的效果有很多种，这篇文章就说一下我今天用到的一种（较为简洁，不喜勿喷）。 先把我的编程思想告诉各位，因为我觉得思想才是最重要的。 1、自定义一个类，继承自ScrollView，并重写它的 onScrollChanged 方法； 2、在 onS
实现淘宝和QQ ToolBar透明渐变效果
weixin_34301307的博客
06-09 164
哎，好久都没写博客了，最近有点懒惰了，今天端午节，在学校也是无聊的蛋疼啊，正好今天玩玩一些在其他app中常见的一些功能。 来看看效果图吧！ 这个是人家的图，我懒得自己弄一个，就copy他的了，顺便帮你宣传一下你的简书，不算为过吧^-^. sou，传送门 之前是在简书上面看了一篇实现的这种功能，他是重写CoordinatorL...
自定义Android CoordinatorLayout Behavior实现高级功能
通过自定义`Behavior`，开发者可以创建具有高度可扩展性和定制化的交互效果，例如实现滑动关闭的DrawerLayout、动态调整的FloatingActionButton或响应式导航栏。为了使用自定义`Behavior`，你需要在`...
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值