Android CoordinatorLayout 自定义Behavior 高仿美团商家详情界面 实现页面内容复杂联动效果

最新推荐文章于 2024-05-31 23:50:10 发布
最新推荐文章于 2024-05-31 23:50:10 发布
阅读量6.6k 收藏 25
点赞数 10
分类专栏： Android View UI
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/bfbx5173/article/details/80624322
版权


内容如题  

效果如下


顺带涉及到：

  1. Scroller+Handler 实现View自动滑动
  2. View属性动画
  3. 触摸事件分发机制
  4. ConstraintLayout
最低0.47元/天 解锁文章
bfbx5173
关注
  • 10
    点赞
  • 踩
  • 25
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
android美团点餐界面,Android 仿美团点餐页面布局介绍
weixin_34443284的博客
05-31 2742
该楼层疑似违规已被系统折叠隐藏此楼查看此楼1部分：a．顶部是一个轮播,首先需要在build.gradle导入依赖implementation'com.youth.banner:banner:1.4.9'使用标签b．商品和评价那使用选项卡属性android:layout_width="match_parent"android:layout_height="36dp"android:orientat...
Android仿美团团购详情页下拉图片放大效果demo,简单可直接用在项目中
02-19
Android仿美团团购详情页下拉图片放大效果demo,简单可直接用在项目中
【转】Android 自己收集的开源项目和文章集合（持续更新至2018.12.17）
chenglve1135的博客
12-27 8923
2017-12-21 1.炫酷开屏动画框架 https://github.com/JoshuaRogue/FancyView 2.防京东，支付宝密码键盘和密码输入框 https://github.com/GitPhoenix/Keyboard 3.高仿 iOS 滚轮实现 省市区 城市选择三...
android简单仿美团外卖菜单
最新发布
Miaolihong1的博客
05-31 1612
由于仿美团外卖菜单的界面中需要显示推荐菜单列表与进店必买菜单列表信息，所以我们需要在MminActivity 中定义 init()方法、setData()方法、clickEvent()方法和switchData()方法，这些方法分别用于初始化界面控件、设置界面数据、实现界面控件的点击事件和切换右侧菜单列表的数据。其中，顶部的导航栏中包含“点菜”“评价”“商家”和“好友拼单”文本信息，左侧的菜单栏中包含“推荐”和“进店必买”文本信息，右侧的菜单列表中包含菜品名称、菜品月售信息和菜品价格等信息。
Android 仿美团网的购买布局效果
05-06
Android 仿美团网的购买布局效果, 可以设置多个置于顶部的购买布局，详情请查看http://blog.csdn.net/xiaanming/article/details/17761431
仿饿了么、京东，左右联动列表，仿商城联动View
07-28
仿饿了么、京东，左右联动列表，仿商城联动View。滑到一个类型商品后，左边列表自动选中。左边点击某个类型商品，右边列表自动滑动到该类型商品。
Android仿外卖购物车功能
01-20
先看看效果图： 知识点分析 效果图来看不复杂内容并没多少，值得介绍一下的知识点也就下面几个吧 – 列表标题悬停 – 左右列表滑动时联动 – 添加商品时的抛物线动画 – 底部弹出购物车清单 – 数据的同步 另外就是实现效果的时候可能会遇到的几个坑。。。 布局很简单直接进入代码 1：列表标题悬停 现在做项目列表什么的基本抛弃了ListView改用RecyclerView，上篇博客中的标题悬停也是使用了一个RecyclerView的开源项目sticky-headers-recyclerview,不过写这个demo的时候遇到了两个坑 1）、sticky-headers-recyclervi
双RecyclerView联动，仿饿了么选餐列表；
Choi晨的博客
07-23 1977
点击左边的列表，右边的定位到指定条目； 滑动右边的列表，左边的选中指定条目； 现在的饿了么或美团的点餐界面类似这样的； 下面来看代码咯，注释还是比较详细的； public class MainActivity extends AppCompatActivity { private LinkBean linkBean; private LAdapter lAdapte...
learn-coordinatorlayout-behavior:CoordinatorLayout 自定义Behavior 高仿美团商家详情界面 实现页面内容复杂联动效果
05-14
behavior-learn ...代码模仿实现美团商家详情界面内容联动 开发使用知识点顺带涉及到： Scroller+Handler 实现View自动滑动 View属性动画 触摸事件分发机制 ConstraintLayout约束布局 emmmmmmm 继续加油咯~
Android代码-自定义CoordinatorLayout.Behavior仿美团商家详情界面实现内容复杂联动
08-06
代码模仿实现美团商家详情界面内容联动 download apk 开发使用知识点顺带涉及到： Scroller Handler 实现View自动滑动 View属性动画 触摸事件分发机制 ConstraintLayout约束布局 emmmmmmm 继续加油咯~
AndroidStudio————实战演练——仿美团外卖菜单
04-06
即实战演练的全部代码，加图片资源。
Android高仿美团外卖双联动列表点菜页
09-15
android 实现仿美团点菜，美团外卖点菜效果上有一种根据右边列表滑动可以监听到左边分类信息的变化状态
android 仿美团界面 很全
04-20
各个界面都有，首页列表 详情 登陆 全套界面还封装了网络请求 非常全的UI界面
android 实现仿美团点菜页
01-11
android 实现仿美团点菜 先看博客：http://blog.csdn.net/mingzhnglei/article/details/54343043
手机端仿美团商铺详情页面
07-31
手机端仿美团商铺详情页面，购物车、商品列表、商品分类
Android CoordinatorLayout高级用法之自定义Behavior
01-04
上次简单的说了一下CoordinatorLayout的基本用法(android特性之CoordinatorLayout用法探析实例)。其中CoordinatorLayout给我们提供了一种新的事件的处理方式，Behavior。还记得那一串字符串吗？ app:layout_...
Coordinatorlayout嵌套滑动，自定义Behavior的Demo
03-02
在Android开发中，`CoordinatorLayout`是一个非常强大的布局工具，它是Android Design Support Library的一部分，用于实现Material Design的设计规范。这个布局允许我们实现复杂的交互和动画效果，比如头部滑动隐藏...
仿美团点餐列表android,仿美团，菜单列表，购物车结算
weixin_29517217的博客
06-03 762
var app = getApp()var common = require('../../utils/server.js');Page({data: {orderList: [],count: 0,total: 0,pay: 0,is_empty: false},onLoad: function (option) {if(option.pay){var pay = option.pay;if(p...
coordinatorlayout+collapsingtoolbarlayout实现仿美团外卖,京东,安居客等搜索框
06-23
### 回答1： CoordinatoLayout与CollapsingToolbarLayout是Android开发中常用的两个控件，它们可以实现许多优秀的布局效果。其中，仿美团外卖、京东、安居客等搜索框的效果就可以通过使用这两个控件来实现。 首先，将CoordinatorLayout作为最外层布局，用AppBarLayout包裹CollapsingToolbarLayout和搜索框（Toolbar）的布局。在CollapsingToolbarLayout内部设置要展示的内容，如图片、文字等，以及折叠时隐藏的内容。而AppBarLayout则可以通过监听滚动事件来控制CollapsingToolbarLayout的展开与收缩。 接着，设置搜索框为Toolbar，并在Toolbar中加入EditText等控件来实现搜索功能。为了让搜索框在AppBarLayout的收缩中悬浮在顶部，可以将Toolbar设置为app:layout_scrollFlags="scroll|enterAlways|snap"。 最后，通过设置CollapsingToolbarLayout的collapsedTitleGravity、expandedTitleGravity、collapsedTitleTextAppearance、expandedTitleTextAppearance等属性来调整标题的展示效果，以适应不同的布局要求。 总之，通过使用CoordinatorLayout和CollapsingToolbarLayout这两个强大的布局控件，我们可以实现许多炫酷的布局效果，特别是像搜索框这样的常见功能，能够轻松实现，提高应用的用户体验。 ### 回答2： CoordinatorLayout是一个新的父容器控件，可以让子控件之间产生联动效果。CollapsingToolbarLayout是CoordinatorLayout的一个子控件，可以实现ToolBar折叠效果。 通过使用CoordinatorLayout和CollapsingToolbarLayout可以实现仿美团外卖、京东、安居客等应用的搜索框。我们可以在CollapsingToolbarLayout中添加一个EditText控件作为搜索框，并对其进行样式设置和位置调整。 在CollapsingToolbarLayout中，我们可以为其设置一个折叠模式，在不同的模式下控件的显示样式也会变化。当需要显示搜索框（例如在展开状态）时，我们可以设置一个比较大的折叠模式，使得搜索框完全显示。而当折叠Toolbar时，搜索框会根据预设的模式变为一个小图标，同时不影响其他控件的显示。 总的来说，通过使用CoordinatorLayout和CollapsingToolbarLayout，我们可以实现复杂的联动效果，让UI界面更加高效、美观。而在实现类似搜索框这类单一控件时，只需要在CollapsingToolbarLayout中添加控件，并对其进行相应样式和位置的设置即可。 ### 回答3： CoordinatorLayout是Android Support Design库中新增的一个布局类，它可以协调子View的滑动行为，实现一些复杂的交互效果。其中，CollapsingToolbarLayout是CoordinatorLayout中的一个布局类，通常用于实现可以折叠或扩展的标题栏效果。 在实现仿美团外卖、京东、安居客等搜索框的效果时，我们可以使用CollapsingToolbarLayout来实现。具体步骤如下： 1. 在布局文件中，先将CoordinatorLayout作为父布局，再添加一个AppBarLayout作为子布局。 2. 在AppBarLayout中添加一个CollapsingToolbarLayout作为子布局，并设置app:layout_scrollFlags="scroll|exitUntilCollapsed"属性，表示该子View可以滚动，并在完全收缩前一直存在。 3. 在CollapsingToolbarLayout中添加一个Toolbar作为子布局，这个Toolbar就是我们的标题栏。可以在其中添加搜索框等控件。 4. 在CollapsingToolbarLayout中再添加一个ImageView或其他子View，作为背景图片或其他效果。（可选） 5. 在布局文件中添加一个RecyclerView或其他滑动控件，将其放入CoordinatorLayout中，并设置app:layout_behavior="@string/appbar_scrolling_view_behavior"属性，表示该子View会受到AppBarLayout的滚动行为影响。 这样一来，当用户向下滑动页面时，CollapsingToolbarLayout会慢慢收缩，最后只剩下Toolbar，而背景图片则会消失或变成其他效果。与此同时，RecyclerView会随着滑动而滚动，实现搜索框随着页面滑动的效果。 总之，使用CoordinatorLayout和CollapsingToolbarLayout可以方便地实现一些复杂的交互效果，如此处的仿美团外卖、京东、安居客等搜索框效果。需要注意的是，该效果的实现还需进一步考虑适配、优化等问题。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值