Android加载大图长图方案简析

作者: 苏州韭菜明 | 来源:发表于2019-08-28 10:44 被阅读0次

0190828104408.png

本文只是简要分析安卓端自带压缩与加载方案

1,高效加载加载大图

展示高分辨率图片的时候，最好先将图片进行压缩。

BitmapFactory这个类提供了多个解析方法(decodeByteArray, decodeFile, decodeResource等)用于创建Bitmap对象，我们应该根据图片的来源选择合适的方法。比如SD卡中的图片可以使用decodeFile方法，网络上的图片可以使用decodeStream方法，资源文件中的图片可以使用decodeResource方法。

色彩模式->色彩模式是数字世界中表示颜色的一种算法，在Bitmap里用Config来表示。

ARGB_8888：每个像素占四个字节，A、R、G、B 分量各占8位，是 Android 的默认设置；

RGB_565：每个像素占两个字节，R分量占5位，G分量占6位，B分量占5位；

ARGB_4444：每个像素占两个字节，A、R、G、B分量各占4位，成像效果比较差；

Alpha_8: 只保存透明度，共8位，1字节；

安卓自带压缩方案流程

1.比例大小压缩

BitmapFactory每一种解析方法都提供了一个可选的BitmapFactory.Options参数，将这个参数的inJustDecodeBounds属性设置为true就可以让解析方法禁止为bitmap分配内存，返回值也不再是一个Bitmap对象，而是null。虽然Bitmap是null了，但是BitmapFactory.Options的outWidth、outHeight和outMimeType属性都会被赋值。这个技巧让我们可以在加载图片之前就获取到图片的长宽值和MIME类型，从而根据情况对图片进行压缩。

BitmapFactory.Options options = new BitmapFactory.Options();
options.inJustDecodeBounds = true;
BitmapFactory.decodeResource(getResources(), R.id.myimage, options);
int imageHeight = options.outHeight;
int imageWidth = options.outWidth;
String imageType = options.outMimeType;

决定是把整张图片加载到内存中还是加载一个压缩版的图片到内存中。以下几个因素是我们需要考虑的：

预估一下加载整张图片所需占用的内存。
为了加载这一张图片你所愿意提供多少内存。
用于展示这张图片的控件的实际大小。
当前设备的屏幕尺寸和分辨率。

通过设置BitmapFactory.Options中inSampleSize的值就可以实现。比如我们有一张20481536像素的图片，将inSampleSize的值设置为4，就可以把这张图片压缩成512384像素。原本加载这张图片需要占用13M的内存，压缩后就只需要占用0.75M了(假设图片是ARGB_8888类型，即每个像素点占用4个字节)。下面的方法可以根据传入的宽和高，计算出合适的inSampleSize值：

public static int calculateInSampleSize(BitmapFactory.Options options,
        int reqWidth, int reqHeight) {
    // 源图片的高度和宽度
    final int height = options.outHeight;
    final int width = options.outWidth;
    int inSampleSize = 1;
    if (height > reqHeight || width > reqWidth) {
        // 计算出实际宽高和目标宽高的比率
        final int heightRatio = Math.round((float) height / (float) reqHeight);
        final int widthRatio = Math.round((float) width / (float) reqWidth);
        // 选择宽和高中最小的比率作为inSampleSize的值，这样可以保证最终图片的宽和高
        // 一定都会大于等于目标的宽和高。
        inSampleSize = heightRatio < widthRatio ? heightRatio : widthRatio;
    }
    return inSampleSize;
}

BitmapFactory.Options的inJustDecodeBounds属性设置为true，解析一次图片。然后将BitmapFactory.Options连同期望的宽度和高度一起传递到到calculateInSampleSize方法中，就可以得到合适的inSampleSize值了。之后再解析一次图片，使用新获取到的inSampleSize值，并把inJustDecodeBounds设置为false，就可以得到压缩后的图片了。

public static Bitmap decodeSampledBitmapFromResource(Resources res, int resId,
        int reqWidth, int reqHeight) {
    // 第一次解析将inJustDecodeBounds设置为true，来获取图片大小
    final BitmapFactory.Options options = new BitmapFactory.Options();
    options.inJustDecodeBounds = true;
    BitmapFactory.decodeResource(res, resId, options);
    // 调用上面定义的方法计算inSampleSize值
    options.inSampleSize = calculateInSampleSize(options, reqWidth, reqHeight);
    // 使用获取到的inSampleSize值再次解析图片
    options.inJustDecodeBounds = false;
    return BitmapFactory.decodeResource(res, resId, options);
}

下面的代码非常简单地将任意一张图片压缩成100*100的缩略图，并在ImageView上展示。

mImageView.setImageBitmap(
    decodeSampledBitmapFromResource(getResources(), R.id.myimage, 100, 100));

2.质量压缩

所用方法与类与比例压缩基本相同

质量压缩：根据传递进去的质量大小，采用系统自带的压缩算法，将图片压缩成JPEG格式

    private Bitmap compressImage(Bitmap image) {

        ByteArrayOutputStream baos = new ByteArrayOutputStream();
        image.compress(Bitmap.CompressFormat.JPEG, 100, baos);//质量压缩方法，这里100表示不压缩，把压缩后的数据存放到baos中
        int options = 100;
        while ( baos.toByteArray().length / 1024>100) { //循环判断如果压缩后图片是否大于100kb,大于继续压缩     
            baos.reset();//重置baos即清空baos
            image.compress(Bitmap.CompressFormat.JPEG, options, baos);//这里压缩options%，把压缩后的数据存放到baos中
            options -= 10;//每次都减少10
        }
        ByteArrayInputStream isBm = new ByteArrayInputStream(baos.toByteArray());//把压缩后的数据baos存放到ByteArrayInputStream中
        Bitmap bitmap = BitmapFactory.decodeStream(isBm, null, null);//把ByteArrayInputStream数据生成图片
        return bitmap;
    }

使用图片压缩库进行压缩

JNI使用Jpeg库

Android和IOS 中图片处理使用了一个叫做skia的开源图形处理引擎。他位于android源码的/external/skia 目录。我们平时在java层使用一个图片处理的函数实际上底层就是调用了这个开源引擎中的相关的函数。

android在进行jpeg压缩编码的时候，考虑到了效率问题使用了定长编码方式进行编码（因为当时的手机性能都比较低），而IOS使用了变长编码的算法——哈夫曼算法。而且IOS对skia引擎也做了优化。所有我们看到同样的图片在ios上压缩会好一点。

1、下载开源的libjpeg，进行移植、编译得到libjpeg.so
2、使用jni编写一个函数用来图片压缩
3、在函数中添加一个开关选项，可以让我们选择是否使用哈夫曼算法。
4、打包，搞成sdk供我们以后使用。

具体可查看Android使用libjpeg实现图片压缩

Luban鲁班压缩

可能是最接近微信朋友圈的图片压缩算法

接近微信朋友圈压缩后的效果，具体看以下对比！

内容	原图	Luban	Wechat
截屏 720P	720*1280,390k	720*1280,87k	720*1280,56k
截屏 1080P	1080*1920,2.21M	1080*1920,104k	1080*1920,112k
拍照 13M(4:3)	3096*4128,3.12M	1548*2064,141k	1548*2064,147k
拍照 9.6M(16:9)	4128*2322,4.64M	1032*581,97k	1032*581,74k
滚动截屏	1080*6433,1.56M	1080*6433,351k	1080*6433,482k

github上算法逻辑的介绍拷贝过来了：

判断图片比例值，是否处于以下区间内；

[1, 0.5625) 即图片处于 [1:1 ~ 9:16) 比例范围内
[0.5625, 0.5) 即图片处于 [9:16 ~ 1:2) 比例范围内
[0.5, 0) 即图片处于 [1:2 ~ 1:∞) 比例范围内

判断图片最长边是否过边界值；

[1, 0.5625) 边界值为：1664 * n（n=1）, 4990 * n（n=2）, 1280 * pow(2, n-1)（n≥3）
[0.5625, 0.5) 边界值为：1280 * pow(2, n-1)（n≥1）
[0.5, 0) 边界值为：1280 * pow(2, n-1)（n≥1）

计算压缩图片实际边长值，以第2步计算结果为准，超过某个边界值则：width / pow(2, n-1)，height/pow(2, n-1)
计算压缩图片的实际文件大小，以第2、3步结果为准，图片比例越大则文件越大。
size = (newW * newH) / (width * height) * m；

[1, 0.5625) 则 width & height 对应 1664，4990，1280 * n（n≥3），m 对应 150，300，300；
[0.5625, 0.5) 则 width = 1440，height = 2560, m = 200；
[0.5, 0) 则 width = 1280，height = 1280 / scale，m = 500；注：scale为比例值

判断第4步的size是否过小

[1, 0.5625) 则最小 size 对应 60，60，100
[0.5625, 0.5) 则最小 size 都为 100
[0.5, 0) 则最小 size 都为 100

将前面求到的值压缩图片 width, height, size 传入压缩流程，压缩图片直到满足以上数值

使用图片缓存技术

为了能够选择一个合适的缓存大小给LruCache, 有以下多个因素应该放入考虑范围内，例如：

你的设备可以为每个应用程序分配多大的内存？

设备屏幕上一次最多能显示多少张图片？有多少图片需要进行预加载，因为有可能很快也会显示在屏幕上？

你的设备的屏幕大小和分辨率分别是多少？一个超高分辨率的设备（例如 Galaxy Nexus) 比起一个较低分辨率的设备（例如 Nexus S），在持有相同数量图片的时候，需要更大的缓存空间。

图片的尺寸和大小，还有每张图片会占据多少内存空间。

图片被访问的频率有多高？会不会有一些图片的访问频率比其它图片要高？如果有的话，你也许应该让一些图片常驻在内存当中，或者使用多个LruCache 对象来区分不同组的图片。

你能维持好数量和质量之间的平衡吗？有些时候，存储多个低像素的图片，而在后台去开线程加载高像素的图片会更加的有效。

下面是一个使用 LruCache 来缓存图片的例子：

private LruCache<String, Bitmap> mMemoryCache;
 
@Override
protected void onCreate(Bundle savedInstanceState) {
    // 获取到可用内存的最大值，使用内存超出这个值会引起OutOfMemory异常。
    // LruCache通过构造函数传入缓存值，以KB为单位。
    int maxMemory = (int) (Runtime.getRuntime().maxMemory() / 1024);
    // 使用最大可用内存值的1/8作为缓存的大小。
    int cacheSize = maxMemory / 8;
    mMemoryCache = new LruCache<String, Bitmap>(cacheSize) {
        @Override
        protected int sizeOf(String key, Bitmap bitmap) {
            // 重写此方法来衡量每张图片的大小，默认返回图片数量。
            return bitmap.getByteCount() / 1024;
        }
    };
}
 
public void addBitmapToMemoryCache(String key, Bitmap bitmap) {
    if (getBitmapFromMemCache(key) == null) {
        mMemoryCache.put(key, bitmap);
    }
}
 
public Bitmap getBitmapFromMemCache(String key) {
    return mMemoryCache.get(key);
}

在这个例子当中，使用了系统分配给应用程序的八分之一内存来作为缓存大小。在中高配置的手机当中，这大概会有4兆(32/8)的缓存空间。一个全屏幕的 GridView 使用4张 800x480分辨率的图片来填充，则大概会占用1.5兆的空间(8004804)。因此，这个缓存大小可以存储2.5页的图片。

public void loadBitmap(int resId, ImageView imageView) {
    final String imageKey = String.valueOf(resId);
    final Bitmap bitmap = getBitmapFromMemCache(imageKey);
    if (bitmap != null) {
        imageView.setImageBitmap(bitmap);
    } else {
        imageView.setImageResource(R.drawable.image_placeholder);
        BitmapWorkerTask task = new BitmapWorkerTask(imageView);
        task.execute(resId);
    }
}

BitmapWorkerTask 还要把新加载的图片的键值对放到缓存中。

class BitmapWorkerTask extends AsyncTask<Integer, Void, Bitmap> {
    // 在后台加载图片。
    @Override
    protected Bitmap doInBackground(Integer... params) {
        final Bitmap bitmap = decodeSampledBitmapFromResource(
                getResources(), params[0], 100, 100);
        addBitmapToMemoryCache(String.valueOf(params[0]), bitmap);
        return bitmap;
    }
}

2,加载加载长图，不压缩

那么对于这种需求，该如何做呢？

首先不压缩，按照原图尺寸加载，那么屏幕肯定是不够大的，并且考虑到内存的情况，不可能一次性整图加载到内存中，所以肯定是局部加载，那么就需要用到一个类：

BitmapRegionDecoder

其次，既然屏幕显示不完，那么最起码要添加一个上下左右拖动的手势，让用户可以拖动查看。

BitmapRegionDecoder

BitmapRegionDecoder主要用于显示图片的某一块矩形区域

BitmapRegionDecoder bitmapRegionDecoder =  BitmapRegionDecoder.newInstance(inputStream, false);

显示指定的区域

bitmapRegionDecoder.decodeRegion(rect, options);

参数一很明显是一个rect，参数二是BitmapFactory.Options，你可以控制图片的inSampleSize,inPreferredConfig等。

下面列出核心代码块

 try
        {
            InputStream inputStream = getAssets().open("tangyan.jpg");
 
            //获得图片的宽、高
            BitmapFactory.Options tmpOptions = new BitmapFactory.Options();
            tmpOptions.inJustDecodeBounds = true;
            BitmapFactory.decodeStream(inputStream, null, tmpOptions);
            int width = tmpOptions.outWidth;
            int height = tmpOptions.outHeight;
 
            //设置显示图片的中心区域
            BitmapRegionDecoder bitmapRegionDecoder = BitmapRegionDecoder.newInstance(inputStream, false);
            BitmapFactory.Options options = new BitmapFactory.Options();
            options.inPreferredConfig = Bitmap.Config.RGB_565;
            Bitmap bitmap = bitmapRegionDecoder.decodeRegion(new Rect(width / 2 - 100, height / 2 - 100, width / 2 + 100, height / 2 + 100), options);
            mImageView.setImageBitmap(bitmap);
 
 
        } catch (IOException e)
        {
            e.printStackTrace();
        }

上述代码，就是使用BitmapRegionDecoder去加载assets中的图片，调用bitmapRegionDecoder.decodeRegion解析图片的中间矩形区域，返回bitmap，最终显示在ImageView上。

自定义显示大图控件

根据上面的分析呢，我们这个自定义控件思路就非常清晰了：

提供一个设置图片的入口
重写onTouchEvent，在里面根据用户移动的手势，去更新显示区域的参数
每次更新区域参数后，调用invalidate，onDraw里面去regionDecoder.decodeRegion拿到bitmap，去draw

自定义View及示例代码

洋神的博客分享

文章参考：

Android 高清加载长图或大图方案

Android加载大图长图方案简析

1,高效加载加载大图

安卓自带压缩方案流程

1.比例大小压缩

2.质量压缩

使用图片压缩库进行压缩

JNI使用Jpeg库

Luban鲁班压缩

使用图片缓存技术

2,加载加载长图，不压缩

BitmapRegionDecoder

自定义显示大图控件

相关文章

网友评论

延伸阅读

深度阅读

栏目导航

热点阅读

面试题