组件化思想之图片加载库picasso的用法及封装

关于Picasso

picasso是Square公司开源的一个Android图形缓存库，地址http://square.github.io/picasso/，可以实现图片下载和缓存功能。

Picasso不仅实现了图片异步加载的功能，还解决了android中加载图片时需要解决的一些常见问题：

1.在adapter中需要取消已经不在视野范围的ImageView图片资源的加载，否则会导致图片错位，Picasso已经解决了这个问题。

2.使用复杂的图片压缩转换来尽可能的减少内存消耗

3.自带内存和硬盘二级缓存功能。

常见使用方法

既然用到了第三方的开源库，首先肯定是要在app module中的build.gradle中添加第三方依赖，如下所示：

compile 'com.squareup.picasso:picasso:2.5.2'

接下来介绍具体用法

简单使用

Picasso.with(this).load("http://i.imgur.com/DvpvklR.png").into(image);

图片存放在固定sdcard位置

Picasso picasso = new Picasso.Builder(this).downloader(
new OkHttpDownloader(new File(path))).build();
Picasso.setSingletonInstance(picasso);

转换图片以适应布局大小

Picasso.with(this).load("http://i.imgur.com/DvpvklR.png").resize(DensityUtil.dip2px(this,200), DensityUtil.dip2px(this,200)).centerCrop().into(image);

自定义圆形图片

首先新建一个view包，然后再包内再定义一个名为 CircleTransform的Java Class

public class CircleTransform implements Transformation {
@Override
public Bitmap transform(Bitmap source) {
int size = Math.min(source.getWidth(), source.getHeight());

int x = (source.getWidth() - size) / 2;
int y = (source.getHeight() - size) / 2;

Bitmap squaredBitmap = Bitmap.createBitmap(source, x, y, size, size);
if (squaredBitmap != source) {
source.recycle();
}

Bitmap bitmap = Bitmap.createBitmap(size, size, source.getConfig());

Canvas canvas = new Canvas(bitmap);
Paint paint = new Paint();
BitmapShader shader = new BitmapShader(squaredBitmap, BitmapShader.TileMode.CLAMP,
BitmapShader.TileMode.CLAMP);
paint.setShader(shader);
paint.setAntiAlias(true);

float r = size / 2f;
canvas.drawCircle(r, r, r, paint);

squaredBitmap.recycle();
return bitmap;
}

@Override
public String key() {
return "circle";
}
}

紧接着在布局文件中放置一个图片控件和一个按钮控件，xml如下所示：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<Button
android:text="图片加载"
android:id="@+id/btn_1"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<ImageView
android:id="@+id/iv_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"/>

</LinearLayout>

然后在MainActivity中实例化控件，并为按钮设置监听事件用于加载图片，具体代码如下所示：

package com.lijizhi.myapplication;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.Switch;

import com.lijizhi.myapplication.util.L;
import com.lijizhi.myapplication.view.CircleTransform;
import com.squareup.picasso.Picasso;

public class MainActivity extends AppCompatActivity implements View.OnClickListener {
private Button btn1;
private ImageView iv1;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
inttView();
}

private void inttView() {
Button btn1 =(Button)findViewById(R.id.btn_1);
btn1.setOnClickListener(this);
iv1=(ImageView)findViewById(R.id.iv_1);
}

@Override
public void onClick(View v) {
switch(v.getId()){
case R.id.btn_1:
Picasso.with(this).load("http://i.imgur.com/DvpvklR.png").transform(new CircleTransform ()).into(iv1);
break;

}

}

}

最后一步就是往AndroidManifest添加联网权限

<!--允许联网 -->
<uses-permission android:name="android.permission.INTERNET" />

程序运行结果如下



占位符图片

所谓的占位符图像即当图片未正常显示时默认的图片，通过placeholder()设置，Picasso也支持设置图片显示错误时显示的默认图片，通过error()设置：

Picasso.with(context)
.load(url)
.placeholder(R.drawable.user_placeholder)
.error(R.drawable.user_placeholder_error)
.into(imageView);

资源图片的加载

除了加载网络图片picasso还支持加载Resources, assets, files, content providers中的资源文件。

Picasso.with(context).load(R.drawable.landing_screen). into(imageView1);
Picasso.with(context).load(new File(path)).into(imageView2);

DEBUG指标

开发时可以启用彩带来指示图像源。在Picasso实例中调用setIndicatorsEnabled(true)。

picasso的封装

picasso本身封装的已经很好了，但是我们还是可以根据自己的需求进行进一步的封装，具体代码如下所示：

public class PicassoUtils {

//默认加载图片
public static void loadImaheView(Context mContext, String url, ImageView imageView) {
Picasso.with(mContext).load(url).into(imageView);
}

//默认加载图片(指定大小)
public static void loadImageViewSize(Context mContext, String url, int width, int height, ImageView imageView) {
Picasso.with(mContext).load(url).config(Bitmap.Config.RGB_565).resize(width, height).centerCrop().into(imageView);
}

//加载图片有默认图片
public static void loadImageViewHolder(Context mContext, String url, int loadImg,
int errorImg, ImageView imageView) {
Picasso.with(mContext).load(url).placeholder(loadImg).error(errorImg)
.into(imageView);
}

//裁剪图片
public static void loadImageViewCrop(Context mContext, String url,ImageView imageView){
Picasso.with(mContext).load(url).transform(new CropSquareTransformation()).into(imageView);
}

//按比例裁剪 矩形
public static class CropSquareTransformation implements Transformation {
@Override
public Bitmap transform(Bitmap source) {
int size = Math.min(source.getWidth(), source.getHeight());
int x = (source.getWidth() - size) / 2;
int y = (source.getHeight() - size) / 2;
Bitmap result = Bitmap.createBitmap(source, x, y, size, size);
if (result != source) {
//回收
source.recycle();
}
return result;
}

@Override public String key() {
return "lgl";
}
}

}

总结

Picasson是一个优雅的图片加载库，虽然它不是最完美的，但是功能也是十分强大的，我们应该学会对一些常用的组件进行封装，这有助于我们更高效的编程，大家一起努力吧！