您的位置:首页 > 其它

图片二次采样以及自定义圆角图片

2017-10-24 14:11 253 查看
1.为什么要进行图片的二次采样?

主要是避免OOM。假设客户端需要加载一张图片,图片尺寸为3000*3000(单位/像素),那么计算一下,如果客户端想显示原图,按一个像素四个字节算,

3000 * 3000 * 4 / 1024 / 1024 = 34 M,想想看客户端一个应用程序的运行内存就十几M,你一下显示一个30多M的图片,直接crash了。

2.怎么解决?

这里就需要对图片进行二次采样。

原理:

BitmapFactory内部的图片解码,形成Bitmap是通过底层C/C++来实现的,有专门的图片界面库,可以通过参数来获取图片的尺寸,以及设置针对颜色加载的采样比率,采样比率就是把多个像素采样成一个像素,图片自然就变小了,最终传递给Java级别的对象,内存就变小了,图片也就变小了。

步骤:

第一步:在加载网络、文件的图片时,进行图片的解码BitmapFactory.decode(),只进行图片的尺寸获取,不进行实际的Bitmap创建,因此,第一次解码,不会占用太多的内存,可以获取图片的宽和高;

第二步:根据图片真实的宽高,以及客户端希望图片加载后的尺寸,进行一个计算,形成一种图片解码时缩小采样的一个数值,这个数值,可以直接运用在BitmapFactory上,加载到内存的Bitmap,就是变小的,内存是小图片的内容,不是原始图片的内存;

大家一个二次采样工具类

/**
* 二次采样工具类
* Created by 1 on 2017/10/12.
*/
public class TwoImageUtils {

private static Bitmap bitmap;

public static void loadImage(String path, final ImageView imageView) {
new AsyncTask<String, Void, Bitmap>() {
@Override
protected void onPostExecute(Bitmap bitmap) {
super.onPostExecute(bitmap);

if (bitmap != null)
imageView.setImageBitmap(bitmap);
else
imageView.setImageResource(R.mipmap.ic_launcher);

}
@Override
protected Bitmap doInBackground(String... params) {
try {
String path = params[0];
URL url = new URL(path);
HttpURLConnection connection = (HttpURLConnection) url.openConnection();
connection.setRequestMethod("GET");
connection.setConnectTimeout(5000);
connection.setReadTimeout(5000);
int code = connection.getResponseCode();
if (code == 200) {
//得到图片数据
InputStream is = connection.getInputStream();
//BitmapFactory.decodeStream(is);//ARGB_888 一个像素占 4个字节  ARGB_565 一个像素占 2 个字节  Alpha Red、Green、Blue(颜色)
BitmapFactory.Options options = new BitmapFactory.Options();
//在图片真正解析之前,不要解析图片数据,只需要告诉一下转换器,只要获取图片的像素(宽高)
options.inJustDecodeBounds = true;//告诉BitmapFactory转换工厂不去真正解析图片只需要拿到图片宽高就行

//假解析 API 有bug
BitmapFactory.decodeStream(is, null, options);
//压缩,根据图片采样率进行二次采样   100 * 100 是你所期望的具体图片尺寸
//options.inSampleSize = 2; //采样用来计算图片的宽高(1920 * 1080 -> 1920 / 2 1080 / 2)

//获取图片宽高,注意:图片的原始宽高
int width = options.outWidth;
int height = options.outHeight;

System.out.println("宽:" + width + "高 : " + height);
Log.i("xxx","宽:" + width + "高 : " + height);
//定义一个变量去记住我们采样率
int inSampleSize = 1;//默认是1 ,即不对图片进行任何压缩
//如果想要改变图片的尺寸,改变这里就行(100)
if (width > 100 || height > 100) {
int halfWidth = width / 2;
int halfHeight = height / 2;
while ((halfWidth / inSampleSize) >= 100 && (halfHeight / inSampleSize) >= 100) {
//计算采样率
inSampleSize *= 2;
}
}
//采样率改变了
options.inSampleSize = inSampleSize;// 8

//图片压缩完之后,放行图片解析
options.inJustDecodeBounds = false;//告诉图片转换工厂,可以解析图片了
//关闭之前的流
is.close();
//重新再去得到当前这张图片的字节流数据
is = url.openStream();
//开始解析图片
bitmap = BitmapFactory.decodeStream(is, null, options);
//关闭流
is.close();
// Bitmap bitmap = BitmapFactory.decodeStream(is);
return bitmap;
}
} catch (Exception e) {
e.printStackTrace();
}

return null;
}
}.execute(path);
}
//进行销毁bitmap对象
public static void destory(){
bitmap.recycle();
}
}


定义一个圆角图片(注:必须使用这个二次采样才可以使用)

public class RoundImageView  extends android.support.v7.widget.AppCompatImageView {
private int mBorderThickness = 0;
private Context mContext;
private int defaultColor = 0xFFFFFFFF;
// 如果只有其中一个有值,则只画一个圆形边框
private int mBorderOutsideColor = 0;
private int mBorderInsideColor = 0;
// 控件默认长、宽
private int defaultWidth = 0;
private int defaultHeight = 0;

public RoundImageView(Context context) {
super(context);
mContext = context;
}

public RoundImageView(Context context, AttributeSet attrs) {
super(context, attrs);
mContext = context;
setCustomAttributes(attrs);
}

public RoundImageView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
mContext = context;
setCustomAttributes(attrs);
}

private void setCustomAttributes(AttributeSet attrs) {
TypedArray a = mContext.obtainStyledAttributes(attrs, R.styleable.roundedimageview);
mBorderThickness = a.getDimensionPixelSize(R.styleable.roundedimageview_border_thickness, 0);
mBorderOutsideColor = a.getColor(R.styleable.roundedimageview_border_outside_color,defaultColor);
mBorderInsideColor = a.getColor(R.styleable.roundedimageview_border_inside_color, defaultColor);
}

@Override
protected void onDraw(Canvas canvas) {
Drawable drawable = getDrawable() ;
if (drawable == null) {
return;
}
if (getWidth() == 0 || getHeight() == 0) {
return;
}
this.measure(0, 0);
if (drawable.getClass() == NinePatchDrawable.class)
return;
Bitmap b = ((BitmapDrawable) drawable).getBitmap();
Bitmap bitmap = b.copy(Bitmap.Config.ARGB_8888, true);
if (defaultWidth == 0) {
defaultWidth = getWidth();
}
if (defaultHeight == 0) {
defaultHeight = getHeight();
}
int radius = 0;
if (mBorderInsideColor != defaultColor && mBorderOutsideColor != defaultColor) {// 定义画两个边框,分别为外圆边框和内圆边框
radius = (defaultWidth < defaultHeight ? defaultWidth : defaultHeight) / 2 - 2 * mBorderThickness;
// 画内圆
drawCircleBorder(canvas, radius + mBorderThickness / 2,mBorderInsideColor);
// 画外圆
drawCircleBorder(canvas, radius + mBorderThickness + mBorderThickness / 2, mBorderOutsideColor);
} else if (mBorderInsideColor != defaultColor && mBorderOutsideColor == defaultColor) {// 定义画一个边框
radius = (defaultWidth < defaultHeight ? defaultWidth : defaultHeight) / 2 - mBorderThickness;
drawCircleBorder(canvas, radius + mBorderThickness / 2, mBorderInsideColor);
} else if (mBorderInsideColor == defaultColor && mBorderOutsideColor != defaultColor) {// 定义画一个边框
radius = (defaultWidth < defaultHeight ? defaultWidth : defaultHeight) / 2 - mBorderThickness;
drawCircleBorder(canvas, radius + mBorderThickness / 2, mBorderOutsideColor);
} else {// 没有边框
radius = (defaultWidth < defaultHeight ? defaultWidth : defaultHeight) / 2;
}
Bitmap roundBitmap = getCroppedRoundBitmap(bitmap, radius);
canvas.drawBitmap(roundBitmap, defaultWidth / 2 - radius, defaultHeight / 2 - radius, null);
}

/**
* 获取裁剪后的圆形图片
* @param
*/
public Bitmap getCroppedRoundBitmap(Bitmap bmp, int radius) {
Bitmap scaledSrcBmp;
int diameter = radius * 2;
// 为了防止宽高不相等,造成圆形图片变形,因此截取长方形中处于中间位置最大的正方形图片
int bmpWidth = bmp.getWidth();
int bmpHeight = bmp.getHeight();
int squareWidth = 0, squareHeight = 0;
int x = 0, y = 0;
Bitmap squareBitmap;
if (bmpHeight > bmpWidth) {// 高大于宽
squareWidth = squareHeight = bmpWidth;
x = 0;
y = (bmpHeight - bmpWidth) / 2;
// 截取正方形图片
squareBitmap = Bitmap.createBitmap(bmp, x, y, squareWidth, squareHeight);
} else if (bmpHeight < bmpWidth) {// 宽大于高
squareWidth = squareHeight = bmpHeight;
x = (bmpWidth - bmpHeight) / 2;
y = 0;
squareBitmap = Bitmap.createBitmap(bmp, x, y, squareWidth,squareHeight);
} else {
squareBitmap = bmp;
}
if (squareBitmap.getWidth() != diameter || squareBitmap.getHeight() != diameter) {
scaledSrcBmp = Bitmap.createScaledBitmap(squareBitmap, diameter,diameter, true);
} else {
scaledSrcBmp = squareBitmap;
}
Bitmap output = Bitmap.createBitmap(scaledSrcBmp.getWidth(),
scaledSrcBmp.getHeight(),
Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(output);

Paint paint = new Paint();
Rect rect = new Rect(0, 0, scaledSrcBmp.getWidth(),scaledSrcBmp.getHeight());

paint.setAntiAlias(true);
paint.setFilterBitmap(true);
paint.setDither(true);
canvas.drawARGB(0, 0, 0, 0);
canvas.drawCircle(scaledSrcBmp.getWidth() / 2,
scaledSrcBmp.getHeight() / 2,
scaledSrcBmp.getWidth() / 2,
paint);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
canvas.drawBitmap(scaledSrcBmp, rect, rect, paint);
bmp = null;
squareBitmap = null;
scaledSrcBmp = null;
return output;
}

/**
* 边缘画圆
*/
private void drawCircleBorder(Canvas canvas, int radius, int color) {
Paint paint = new Paint();
/* 去锯齿 */
paint.setAntiAlias(true);
paint.setFilterBitmap(true);
paint.setDither(true);
paint.setColor(color);
/* 设置paint的 style 为STROKE:空心 */
paint.setStyle(Paint.Style.STROKE);
/* 设置paint的外框宽度 */
paint.setStrokeWidth(mBorderThickness);
canvas.drawCircle(defaultWidth / 2, defaultHeight / 2, radius, paint);
}
}


创建attr.xml配置文件

<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="roundedimageview">
<attr name="border_thickness" format="dimension" />
<attr name="border_inside_color" format="color" />
<attr name="border_outside_color" format="color"></attr>
</declare-styleable>
</resources>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: