Kotlin--›Android 极致体验,图片转场动画(类似微信/QQ图片查看效果, 带拖拽返回, 高扩展, 支持任意类型界面过渡)

效果图(大于2MB):
在这里插入图片描述
本文核心:

Transition
TransitionManager

1. Transition 入门

转场动画, 是由若干个Transition对象组成的, 而Transition的本质, 依旧是Animator, 毕竟这才是Android的动画.

所以, Transition的作用, 就是用来创建 Animator 的.

Transition 的核心方法如下:

  public abstract void captureStartValues(@NonNull TransitionValues var1);

  public abstract void captureEndValues(@NonNull TransitionValues var1);
  
  @Nullable
   public Animator createAnimator(@NonNull ViewGroup sceneRoot, @Nullable TransitionValues startValues, @Nullable TransitionValues endValues) {
        return null;
   }

captureStartValues

此方法的作用, 就是保存动画开始时, 需要的值

captureEndValues

此方法的作用, 就是保存动画结束时, 需要的值

createAnimator

通过动画开始的值动画结束的值 创建动画.

举个例子:

例子1: ColorTransition(颜色过渡动画)

class ColorTransition : Transition() {
    companion object {
        private const val KEY = "android:ColorTransition:color"
    }

    override fun captureStartValues(values: TransitionValues) {
        captureValues(values)
    }

    override fun captureEndValues(values: TransitionValues) {
        captureValues(values)
    }

    private fun captureValues(values: TransitionValues) {
        val view = values.view
        if (targets.contains(view)) {
            (view.background as? ColorDrawable)?.let {
                values.values[KEY] = it.color
            }
        }
    }

    override fun createAnimator(
        sceneRoot: ViewGroup,
        startValues: TransitionValues?,
        endValues: TransitionValues?
    ): Animator? {
        if (startValues != null && endValues != null) {
            val startColor = startValues.values[KEY]
            val endColor = endValues.values[KEY]

            if (startColor != endColor) {
                val colorAnimator = ValueAnimator.ofObject(ArgbEvaluator(), startColor, endColor)
                colorAnimator.addUpdateListener { animation ->
                    val color = animation.animatedValue as Int//之后就可以得到动画的颜色了.
                    startValues.view.setBackgroundColor(color)//设置一下, 就可以看到效果..
                }
                colorAnimator.duration = duration
                colorAnimator.interpolator = interpolator
                return colorAnimator
            }
        }
        return null
    }
}

例子2: AlphaTransition(透明度过渡动画)

class AlphaTransition : Transition() {
    companion object {
        private const val KEY = "android:AlphaTransition:alpha"
    }

    override fun captureStartValues(values: TransitionValues) {
        captureValues(values)
    }

    override fun captureEndValues(values: TransitionValues) {
        captureValues(values)
    }

    private fun captureValues(values: TransitionValues) {
        val view = values.view
        if (targets.contains(view)) {
            values.values[KEY] = view.alpha
        }
    }

    override fun createAnimator(
        sceneRoot: ViewGroup,
        startValues: TransitionValues?,
        endValues: TransitionValues?
    ): Animator? {
        if (startValues != null && endValues != null) {
            val startAlpha: Float = startValues.values[KEY] as Float
            val endAlpha: Float = endValues.values[KEY] as Float

            if (startAlpha != endAlpha) {
                val animator = ValueAnimator.ofFloat(startAlpha, endAlpha)
                animator.addUpdateListener { animation ->
                    val value = animation.animatedValue as Float
                    startValues.view.alpha = value
                }
                animator.duration = duration
                animator.interpolator = interpolator
                return animator
            }
        }
        return null
    }
}

到这里, 是不是 觉得Transition很简单?

其实就是这么简单.

那怎么使用Transition对象呢?
莫急.
接下来就是…

2.TransitionManager 使用

注意,注意,注意:

使用Transition三步骤:

  1. 设置动画view动画开始时的属性
  2. 创建Transition对象, 调用 TransitionManager#beginDelayedTransition 方法.
  3. 设置动画view动画结束时的属性

之后, 动画就会自动执行.

写成代码就是如下步骤:

 open fun doTransition() {
     onTransitionBeforeValues()  //对应步骤1
     post { //请注意, post是核心操作, 必须使用post, 否则 `动画view`的属性还没有被 `captureStartValues` 捕捉, 就被 `onTransitionAfterValues` 覆盖了.
         onCreateTransition()    //对应步骤2
         onTransitionAfterValues()  //对应步骤3
     }
 }
 open fun createTransitionSet(): TransitionSet {
       val transitionSet = TransitionSet()
       transitionSet.addTransition(ChangeTransform())
       transitionSet.addTransition(ChangeScroll())
       transitionSet.addTransition(ChangeClipBounds())
       transitionSet.addTransition(ChangeImageTransform())
       transitionSet.addTransition(ChangeBounds())
       transitionSet.addTransition(ColorTransition())

       transitionSet.duration = ANIM_DURATION
       transitionSet.interpolator = FastOutSlowInInterpolator()
       transitionSet.addTarget(rootLayout)
       return transitionSet
   }

明白了核心关键, 剩下的就是针对项目的逻辑封装了.

各位, 请直接前往 砖厂地址 查看.

友情提示

如果使用Glide加载图片, 请使用原始大小的图片 requestOptions.override(Target.SIZE_ORIGINAL) , 否则图片在过渡的时候, 不能做到无缝切换.


群内有各(pian)种(ni)各(jin)样(qun)的大佬,等你来撩.

联系作者

点此快速加群

请使用QQ扫码加群, 小伙伴们都在等着你哦!

关注我的公众号, 每天都能一起玩耍哦!

已标记关键词 清除标记
课程简介: 历经半个多月的时间,Debug亲自撸的 “企业员工角色权限管理平台” 终于完成了。正如字面意思,本课程讲解的是一个真正意义上的、企业级的项目实战,主要介绍了企业级应用系统中后端应用权限的管理,其中主要涵盖了六大核心业务模块、十几张数据库表。 其中的核心业务模块主要包括用户模块、部门模块、岗位模块、角色模块、菜单模块和系统日志模块;与此同时,Debug还亲自撸了额外的附属模块,包括字典管理模块、商品分类模块以及考勤管理模块等等,主要是为了更好地巩固相应的技术栈以及企业应用系统业务模块的开发流程! 核心技术栈列表: 值得介绍的是,本课程在技术栈层面涵盖了前端和后端的大部分常用技术,包括Spring Boot、Spring MVC、Mybatis、Mybatis-Plus、Shiro(身份认证与资源授权跟会话等等)、Spring AOP、防止XSS攻击、防止SQL注入攻击、过滤器Filter、验证码Kaptcha、热部署插件Devtools、POI、Vue、LayUI、ElementUI、JQuery、HTML、Bootstrap、Freemarker、一键打包部署运行工具Wagon等等,如下图所示: 课程内容与收益: 总的来说,本课程是一门具有很强实践性质的“项目实战”课程,即“企业应用员工角色权限管理平台”,主要介绍了当前企业级应用系统中员工、部门、岗位、角色、权限、菜单以及其他实体模块的管理;其中,还重点讲解了如何基于Shiro的资源授权实现员工-角色-操作权限、员工-角色-数据权限的管理;在课程的最后,还介绍了如何实现一键打包上传部署运行项目等等。如下图所示为本权限管理平台的数据库设计图: 以下为项目整体的运行效果截图: 值得一提的是,在本课程中,Debug也向各位小伙伴介绍了如何在企业级应用系统业务模块的开发中,前端到后端再到数据库,最后再到服务器的上线部署运行等流程,如下图所示:
©️2020 CSDN 皮肤主题: 猿与汪的秘密 设计师:上身试试 返回首页