如何在Picasso中加载真实图片前模糊显示缩略图？

嘿，我来帮你搞定这个模糊缩略图的需求！你已经找对路子了——用Picasso的Transformation接口来实现模糊效果，不过得确保你的BlurTransformation类是正确实现的，而且整体加载逻辑要理顺。

Picasso本身没有内置模糊变换，所以我们需要自己写一个基于RenderScript的模糊处理类，它能高效地处理图片模糊：

public class BlurTransformation implements Transformation {

    private RenderScript rs;
    private int blurRadius;
    private int sampling;

    // blurRadius：模糊半径（范围0-25，值越大越模糊）；sampling：采样率（>1时先缩小图片再模糊，提升性能）
    public BlurTransformation(Context context, int blurRadius, int sampling) {
        this.rs = RenderScript.create(context);
        this.blurRadius = blurRadius;
        this.sampling = sampling;
    }

    @Override
    public Bitmap transform(Bitmap source) {
        // 根据采样率创建缩小后的位图，减少计算量
        Bitmap blurredBitmap = Bitmap.createBitmap(
            source.getWidth() / sampling, 
            source.getHeight() / sampling, 
            Bitmap.Config.ARGB_8888
        );

        // 初始化RenderScript的模糊脚本
        ScriptIntrinsicBlur blurScript = ScriptIntrinsicBlur.create(rs, Element.U8_4(rs));
        Allocation input = Allocation.createFromBitmap(rs, source, Allocation.MipmapControl.MIPMAP_FULL, Allocation.USAGE_SHARED);
        Allocation output = Allocation.createFromBitmap(rs, blurredBitmap);

        // 设置模糊半径并执行模糊
        blurScript.setRadius(blurRadius);
        blurScript.setInput(input);
        blurScript.forEach(output);

        // 将模糊后的结果复制到位图，并回收原图片节省内存
        output.copyTo(blurredBitmap);
        source.recycle();

        return blurredBitmap;
    }

    @Override
    public String key() {
        // 唯一标识变换，用于Picasso的缓存
        return "BlurTransformation(radius=" + blurRadius + ", sampling=" + sampling + ")";
    }
}

你的代码已经有了雏形，但需要补全Callback的逻辑，实现“先显示模糊缩略图，再加载清晰原图”的流程，同时优化进度条的显示时机：

// 先显示进度条，提示用户正在加载
pb.setVisibility(View.VISIBLE);

// 第一步：加载并显示模糊的缩略图
Picasso.with(getApplicationContext())
        .load(thumbUrl) // 你的缩略图URL
        .resize(width, width)
        // 这里可以调整参数：比如sampling设为2，既提升性能又让模糊更自然
        .transform(new BlurTransformation(getApplicationContext(), 20, 2))
        .into(imageview, new Callback() {
            @Override
            public void onSuccess() {
                // 缩略图加载成功后，立即开始加载清晰原图
                loadOriginalImage();
            }

            @Override
            public void onError() {
                // 如果缩略图加载失败，直接加载原图，避免用户长时间等待
                loadOriginalImage();
            }
        });

// 封装加载原图的方法，避免重复代码
private void loadOriginalImage() {
    Picasso.with(getApplicationContext())
            .load(originalImageUrl) // 替换成你的清晰原图URL
            .resize(width, width)
            .into(imageview, new Callback() {
                @Override
                public void onSuccess() {
                    // 原图加载完成，隐藏进度条
                    pb.setVisibility(View.GONE);
                }

                @Override
                public void onError() {
                    // 原图加载失败，也隐藏进度条，可选显示错误占位图
                    pb.setVisibility(View.GONE);
                    // 比如：Picasso.with(getApplicationContext()).load(R.drawable.error_img).into(imageview);
                }
            });
}

要让模糊效果正常工作，需要在你的Module级别的build.gradle中添加RenderScript的支持：

android {
    ...
    defaultConfig {
        ...
        // 适配的API级别，根据你的项目调整
        renderscriptTargetApi 21
        // 启用对低版本Android的支持
        renderscriptSupportModeEnabled true
    }
}

• 模糊半径不要设得太大（超过25会被RenderScript限制为25），同时采样率设为2或3能大幅提升性能，模糊效果也更柔和。
• 记得在AndroidManifest.xml中添加网络权限（如果图片是从网络加载的）：<uses-permission android:name="android.permission.INTERNET" />
• Picasso会自动缓存变换后的图片，所以不用担心重复模糊处理的性能问题。

内容的提问来源于stack exchange，提问作者Pritesh Vishwakarma