Grid图片加载

Glide是一款图片加载框架，可以在Android平台上以简单的方式加载和展示图片。

?

1 2 3

dependencies {    compile 'com.github.bumptech.glide:glide:3.7.0' }

在清单文件中加入权限

1	<uses-permission android:name="android.permission.INTERNET" />

调用Glide.with()方法用于创建一个图片的实例。with方法可以接受Context、Activity和Fragment类型的参数。如果调用不在Activity中或者Fragment中，可以传入ApplicationContext。

Glide支持加载各种图片资源，包括网络图片、本地图片、应用资源、Uri对象等

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14

// 加载本地图片 File file = new File(getExternalCacheDir() + "/demo.jpg" ); Glide.with( this ).load(file).into(imageView);   // 加载应用资源 Glide.with( this ).load(R.drawable.image).into(imageView);   // 加载二进制流 byte [] image = getImageBytes(); Glide.with( this ).load(image).into(imageView);   // 加载Uri对象 Uri imageUri = getImageUri(); Glide.with( this ).load(imageUri).into(imageView)

占位图

?

1 2 3 4

Glide.with(MainActivity. this )     .load(url)     .placeholder(R.mipmap.placeholder)     .into(mImage);

异常占位图

?

1 2 3 4 5 6 7 8

//错误的图片地址 String url1 = "http://sc.net/uploads/allimg/150709/14-150FZ94211O4.jpg" ;   Glide.with(MainActivity. this )      .load(url1)      .placeholder(R.mipmap.placeholder) //加载占位图      .error(R.mipmap.error) //异常占位图      .into(mImage);

指定图片格式

Glide支持加载GIF图片的，而Picasso是不支持加载GIF图片的。

只允许加载静态图：asBitmap

?

1 2 3 4 5 6 7 8

String url2 = "https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=3396140532,1228025744&fm=23&gp=0.jpg" ;   Glide.with(MainActivity. this )     .load(url2)     .asBitmap() //只允许加载静态图     .placeholder(R.mipmap.placeholder) //加载占位图     .error(R.mipmap.error) //异常占位图     .into(mImage);

只允许加载动态图：.asGif()

?

1 2 3 4 5 6 7 8

String url2 = "https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=3396140532,1228025744&fm=23&gp=0.jpg" ;     Glide.with(MainActivity. this )      .load(url2)      .asGif() //只允许加载动态图      .placeholder(R.mipmap.placeholder) //加载占位图      .error(R.mipmap.error) //异常占位图      .into(mImage);

指定图片大小

使用Glide，我们就不用担心图片内存浪费，甚至是内存溢出的问题。
因为Glide从来都不会直接将图片的完整尺寸全部加载到内存中，而是用多少加载多少。Glide会自动判断ImageView的大小，然后只将这么大的图片像素加载到内存当中。

当然我们也可以指定图片的固定大小

当指定图片大小的时候，要把ImageView的宽高该为包裹内容

?

1 2 3 4 5 6 7

Glide. with (MainActivity. this )     .load(url)     .asBitmap() //只允许加载动态图     .placeholder(R.mipmap.placeholder) //加载占位图     .error(R.mipmap.error) //异常占位图     .override(400, 300)     .into(mImage);

3.添加图片淡入加载的效果

.crossFade()

4.用 animate() 自定义动画

从资源中的动画：

回到代码，第一个选项是传一个 Android 资源 id，即动画的资源。一个简单的例子是每个 Android 系统都提供的：slide-in-left(从左滑入)动画， android.R.anim.slide_in_left 。下面这段代码是这个动画的 XML 描述：

?

1 2 3 4 5 6 7

<? xml version = "1.0" encoding = "utf-8" ?> < set xmlns:android = "http://schemas.android.com/apk/res/android" >    < translate android:fromXDelta = "-50%p" android:toXDelta = "0"        android:duration = "@android:integer/config_mediumAnimTime" />    < alpha android:fromAlpha = "0.0" android:toAlpha = "1.0"        android:duration = "@android:integer/config_mediumAnimTime" /> </ set >

当然你可以创建你自己的 XML 动画。比如一个小的缩放动画，图片刚开始小的，然后逐渐增大到原尺寸。

?

1 2 3 4 5 6 7 8 9 10 11 12 13

<? xml version = "1.0" encoding = "utf-8" ?> < set xmlns:android = "http://schemas.android.com/apk/res/android"     android:fillAfter = "true" >      < scale      android:duration = "@android:integer/config_longAnimTime"      android:fromXScale = "0.1"      android:fromYScale = "0.1"      android:pivotX = "50%"      android:pivotY = "50%"      android:toXScale = "1"      android:toYScale = "1" /> </ set >

这两个动画都可以用到 Glide 建造者中：

?

1 2 3 4 5

Glide    .with( context )    .load( eatFoodyImages[ 0 ] )    .animate( android.R.anim.slide_in_left ) // or R.anim.zoom_in    .into( imageView1 );

在图片从网络加载完并准备好之后将从左边滑入。

通过自定义类实现动画

这个很简单，你只需实现 void animate(View view) 方法。这个视图对象是整个 target 视图。如果它是一个自定义的视图，你要找到你的视图的子元素，并且做些必要的动画。

来看个简单的例子。假设你想要实现一个渐现动画，你得需要创建这样的动画对象：

?

1 2 3 4 5 6 7 8 9 10 11 12 13

ViewPropertyAnimation.Animator animationObject = new ViewPropertyAnimation.Animator() {    @Override    public void animate(View view) {      // if it's a custom view class, cast it here      // then find subviews and do the animations      // here, we just use the entire view for the fade animation      view.setAlpha( 0f );        ObjectAnimator fadeAnim = ObjectAnimator.ofFloat( view, "alpha" , 0f, 1f );      fadeAnim.setDuration( 2500 );      fadeAnim.start();    } };

接下来，你需要在 Glide 请求中去设置这个动画：

?

1 2 3 4 5

Glide    .with( context )    .load( eatFoodyImages[ 1 ] )    .animate( animationObject )    .into( imageView2 );

当然，在 animate(View view) 中你的动画对象方法中， 你可以做任何你想要对视图做的事情。自由的用你的动画创建吧。

如果你要在你的自定义视图中实现，你只需要创建这个视图对象，然后在你的自定义视图中创建你的自定义方法。

5.添加加载完成监听

?

1 2 3 4 5 6 7 8 9 10 11 12

Glide.with(ShowImgActivity. this )     .load(urlString)     .centerCrop()     .error(R.drawable.failed)     .crossFade()     .into( new GlideDrawableImageViewTarget(imageView) {   @Override     public void onResourceReady(GlideDrawable drawable, GlideAnimation anim) {     super .onResourceReady(drawable, anim);     //在这里添加一些图片加载完成的操作    } )}；

6.图片缓存机制

Glide缓存策略

Glide默认开启磁盘缓存和内存缓存，当然也可以对单张图片进行设置特定的缓存策略。 
设置图片不加入到内存缓存

?

1 2 3 4 5

Glide    .with( context )    .load( eatFoodyImages[ 0 ] )    .skipMemoryCache( true )    .into( imageViewInternet );

设置图片不加入到磁盘缓存

?

1 2 3 4 5

Glide    .with( context )    .load( eatFoodyImages[ 0 ] )    .diskCacheStrategy( DiskCacheStrategy.NONE )    .into( imageViewInternet );

Glide支持多种磁盘缓存策略：

DiskCacheStrategy.NONE :不缓存图片 
DiskCacheStrategy.SOURCE :缓存图片源文件 
DiskCacheStrategy.RESULT:缓存修改过的图片 
DiskCacheStrategy.ALL:缓存所有的图片，默认

图片加载优先级

Glide支持为图片加载设置优先级，优先级高的先加载，优先级低的后加载：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21

private void loadImageWithHighPriority() {    Glide      .with( context )      .load( UsageExampleListViewAdapter.eatFoodyImages[ 0 ] )      .priority( Priority.HIGH )      .into( imageViewHero ); }   private void loadImagesWithLowPriority() {    Glide      .with( context )      .load( UsageExampleListViewAdapter.eatFoodyImages[ 1 ] )      .priority( Priority.LOW )      .into( imageViewLowPrioLeft );      Glide      .with( context )      .load( UsageExampleListViewAdapter.eatFoodyImages[ 2 ] )      .priority( Priority.LOW )      .into( imageViewLowPrioRight ); }

7.加载圆角图片

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40

/**   * 圆形图   *   * Created by <lzh> on 2016/7/29.   */ public class GlideCircleTransform extends BitmapTransformation {    public GlideCircleTransform(Context context) {      super (context);    }      @Override    protected Bitmap transform(BitmapPool pool, Bitmap toTransform, int outWidth, int outHeight) {      return circleCrop(pool, toTransform);    }      private static Bitmap circleCrop(BitmapPool pool, Bitmap source) {      if (source == null ) return null ;      int size = Math.min(source.getWidth(), source.getHeight());      int x = (source.getWidth() - size) / 2 ;      int y = (source.getHeight() - size) / 2 ;      // TODO this could be acquired from the pool too      Bitmap squared = Bitmap.createBitmap(source, x, y, size, size);      Bitmap result = pool.get(size, size, Bitmap.Config.ARGB_8888);      if (result == null ) {        result = Bitmap.createBitmap(size, size, Bitmap.Config.ARGB_8888);      }      Canvas canvas = new Canvas(result);      Paint paint = new Paint();      paint.setShader( new BitmapShader(squared, BitmapShader.TileMode.CLAMP, BitmapShader.TileMode.CLAMP));      paint.setAntiAlias( true );      float r = size / 2f;      canvas.drawCircle(r, r, r, paint);      return result;    }      @Override    public String getId() {      return getClass().getName();    } }

**然后使用的时候只要加上这句话就行了 
.transform(new GlideCircleTransform(context))**

?

1 2 3 4

Glide.with(mContext)          .load(imageUrl)          .transform( new GlideCircleTransform(mContext))          .into(holder.imageView);

注意事项：

不能直接给要使用glide的imageview设置tag；

因为glide在加载图片的时候用到了tag，会造成冲突，并报错；

当要用到tag写逻辑代码的时候，可以这样

.setTag(R.string.xxx,xxx);并.getTag(R.string.xxx);

?