首页 > 解决方案 > 如何处理高分辨率图像?

问题描述

我有一个个人资料页面,我也有要从服务器下载然后放入图像视图的个人资料图像。每次我打开配置文件页面时,这个过程都会重复。当图像低于 500 kb 或左右时,一切正常,但是当我在其上放置 6mb 图像时,页面运行不顺畅。我的意思是当滚动或做任何事情时,一切都需要时间。这就像在弱电脑上运行高图形游戏。完成此过程后,我尝试压缩图像,并通过此库https://github.com/zetbaitsu/Compressor将大小减小到 2 MB 。一点也不差。为什么会出现这个问题。

我正在对异步任务执行此上传过程。

上传方式

public void upload() {
    if (filePath != null) {
        Bitmap compressedImage = null;
        try {
            compressedImage = new Compressor(context).compressToBitmap(new File(filePath.getPath()));
        } catch (IOException e) {
            e.printStackTrace();
            try {
                compressedImage = MediaStore.Images.Media.getBitmap(context.getContentResolver(), filePath);
            } catch (IOException e1) {
                e1.printStackTrace();
            }
        }

        ByteArrayOutputStream bytes = new ByteArrayOutputStream();
        compressedImage.compress(Bitmap.CompressFormat.JPEG, 100, bytes);
        final String path = MediaStore.Images.Media.insertImage(context.getContentResolver(), compressedImage, "Title", null);

        StorageReference sRef = storageReference.child("images/" + name);
        sRef.putFile(Uri.parse(path))
                .addOnSuccessListener(new OnSuccessListener<UploadTask.TaskSnapshot>() {
                    @Override
                    public void onSuccess(UploadTask.TaskSnapshot taskSnapshot) {
                        if (ımageView != null)
                            ımageView.setImageURI(Uri.parse(filePath.getPath()));
                    }
                })
                .addOnFailureListener(new OnFailureListener() {
                    @Override
                    public void onFailure(@NonNull Exception exception) {
                        Log.i("resultUpload", exception.getLocalizedMessage());
                    }
                })
                .addOnProgressListener(new OnProgressListener<UploadTask.TaskSnapshot>() {
                    @Override
                    public void onProgress(UploadTask.TaskSnapshot taskSnapshot) {

                    }
                });
    } else {

    }
}

我的下载图片方法

public void download(final ImageView ımageView) {
    StorageReference sRef = storageReference.child("images/" + name);
    sRef.getDownloadUrl().addOnSuccessListener(new OnSuccessListener<Uri>() {
        @Override
        public void onSuccess(Uri uri) {
            Picasso.get().load(uri).into(ımageView, new Callback() {
                @Override
                public void onSuccess() {

                }

                @Override
                public void onError(Exception e) {

                }
            });
        }
    }).addOnFailureListener(new OnFailureListener() {
        @Override
        public void onFailure(@NonNull Exception e) {
            Log.i("resultDownload", e.getLocalizedMessage());
        }
    });
}

标签: javaandroidandroid-asynctask

解决方案


这不是 Java 问题。无论语言或平台如何,您都需要执行某些操作才能在 Web 上正确显示图像。因此,我不推荐任何 Java 库(我相信你会得到许多每种语言的开源库),我将列举你需要遵循的基本步骤:

  1. 您需要为多个设备调整(而不是裁剪)图像的大小。没有像样的网站下载 6MB 图像。绝不!甚至没有 2MB 的图像。我在 8MP 移动相机上拍摄的 Facebook 个人资料图片在上传后大小为 160 KB。尝试将图像大小降低到 100 - 150 KB 左右。这些是一些常见的图像尺寸。

在此处输入图像描述

  1. 您将为移动设备、平板电脑和笔记本电脑创建调整大小的图像。对于移动设备,通常为 640 x 480。对于平板电脑,通常为 800 x 600。对于笔记本电脑,通常为 1024 x 768

  2. 然后像你一样压缩图像。确保最终图像是渐进式 jpeg/jpg。渐进式 jpeg 分层压缩。支持渐进式图像的浏览器在下载图像时会显示模糊的预览。这改善了用户体验。对于不支持渐进式图像的浏览器,使用了一些变通方法。例如,您可以使用opacity: 1; filter: blur(20px);. 因此,在下载更高质量的图像时,将显示图像的模糊版本。最初你将高质量图像的不透明度设置为0。一旦高质量图像下载完成,你将低质量图像的不透明度设置为0,将高质量图像设置为1。你可以测试你的图像是否进步与否在这里并且可以在这里创建压缩的渐进图像。您可能会以编程方式执行这些操作,但这些资源可以作为参考。

  3. 确保您的服务器支持完全多路复用的 HTTP/2。你可以在这里看到多路复用。因此,资源可以并行下载。

在此处输入图像描述

  1. 确保您的服务器支持 gzip 或压缩。因此,资源以 gzip 格式通过网络传输并由浏览器自动提取。这确保了快速下载。

  2. 使用适当的cache-control标头,以便浏览器缓存图像,从而无需为每次访问下载图像。

  3. 如果可能,应使用移动优先设计,以便移动性能变得更好。


推荐阅读