Android:LayoutAnimal的神奇效果

大家好,我是时曾相识2022。不喜欢唱跳篮球,但对杰伦的Rap却情有独钟。

今天给大家讲讲酷炫的动画成员------LayoutAnimal。话不多说,直接上一个简单的效果图:

怎么样,和往常自己写的没有动画效果的页面比起来是不是更加酷炫。效果图只展示了从右到左叠加渐变的效果,只要脑洞够大,LayoutAnimal 是可以帮你实现各类动画的。接下来就让我们看看LayoutAnimal如何实现这样的效果。

首先,新建一个XML动画文件slide_from_right.xml:

ini 复制代码
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="600">
    <translate
        android:fromXDelta="100%p"
        android:interpolator="@android:anim/decelerate_interpolator"
        android:toXDelta="0" />

    <alpha
        android:fromAlpha="0.5"
        android:interpolator="@android:anim/accelerate_decelerate_interpolator"
        android:toAlpha="1" />
</set>

set标签下由translate (移动)和alpha(渐变)动画组成。

其中translate (移动)动画由100%p移动到0。这里需要注意使用的是100%p,其中加这个p是指按父容器的宽度进行百分比计算。插值器就根据自己想要的效果设置,这里使用了一个decelerate_interpolator(减速)插值器。

第二个动画是alpha(渐变)动画,由半透明到不透明,其中插值器是先加速后减速的效果。

接着我们还需要创建一个layoutAnimation,其实也是一个XML文件layout_slid_from_right.xml:

ini 复制代码
<layoutAnimation xmlns:android="http://schemas.android.com/apk/res/android"
    android:animation="@anim/slide_from_right"
    android:animationOrder="normal"
    android:delay="15%"/>

其中animation指定的就是我们创建的第一个xml文件。animationOrder是指动画执行的顺序模式,包含normal, reverse 和random。normal就是从上到下依次进行,reverse根据名字就知道是反序,random那当然是随机了,我们就使用mormal即可。delay则是每个子视图执行动画的延迟比例,这里需要注意的是这是相对于上个子视图执行动画延时比例。

最后我们只需要在咱们的ViewGroup中设置layoutAnimation属性即可:

ini 复制代码
android:layoutAnimation="@anim/layout_slid_from_right"

当然也可在代码中手动设置:

ini 复制代码
val lin = findViewById<LinearLayout>(R.id.linParent)
val resId = R.anim.layout_slid_from_right
lin.layoutAnimation = AnimationUtils.loadLayoutAnimation(lin.context, resId)

总结:

  • layoutAnimation可以使用在任何一个ViewGroup上
  • 在使用set标签做动画叠加的时候一定要注意,set标签内需要添加duration属性,也就是动画时间。如果不加动画是没有效果的。
  • 使用移动动画时,在百分比后面添加p的意思是基于父容器宽度进行百分比计算

以上便是LayoutAnimal的简单使用,只要你脑洞大开,各种各样的效果都能玩出来。实现起来也很简单,赶紧在项目中使用起来吧。

相关推荐
huibin1478523692 小时前
热缓解学习记录
android·学习
ZZH_AI项目交付3 小时前
Apple Silicon 模拟器遇到旧版 MLKit:一次完整的依赖排查
ios·app·编译器
我命由我123454 小时前
匈牙利命名法
java·服务器·后端·学习·java-ee·kotlin·学习方法
小田的博客4 小时前
SAP MM 供应商银行主数据更新报错!message R1228!
android·java·服务器
GitLqr5 小时前
Flutter 实战:为你的 App 增加桌面快捷方式 (Quick Actions)
flutter·app·全栈
一笑的小酒馆6 小时前
Android智能猫砂盆视频加载慢卡顿问题分析
android
ZZH_AI项目交付7 小时前
一个 33,623 字节的 ViewController——拆开它我用了四步
ios·app·apple
只会cv的小前端7 小时前
七巧低代码服务端脚本使用方法
android·低代码·rxjava
7 小时前
Android 自定义 View 实战:从零打造工业级全向摇杆控件(OmniJoystickView)
android·kotlin·自定义view·摇杆控件
雨白7 小时前
深入理解 Kotlin 协程 (十一):以逸待劳,探秘 select 多路复用与并发安全策略
android·kotlin