Android动画的小小使用

前言

在 Android 开发中,系统自带的属性动画(如 ObjectAnimatorValueAnimator)虽然功能强大,但在复杂动画场景下,第三方动画库能提供更高效的开发体验和更丰富的效果。本文将深入解析 LottieMotionLayoutAndroidViewAnimationsRebound 等热门第三方动画库,提供详细的代码实现、对比分析及关键点总结,助力开发者快速选择合适的工具。


一、Lottie(Airbnb)

定位 :复杂矢量动画(JSON 格式)的渲染引擎,适合加载动画、复杂交互动画。
对比 :相比传统帧动画(AnimationDrawable),Lottie 的 JSON 动画体积更小、可编辑性更强,且支持动态修改属性。


1. 使用步骤与代码实现

1.1 添加依赖

gradle 复制代码
// build.gradle (Module)
dependencies {
    implementation 'com.airbnb.android:lottie:6.1.0' // 使用最新版本
}

1.2 准备动画资源

  • LottieFiles 下载 JSON 文件,或通过 Adobe After Effects 导出。
  • 将 JSON 文件放入 res/raw 目录(如 loading.json)。

1.3 XML 布局配置

xml 复制代码
<com.airbnb.lottie.LottieAnimationView
    android:id="@+id/lottie_view"
    android:layout_width="200dp"
    android:layout_height="200dp"
    app:lottie_rawRes="@raw/loading"
    app:lottie_loop="true"
    app:lottie_autoPlay="false" />

1.4 代码控制动画

kotlin 复制代码
val lottieView = findViewById<LottieAnimationView>(R.id.lottie_view)

// 播放动画
lottieView.playAnimation()

// 暂停动画
lottieView.pauseAnimation()

// 动态修改颜色(Kotlin 扩展函数)
lottieView.setAnimation("loading.json")
lottieView.setColorFilterToLayer("icon_layer", Color.RED)

// 监听动画事件
lottieView.addAnimatorListener(object : Animator.AnimatorListener {
    override fun onAnimationStart(animation: Animator) {}
    override fun onAnimationEnd(animation: Animator) {}
    override fun onAnimationCancel(animation: Animator) {}
    override fun onAnimationRepeat(animation: Animator) {}
})

2. 关键点总结

  • 优点
    • 支持 After Effects 复杂动画,设计师可直接参与开发。
    • 高性能渲染,支持硬件加速。
  • 缺点
    • JSON 文件可能较大,需压缩优化。
    • 动态修改部分属性需通过代码实现。
  • 适用场景:启动页动画、复杂图标动效、动态插画。

二、MotionLayout(Google)

定位 :基于 ConstraintLayout 的布局过渡动画库,适合实现视图间的平滑切换效果。
对比:相比传统属性动画,MotionLayout 直接在 XML 中定义动画逻辑,减少代码量,且支持触摸交互。


1. 使用步骤与代码实现

2.1 添加依赖

gradle 复制代码
dependencies {
    implementation 'androidx.constraintlayout:constraintlayout:2.1.4'
}

2.2 定义 MotionScene 文件

  • 创建 res/xml/scene_login.xml,定义起始和结束布局状态:
xml 复制代码
<MotionScene xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <Transition
        app:constraintSetStart="@id/collapsed"
        app:constraintSetEnd="@id/expanded"
        app:duration="1000">
        <OnClick app:targetId="@id/button_expand" />
    </Transition>

    <!-- 初始状态:折叠 -->
    <ConstraintSet android:id="@+id/collapsed">
        <Constraint
            android:id="@id/header"
            android:layout_width="match_parent"
            android:layout_height="100dp"
            app:layout_constraintTop_toTopOf="parent" />
    </ConstraintSet>

    <!-- 结束状态:展开 -->
    <ConstraintSet android:id="@+id/expanded">
        <Constraint
            android:id="@id/header"
            android:layout_width="match_parent"
            android:layout_height="300dp"
            app:layout_constraintTop_toTopOf="parent" />
    </ConstraintSet>
</MotionScene>

2.3 在布局中关联 MotionScene

xml 复制代码
<androidx.constraintlayout.motion.widget.MotionLayout
    android:id="@+id/motion_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layoutDescription="@xml/scene_login">

    <View
        android:id="@+id/header"
        android:background="#FF5722" />

    <Button
        android:id="@+id/button_expand"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent" />
</androidx.constraintlayout.motion.widget.MotionLayout>

2.4 代码控制过渡动画

kotlin 复制代码
val motionLayout = findViewById<MotionLayout>(R.id.motion_layout)

// 动态切换动画状态
motionLayout.transitionToEnd() // 切换到结束状态
motionLayout.transitionToStart() // 切换回初始状态

// 监听动画进度
motionLayout.setTransitionListener(object : MotionLayout.TransitionListener {
    override fun onTransitionStarted(layout: MotionLayout, startId: Int, endId: Int) {}
    override fun onTransitionChange(layout: MotionLayout, progress: Float) {}
    override fun onTransitionCompleted(layout: MotionLayout, currentId: Int) {}
    override fun onTransitionTrigger(layout: MotionLayout, triggerId: Int, positive: Boolean, progress: Float) {}
})

2. 关键点总结

  • 优点
    • 在 XML 中完成复杂动画定义,减少代码耦合。
    • 支持触摸拖动交互(如抽屉菜单展开)。
  • 缺点
    • 学习成本较高,需熟悉 ConstraintSetTransition
    • 不适合非布局属性的动画(如颜色渐变)。
  • 适用场景:页面转场、可折叠布局、交互式视图动画。

三、AndroidViewAnimations(daimajia)

定位 :提供预定义视图动画(如弹跳、淡入淡出),快速实现常见动效。
对比 :相比系统 ViewPropertyAnimator,API 更简洁,但灵活性较低。


1. 使用步骤与代码实现

3.1 添加依赖

gradle 复制代码
dependencies {
    implementation 'com.daimajia.androidanimations:library:2.4@aar'
}

3.2 代码中使用预定义动画

kotlin 复制代码
import com.daimajia.androidanimations.library.Techniques
import com.daimajia.androidanimations.library.YoYo

// 弹跳动画
YoYo.with(Techniques.Bounce)
    .duration(1000)
    .repeat(2)
    .playOn(view)

// 渐入动画
YoYo.with(Techniques.FadeIn)
    .duration(500)
    .playOn(view)

// 自定义插值器
YoYo.with(Techniques.Pulse)
    .duration(1000)
    .interpolate(AccelerateDecelerateInterpolator())
    .playOn(view)

2. 关键点总结

  • 优点
    • 一行代码实现常见动画,开发效率极高。
    • 支持链式调用,可配置重复次数、插值器等。
  • 缺点
    • 无法自定义动画属性(如缩放比例、旋转角度)。
    • 库已停止更新,兼容性需测试。
  • 适用场景:快速实现简单动效(如按钮点击反馈)。

四、Rebound(Facebook)

定位 :基于弹簧物理模型的动画库,适合实现弹性效果。
对比 :相比系统 SpringAnimation,Rebound 提供更精细的物理参数控制。


1. 使用步骤与代码实现

4.1 添加依赖

gradle 复制代码
dependencies {
    implementation 'com.facebook.rebound:rebound:0.3.8'
}

4.2 代码示例:弹性缩放

kotlin 复制代码
val springSystem = SpringSystem.create()
val spring = springSystem.createSpring()

// 配置弹簧参数
spring.springConfig = SpringConfig.fromOrigamiTensionAndFriction(100.0, 10.0)

// 监听弹簧值变化
spring.addListener(object : SpringListener {
    override fun onSpringUpdate(spring: Spring) {
        val value = spring.currentValue.toFloat()
        view.scaleX = value
        view.scaleY = value
    }
})

// 触发动画
spring.endValue = 1.0 // 目标值

2. 关键点总结

  • 优点
    • 自然流畅的物理动画效果。
    • 支持自定义弹簧刚度、阻尼系数。
  • 缺点
    • 需手动处理属性更新逻辑。
    • 文档较少,调试成本高。
  • 适用场景:弹性按钮、动态图标、物理模拟效果。

五、综合对比与选型指南

库名称 核心优势 适用场景 学习成本 性能影响
Lottie 复杂矢量动画支持 启动页、动态插画
MotionLayout 布局过渡动画 页面转场、交互式布局
AndroidViewAnimations 快速实现预定义动画 按钮反馈、简单动效
Rebound 物理弹簧效果 弹性控件、物理模拟

六、总结

  • Lottie 是设计师与开发者协作的首选工具,适合需要复杂矢量动画的场景。
  • MotionLayout 在布局过渡动画中表现卓越,但需投入时间学习 XML 配置。
  • AndroidViewAnimationsYoYo 适合快速实现简单动效,提升开发效率。
  • Rebound 在需要物理交互的场景下不可替代,但需手动控制动画细节。

根据项目需求选择合适的动画库,既能提升用户体验,又能避免过度设计。

相关推荐
CV资深专家5 小时前
在 Android 框架中,接口的可见性规则
android
daifgFuture9 小时前
Android 3D球形水平圆形旋转,旋转动态更换图片
android·3d
雨白10 小时前
Kotlin 的延迟初始化和密封类
kotlin
二流小码农10 小时前
鸿蒙开发:loading动画的几种实现方式
android·ios·harmonyos
爱吃西红柿!11 小时前
fastadmin fildList 动态下拉框默认选中
android·前端·javascript
悠哉清闲12 小时前
工厂模式与多态结合
android·java
大耳猫12 小时前
Android SharedFlow 详解
android·kotlin·sharedflow
火柴就是我13 小时前
升级 Android Studio 后报错 Error loading build artifacts from redirect.txt
android
androidwork14 小时前
掌握 MotionLayout:交互动画开发
android·kotlin·交互
奔跑吧 android14 小时前
【android bluetooth 协议分析 14】【HFP详解 1】【案例一: 手机侧显示来电,但车机侧没有显示来电: 讲解AT+CLCC命令】
android·hfp·aosp13·telecom·ag·hf·headsetclient