Android 图片Loading旋转动画效果

简介: 用场景:在数据请求或者一些加载的页面中,总需要一些过度的动画效果,很多时候我们都可以在图片中间加一个loading的旋转图片,以前也做过,今天做的时候噼里啪啦敲了半天结果运行没效果,所以今天总结下这个啷个做的。

使用场景:在数据请求或者一些加载的页面中,总需要一些过度的动画效果,很多时候我们都可以在图片中间加一个loading的旋转图片,以前也做过,今天做的时候噼里啪啦敲了半天结果运行没效果,所以今天总结下这个啷个做的。


例子:我们要加载一个webView,需要在加载前的空白页面中间加一个旋转的loading图片,结束后就消失。


布局xml:就是一个全屏的webView+居中的loading图片


第一个方法:使用Android自带的 AnimationUtils.loadAnimation



代码:


anim文件下的动画xml:


<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="0"//旋转的起始角度
    android:toDegrees="359"//旋转的终点角度
    android:pivotX="50%"//旋转的X中心,50%就是中间
    android:pivotY="50%"//旋转的y中心,50%就是中间
    android:duration="1000"//每次动画执行的时间,越小转的越快
    android:repeatCount="-1"//执行次数,-1就是无限次
 />
url = "www.baidu.com"
        url?.let { webView.loadUrl(it) }
        context?.let {
            val a = AnimationUtils.loadAnimation(it, R.anim.blv_loading_white_policy)
            a.interpolator = LinearInterpolator()//匀速执行
            webViewLoading.startAnimation(a)//view.startAnimation 执行动画
        }
        webView.onLoading = { _, isFinish ->//只是个回调面,进度达到100%就结束动画,图片隐藏
            if (isFinish) {
                webViewLoading.clearAnimation()
                webViewLoading.visibility = View.GONE
            }
        }


关键属性:


1.interpolator:俗称插值器,负责控制动画变化的速率,使得基本的动画能够以匀速、加速、减速、抛物线等等各种变化。


AccelerateDecelerateInterpolator,效果是开始和结束的速率比较慢,中间加速;

AccelerateInterpolator,效果是开始速率比较慢,后面加速;

DecelerateInterpolator,效果是开始速率比较快,后面减速;

LinearInterpolator,效果是速率是恒定的;

AnticipateInterpolator,效果是开始向后甩,然后向前;

AnticipateOvershootInterpolator,效果是开始向后甩,冲到目标值,最后又回到最终值;

OvershootInterpolator,效果开始向前甩,冲到目标值,最后又回到了最终值;

BounceInterpolator,效果是在结束时反弹;

CycleInterpolator,效果是循环播放,速率是正弦曲线;

TimeInterpolator,一个接口,可以自定义插值器。

2.clearAnimation(),一定记得要调用,不然会使得webViewLoading.visibility = View.GONE这句话无效,他还是会展示


3.animation.setFillAfter(true);//动画终止时停留在最后一帧,如果设置为false,则会回到最开始的位置,有些场景会很不好看,例如网易云播放时的旋转图片。


第二个方法:使用RotateAnimation



代码:这儿的webViewLoading为一个ImageView,这儿就不需要给一个anim文件了,直接在xml里配置了src属性,就是一张普通的图片。


 

override fun initView() {
        url = UTownRepo.userPrivatePolicyHtmlUrl
        url?.let { webView.loadUrl(it) }
        initAndStartAnim()
        webView.onLoading = { progress, isFinish ->
            if (isFinish) {
                stopAnim()
            }
        }
    }
    override fun onDestroyView() {
        webView.destroy()
        super.onDestroyView()
    }
    private fun initAndStartAnim() {
        // 创建旋转动画
        animation = RotateAnimation(
            0f,
            360f,
            Animation.RELATIVE_TO_SELF,
            0.5f,
            Animation.RELATIVE_TO_SELF,
            0.5f
        )
        animation!!.duration = 1000
        // 动画的重复次数
        animation!!.repeatCount = Animation.INFINITE
        // 设置为true,动画转化结束后被应用
        animation!!.fillAfter = true
        animation!!.interpolator = LinearInterpolator()
        // 开始动画
        webViewLoading.startAnimation(animation)
    }
    private fun stopAnim() {
        if (animation != null) {
            animation?.cancel()
        }
        animation = null
        webViewLoading.clearAnimation()
        webViewLoading.visibility = View.GONE
    }

eg:animation只是操作View 的位图表示(bitmap representation),而不是真正的改变View的位置,位图就是bitmap,关于bitmap,可以去好好学习一下!


相关文章
|
3月前
|
存储 Shell Android开发
基于Android P,自定义Android开机动画的方法
本文详细介绍了基于Android P系统自定义开机动画的步骤,包括动画文件结构、脚本编写、ZIP打包方法以及如何将自定义动画集成到AOSP源码中。
68 2
基于Android P,自定义Android开机动画的方法
|
14天前
|
Android开发 UED
Android 中加载 Gif 动画
【10月更文挑战第20天】加载 Gif 动画是 Android 开发中的一项重要技能。通过使用第三方库或自定义实现,可以方便地在应用中展示生动的 Gif 动画。在实际应用中,需要根据具体情况进行合理选择和优化,以确保用户体验和性能的平衡。可以通过不断的实践和探索,进一步掌握在 Android 中加载 Gif 动画的技巧和方法,为开发高质量的 Android 应用提供支持。
|
2月前
|
存储 缓存 编解码
Android经典面试题之图片Bitmap怎么做优化
本文介绍了图片相关的内存优化方法,包括分辨率适配、图片压缩与缓存。文中详细讲解了如何根据不同分辨率放置图片资源,避免图片拉伸变形;并通过示例代码展示了使用`BitmapFactory.Options`进行图片压缩的具体步骤。此外,还介绍了Glide等第三方库如何利用LRU算法实现高效图片缓存。
61 20
Android经典面试题之图片Bitmap怎么做优化
|
3月前
|
数据处理 开发工具 数据安全/隐私保护
Android平台RTMP推送|轻量级RTSP服务|GB28181接入之文字、png图片水印的精进之路
本文探讨了Android平台上推流模块中添加文字与PNG水印的技术演进。自2015年起,为了满足应急指挥及安防领域的需求,逐步发展出三代水印技术:第一代为静态文字与图像水印;第二代实现了动态更新水印内容的能力,例如实时位置与时间信息;至第三代,则优化了数据传输效率,直接使用Bitmap对象传递水印数据至JNI层,减少了内存拷贝次数。这些迭代不仅提升了用户体验和技术效率,也体现了开发者追求极致与不断创新的精神。
|
3月前
|
自然语言处理 定位技术 API
Android经典实战之如何获取图片的经纬度以及如何根据经纬度获取对应的地点名称
本文介绍如何在Android中从图片提取地理位置信息并转换为地址。首先利用`ExifInterface`获取图片内的经纬度,然后通过`Geocoder`将经纬度转为地址。注意操作需在子线程进行且考虑多语言支持。
218 4
|
4月前
|
XML Android开发 数据格式
Android 中如何设置activity的启动动画,让它像dialog一样从底部往上出来
在 Android 中实现 Activity 的对话框式过渡动画:从底部滑入与从顶部滑出。需定义两个 XML 动画文件 `activity_slide_in.xml` 和 `activity_slide_out.xml`,分别控制 Activity 的进入与退出动画。使用 `overridePendingTransition` 方法在启动 (`startActivity`) 或结束 (`finish`) Activity 时应用这些动画。为了使前 Activity 保持静止,可定义 `no_animation.xml` 并在启动新 Activity 时仅设置新 Activity 的进入动画。
91 12
|
3月前
|
XML 前端开发 Android开发
Android经典实战之Kotlin中实现圆角图片和圆形图片
本文介绍两种实现圆角图像视图的方法。第一种是通过自定义Kotlin `AppCompatImageView`,重写`onDraw`方法使用`Canvas`和`Path`进行圆角剪裁。第二种利用Android Material库中的`ShapeableImageView`,简单配置即可实现圆角效果。两种方法均易于实现且提供动态调整圆角半径的功能。
64 0
|
4月前
|
XML Android开发 UED
Android动画之共享元素动画简单实践
本文介绍Android共享元素动画, 实现两Activity间平滑过渡特定UI元素。通过设置`transitionName`属性和使用`ActivityOptions.makeSceneTransitionAnimation`启动目标Activity实现动画效果。可自定义过渡动画提升体验。
59 0
|
5月前
|
Android开发 UED
Android Item平移动画
【6月更文挑战第18天】
105 8