带有MotionLayout的安卓折叠工具栏-当RecyclerView为空/不可滚动时禁用运动 - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

【翻译】MotionLayout实现折叠工具栏（Part 1）

本系列教程中，我会讲解如何使用 MotionLayout 来创建一个我们已经非常熟悉的动画行为：一个折叠工具栏动画（ a Collapsing Toolbar ）。...MotionLayout 和安卓上许多其他的动画框架的一个主要不同点在于：视图动画和属性动画运行的时长是给定的，比如指定动画的时长，取消某个动画都是可行的，但是不能做到用户控制一个正在进行中的动画。...举个例子，一个折叠工具栏应该根据用户的滚动进行展开和折叠，所以实际动画的运行应该时刻跟随用户的拖拽进行。这也是那些框架办不到的地方。废话不多说，让我们看下我们所要尝试模拟做到的行为动作。...在展开和折叠状态下， RecyclerView 列表的上边缘是处于不同位置的，因为它被约束到了 ID 为 toolbar_image 的 ImageView 图片下边缘，而这个过渡动画的实现正是由于控制着这个位置变量的值...我们使用的是一个标准的 ImageView 控件，当其位于 ConstraintSet 下的 Constraint 元素中时，其主要的属性变成可以是 ConstraintLayout.LayoutParams

2K3 1

【翻译】MotionLayout实现折叠工具栏（Part 2）

本系列教程中，我会讲解如何使用 MotionLayout 来创建一个我们已经非常熟悉的动画行为：一个折叠工具栏动画（ a Collapsing Toolbar ）。...现在我们看看 MotionLayout 的实现，我们会发现图片渐变在整个过渡动画中是统一稳定的。也就是说：随着工具栏折叠动画的开始，图片便立刻发生渐变，一直持续到工具栏完全到达折叠状态： ?...因此我们得到的是一个非常平滑的过渡动画，从工具栏开始发生折叠一直到工具栏完全达到折合状态为止。这也很好的解释了我们所看到的在 MotionLayout 中对动画行为的实现。...目前来说，发生的情况是：图片的透明度在过渡动画还没有达到 60% 之前是不会发生变化的（也就是至少超过一半的折叠状态下不发生变化），接下来会慢慢开始淡出，直到工具栏达到 90% 折叠时完全透明。 ?...首先我们并不局限于目前仅使用两个关键帧的限制，事实上我们可以创建更多精细动画。甚至使用关键帧我们都能够创建出自定义的渐进曲线来（对于安卓开发者来说也就是所谓的插值）。

1.7K3 0

您找到你想要的搜索结果了吗？

是的

没有找到

Android开发笔记（一百三十六）可折叠工具栏布局CollapsingToolbarLayout

可折叠工具栏布局CollapsingToolbarLayout 上一篇博文《Android开发笔记（一百三十五）应用栏布局AppBarLayout》阐述了如何把Toolbar往上滚动，那反过来，...折叠系数可通过属性app:layout_collapseParallaxMultiplier配置，该属性为1.0时，折叠效果同pin模式即固定不动；该属性为0.0时，折叠效果等同于none模式，即也跟着移动相同距离...下面是Toolbar采用parallax模式时的效果图，可以看到红色区域会随着滚上去再滚下来。因为折叠系数设置为0.1，所以其效果近似于none模式。 ?...下面是标题栏在折叠时显示渐变图片的效果图： ?...具体的滚动说明如下所示：向上滚动：头部先往上收缩，一直滚到折叠的最小高度。然后头部与主体先一起滚动，头部滚到位后，主体继续向上。向下滚动：头部与主体先一起滚动，一直滚到头部折叠的最小高度。

3.3K3 0

Jetpack 重磅更新！

App Startup - 在应用启动时初始化组件 App Startup 类库提供了一种简单高效的方法在应用启动时初始化组件，而不是为每个需要初始化的组件定义单独的 ContentProvider 。...MotionLayout，构建流畅的交互式动画 MotionLayout 继承了 ConstraintLayout 的丰富特性，帮助 Android 开发者管理复杂的运动和窗口组件动画。...通过 MotionLayout ，你可以在 ConstraintSets 之间构造过渡动画，并且可以轻易的集成通用 View 的动画，像 RecyclerView 和 ViewPager 。...CameraX 安卓设备上的相机有很大差异，CameraX 兼容了 90% 的设备。自从去年 2月份 CameraX 进入 Beta 以来，我们专注于可靠性以确保 API 在大量设备上具有良好表现。...当这个 API 启动时，如果网站支持深色主题，WebView 会进行渲染。如果不支持，API 将会强制修改相应的颜色。

1.2K7 0

Constraint Layout 2.0 用法详解

Flow Flow 是一种新的虚拟布局，它专门用来构建链式排版效果，当出现空间不足的情况时，它能够自动换行，甚至是自动延展到屏幕的另一区域。...您可以对 wrapMode 指定三种模式: none – 所有引用的视图以一条链的方式进行布局，如果内容溢出则溢出内容不可见； chain – 当出现溢出时，溢出的内容会自动换行，以新的一条链的方式进行布局...您可以对视图的移动、滚动、缩放、旋转、淡入淡出等一系列动画行为进行自定义，甚至可以定义各个动画本身的自定义属性。它还可以处理手势操作所产生的物理移动效果，以及控制动画的速度。...这样一来，在协调多个视图的动画时，就可以做到对各个细节进行精细操控。...尤其是在以下两种情况下，MotionLayout 会比其它动画构建工具更胜一筹: 可追溯的动画 - 由其它输入驱动的动画，例如工具栏在滚动时会出现的折叠效果状态转换 - 由状态更改驱动的动画，例如用户进入某一界面后

2.3K3 0

MotionLayout 使用介绍 (第一章)

MotionLayout 是ConstrainLayout 2.0库中被引入的一个新类，帮助安卓开发者关联手势和组件动画。接下来的文章将介绍会如何在应用中添加和使用MotionLayout。...安卓系统框架中已经提供下面几种方法在应用中使用动画：动画矢量Drawable 属性动画框架 LayoutTransition动画使用TransitionManager进行布局转换 CoordinatorLayout...MotionLayout工具我们相信这种声明式的规范将简化过渡动画，同时也有助于为 Android Studio 提供更好的图形化工具。(我们现在正在积极的开发这样的工具，它现在还不可用。)...[strip] 最后，作为ConstrainLayout 2.0的一部分，它最低支持安卓API 14,99.8％的设备都可以使用。...何时使用MotionLayout 我们设想到的使用MotionLayout的使用场景：当你需要移动，缩放或者动画实际的UI组件（按钮，标题栏等）来提供与用户的互动时。

4.2K0 0

CoordinatorLayout使用全解析

exitUntilCollapsed：当你定义了一个minHeight，此布局将在滚动到达这个最小高度的时候折叠。 snap：当一个滚动事件结束，如果视图是部分可见的，那么它将被滚动到收缩或展开。...CollapsingToolbarLayout可以通过app:contentScrim设置折叠时工具栏布局的颜色，通过app:statusBarScrim设置折叠时状态栏的颜色。...pin：CollapsingToolbarLayout折叠后，此布局将固定在顶部。 parallax：CollapsingToolbarLayout折叠时，此布局也会有视差折叠效果。...当CollapsingToolbarLayout的子布局设置了parallax模式时，我们还可以通过app:layout_collapseParallaxMultiplier设置视差滚动因子，值为：0~...RecyclerView的任意滚动事件都将触发AppBarLayout或者AppBarLayout里面view的改变。

2.2K2 0

自定义 Behavior，实现嵌套滑动、平滑切换周月视图的日历

onNestedPreFling 当 RecyclerView 或 NestedScrollView 滑动时，CoordinatorLayout 的子控件 Behavior 可以接收到对应的回调。...= 0; } onNestedPreScroll 这个方法是在准备滚动之前调用的，它带有滚动偏移量 dy。...分析一下这个折叠效果。滚动时，日历也向上滚动，最多到当前选中日期那一行，滚动范围和当前选中日期有关。...折叠过程中，要将偏移量消费掉，这就用到了 consumed 这个参数，它是一个长度为 2 的数组，存放的是要消费掉的 x 和 y 轴偏移量。...由于我们的滚动折叠效果是在 onNestedPreScroll 实现的，所以要想办法触发这个方法。

3.4K1 0

可折叠设备的桌面模式

展开您的视频播放体验可折叠设备向用户们提供了使用他们的手机做更多事情的可能性，包括*桌面模式**等创新，也就是当手机平放时，铰链处于水平位置，同时折叠屏幕处于部分打开的状态。...这是一个简单的媒体播放器案例，它会自动调节尺寸以避免让折叠处出现在画面中间，并且调整播放控制组件的位置，从屏幕完全展开时嵌入画面中，变为当屏幕部分折叠时显示为单独的面板。...这样一来该控件会在屏幕完全展开时被隐藏，而当屏幕部分折叠时又出现在底部。请注意第 28 行的 layout_constraintGuide_end 属性。它就是当您移动参考线时需要改变的值。...当设备完全展开时，整个屏幕都会被用于显示主 PlayerView。最后的问题: 当设备折叠时，您应该将 ReactiveGuide 移动到哪里？...更多资源 Exoplayer Codelab: 用 Exoplayer 播放视频流桌面模式实例应用为可折叠设备而设计为可折叠设备构建应用 Jetpack WindowManager 使用 MotionLayout

2.4K3 0

react-native布局与组件

SafeAreaView 会自动根据系统的各种导航栏、工具栏等预留出空间来渲染内部内容。更重要的是，它还会考虑到设备屏幕的局限，比如屏幕四周的圆⻆角或是顶部中间不可显示的“非安全”区域。... Button：按钮一个简单的跨平台的按钮组件。可以进行一些简单的定制。如图，前者为安卓，后者为ios。...ActivityIndicator loading的小菊花显示一个loading提示符安卓设备时一个谷歌式半圆环，在ios设备上则显示一朵小菊花。...ListView底层实现，渲染组件Item是全量渲染，而且没有复用机制，当渲染较⼤数据量时，会不可避免地卡顿。...这个渲染窗⼝能响应滚动行为，元素离可视区越远优先级越低，越近优先级越高，当用户滑动速度过快时，会出现短暂空⽩的情况。

5.3K2 0

探索 MotionLayout 动画世界

transitionDisable ：指定是否禁用过渡动画。可以设置为true或false。 pathMotionArc ：指定过渡动画中路径的弧度。...springStopThreshold ：定义弹簧停止的阈值，当速度小于该值时，弹簧将停止弹动。...bounceEnd ：当拖拽到结束位置时弹簧会弹动。 bounceBoth ：当拖拽到开始或结束位置时弹簧会弹动。 rotationCenterId ：定义旋转中心的视图 ID。...disableScroll ：禁止滚动。 supportScrollUp ：支持向上滚动。 moveWhenScrollAtTop ：定义是否在滚动到顶部时允许拖拽。...= 1)，当framePosition = 50 时，view位于坐标系中(0.5，0.2)的位置，宽度变为 0.8，高度变为0.8，相当于此时view的宽高为 600px x 0.8。

1791 0

RecyclerView必知必会

但是RecyclerView的出现会让很多开源项目被废弃，例如横向滚动的ListView, 横向滚动的GridView, 瀑布流控件，因为RecyclerView能够实现所有这些功能。...这个问题的描述是：当Item视图中有图片和文字，当更新文字并调用notifyItemChanged()时，文字改变的同时图片会闪一下。...ListView提供了setEmptyView()设置Adapter数据为空时的View视图。...通过AdapterDataObserver监听RecyclerView的数据变化，如果adapter为空，那么隐藏RecyclerView，显示EmptyView。...实现中需要注意的点有：我们为ToolBar的app:layout_collapseMode设置为pin，表示折叠之后固定在顶端，而为ImageView的app:layout_collapseMode设置为

4.7K2 0

Ext4.0中window窗体使用详解(常用属性)

0个项目 autoScroll:true,//容器过高或者过宽时，窗体自动显示滚动条 baseCls : 'x-window',//默认样式 bbar: [...销毁 cls:'',//class样式,默认为空 collapsible : true,//可折叠 //collapsed : false,折叠状态 //columnWidth...: 100,//列布局时的列宽 constrain : true,//设置窗体活动区域不能超过浏览器内容区域 //constrainHeader : true,设置窗体活动区域可以移动超过浏览器下方...//constrainTo : Ext.getBody(),//设置窗体只能在body部分 //disabled : false,//禁用 //draggable : false...,//禁止拖动 frame : true,//设置为应用框架 formBind : false,//绑定form hideCollapseTool : true,//隐藏关闭，显示工具栏

2.4K1 0

RecyclerView 必知必会

但是RecyclerView的出现会让很多开源项目被废弃，例如横向滚动的ListView, 横向滚动的GridView, 瀑布流控件，因为RecyclerView能够实现所有这些功能。...这个问题的描述是：当Item视图中有图片和文字，当更新文字并调用notifyItemChanged()时，文字改变的同时图片会闪一下。...添加setEmptyView ListView提供了setEmptyView()设置Adapter数据为空时的View视图。RecyclerView虽然没提供直接的API，但是也可以很简单地实现。...通过AdapterDataObserver监听RecyclerView的数据变化，如果adapter为空，那么隐藏RecyclerView，显示EmptyView。具体实现如下： ?...实现中需要注意的点有：我们为ToolBar的app:layout_collapseMode设置为pin，表示折叠之后固定在顶端，而为ImageView的app:layout_collapseMode设置为

4.2K9 0

RecyclerView 必知必会

但是RecyclerView的出现会让很多开源项目被废弃，例如横向滚动的ListView, 横向滚动的GridView, 瀑布流控件，因为RecyclerView能够实现所有这些功能。...这个问题的描述是：当Item视图中有图片和文字，当更新文字并调用notifyItemChanged()时，文字改变的同时图片会闪一下。...添加setEmptyView ListView提供了setEmptyView()设置Adapter数据为空时的View视图。RecyclerView虽然没提供直接的API，但是也可以很简单地实现。...通过AdapterDataObserver监听RecyclerView的数据变化，如果adapter为空，那么隐藏RecyclerView，显示EmptyView。具体实现如下： ?...实现中需要注意的点有：我们为ToolBar的app:layout_collapseMode设置为pin，表示折叠之后固定在顶端，而为ImageView的app:layout_collapseMode设置为

2.6K7 0

CoordinatorLayout与滚动的处理

，app:layout_behavior的为自定义的效果，当下滑时，fab消失，上滑时fab显示，详情请查看本人博客 Floating Action Button-Android M新控件运行图 ?...exitUntilCollapsed: 同样顾名思义，这个flag时定义何时退出，当你定义了一个minHeight，这个view将在滚动到达这个最小高度的时候消失。...记住，要把带有scroll flag的view放在前面，这样收回的view才能让正常退出，而固定的view继续留在顶部。此时，你应该注意到我们的Toolbar能够响应滚动事件了。 ?...当滚动发生的时候，CoordinatorLayout会尝试触发那些声明了依赖的子view。...这个behavior用于当滚动发生的时候让AppBarLayout发生改变。

8072 0

安卓天气预报app(四)——搜索城市、完善页面

✅简易的安卓天气app(一)——解析Json数据、数据类封装 ✅简易的安卓天气app(二)——适配器、每小时数据展示 ✅简易的安卓天气app(三)——城市管理、数据库操作简易的安卓天气app(四)—...第二层就是一个搜索框，使用到的是AutoCompleteTextView，带有提示信息的输入框，EditView也可以，右边搜索图标设置点击监听事件。...后续会更新，适配器也是安卓提供的ArrayAdapter，传入的是全国所有市的String[]数组。..._1安卓提供的样式，就是简单的白框，然后传入城市的数组；在此之前，这个城市数组还得定义好，前面Json数据解析我们已经知道，从City.txt文件已经拿到了全部城市，并成功传值给mCityBeanList...api查询城市时传入的城市名称不能带市，只能北京，天津，上海，不可北京市，上海市。

1.9K5 1

挥别web移动端开发差异和经典坑

在滚动容器上增加滚动 touch 方法 .wrapper { -webkit-overflow-scrolling: touch; } 设置overflow : 设置外部 overflow 为 hidden.... auto: 使用普通滚动, 当手指从触摸屏上移开，滚动会立即停止。...touch: 使用具有回弹效果的滚动, 当手指从触摸屏上移开，内容会继续保持一段时间的滚动效果。继续滚动的速度和持续的时间和滚动手势的强烈程度成正比。同时也会创建一个新的堆栈上下文。...时间：201908 部分安卓机器点击键盘发送相同内容描述：部分安卓机，如oppo 快速点击键盘发送，会发出2条一样的内容，防抖与节流均不生效；时间：201907 微信公众号安卓在微信授权回调带#...的URL跳转会出现空白描述：安卓手机，在微信授权回调的函数中进行跳转至的URL不能带有#,但#号可放置在结尾。

2.9K2 0

Android开发笔记（一百三十七）自定义行为Behavior

一般我们使用CoordinatorLayout，都是结合悬浮按钮FloatingActionButton、应用栏布局AppBarLayout或者可折叠工具栏布局CollapsingToolbarLayout...先上个图，说明一下自定义行为所支持的画面： ? 从这张女孩照镜子的动画可以看到，当拖动左边女孩头像时，右边镜子里的头像也随之靠近或者远离，颇似现实生活中的镜像运动。...:layout_behavior="@string/appbar_scrolling_view_behavior"，表示通知AppBarLayout捕捉RecyclerView的滚动操作。...首先在layoutDependsOn方法中判断依赖视图是否为SnackbarLayout的示例，表示悬浮按钮会跟着提示条一块运动。...比如AppBarLayout节点的layout_behavior属性，便定义了AppBarLayout跟随主页面视图如RecyclerView的运动行为。

1.3K2 0

折叠屏上应用设计规范，了解一下？

这一做法在小屏上或许行得通，当屏幕尺寸较大时就会出现明显的问题。网格系统则将您的布局划分为一系列栏，从而帮助您在规范网格中设计更具表现力的布局。...针对每个页面，您可以思考一下，当屏幕尺寸变大时，可以添加什么内容。当屏幕尺寸变小时，可以删除哪些内容。然后再选择合适的策略。...这可能意味着您需要重新审视导航图，尤其是当您目前的设计以手机为主时更应如此。如需构建响应式界面，我们应该优先考虑界面中长驻元素的位置，例如导航元素。...△ 铰链区域当设备从折叠模式转换到非折叠模式时，有两种主要的技术方案可用于设计布局。第一种是扩大屏幕，该方案采用了一种简单的响应式布局，在该布局下应用会扩展内容并填充到屏幕上。...FoldingFeature 中还包含窗口中的折叠位置，当折叠导致内容视图被割裂时，我们应该及时更新布局参数。

4.5K2 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭