使用animated-rotate来实现Picasso载入图片前的等待动画

发表于 更新于 分类于

Picasso 想必大家都非常熟悉了，使用 Picasso 来载入一张网络图片也是非常简单的一件事情：

1
Picasso.with(mContext).load(mImageUrl).into(mIvImage);

当网络图片较大时，加载图片需要较长时间，这时候显示一个空白的 ImageView 对用户而言并不友好，我们需要用一个加载动画来提示用户正在加载图片，这时应该怎么做呢？

方法一：使用 ProgressDialog 来提示用户，在图片加载完毕后关闭 Dialog

这种方法需要用到 Picasso 的回调函数：

1
2
3
4
5
6
7
8
9
10
11
Picasso.with(mContext)
        .load(mImageUrl)
        .into(mIvImage, new Callback() {
            @Override
            public void onSuccess() {
                
            }
            @Override
            public void onError() {
            }
        });

在回调方法中来关闭 Dialog 即可。

这种方法存在的局限性是，适合整个页面是一个 ImageView ，比如那种查看图片详情的页面。

方法二：使用 animated-rotate 与 placeholder()

我们找到一个如下图所示的加载图：
loading.png
只需要将这个图片不断的基于中心店旋转就可以变成一个加载动画了。

Picasso 的 placeholder() 方法支持传入一个 Drawable 资源 ID，Drawable 文件 animated_rotate_drawable.xml 如下：

1
2
3
4
5
6
7
<?xml version="1.0" encoding="utf-8"?>
<animated-rotate
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:pivotX="50%"
    android:pivotY="50%"
    android:drawable="@drawable/loading">
</animated-rotate>

Java 代码如下：

1
2
3
4
Picasso.with(mContext)
        .load(mImageUrl)
        .placeholder(R.drawable.animated_rotate_drawable)
        .into(mIvImage);

怎么样是不是超级简单的实现了加载等待的动画效果了 :-D ！如果对你有帮助请点赞哦！