Glide之Target

来源:互联网 发布:招商银行网络银行 编辑:程序博客网 时间:2024/05/16 20:29

Glide不但可以把图片、视频剧照、GIF动画加载到View,还可以加载到自定义的Target实现中。Target就是使用Glide获取到资源之后资源作用的目标,我们通常是用Glide加载完资源后显示到ImageView中,这个ImageView就是目标。 
Target架构的接口包括:

  • com.bumptech.glide.manager.LifecycleListener
  • com.bumptech.glide.request.target.Target<R>
  • com.bumptech.glide.request.target.SizeReadyCallback

Target架构的类层次:

  • com.bumptech.glide.request.target.BaseTarget<Z> (implements com.bumptech.glide.request.target.Target<R>) 
    • com.bumptech.glide.request.target.SimpleTarget<Z> 
      • com.bumptech.glide.request.target.AppWidgetTarget
      • com.bumptech.glide.request.target.NotificationTarget
      • com.bumptech.glide.request.target.PreloadTarget<Z>
    • com.bumptech.glide.request.target.ViewTarget<T,Z> 
      • com.bumptech.glide.request.target.ImageViewTarget<Z> (implements com.bumptech.glide.request.animation.GlideAnimation.ViewAdapter) 
        • com.bumptech.glide.request.target.BitmapImageViewTarget
        • com.bumptech.glide.request.target.DrawableImageViewTarget
        • com.bumptech.glide.request.target.GlideDrawableImageViewTarget
  • android.graphics.drawable.Drawable 
    • com.bumptech.glide.load.resource.drawable.GlideDrawable (implements android.graphics.drawable.Animatable) 
      • com.bumptech.glide.request.target.SquaringDrawable
  • com.bumptech.glide.request.target.ImageViewTargetFactory

SimpleTarget

如果你只是想通过Glide加载一个Bitmap而不是把它显示到View中,比如想显示到通知栏里、作为上传头像等,Glide为你提供了灵活的接口SimpleTarget<Z>: 
SimpleTarget相对于上层接口Target提供了合理的默认实现,以便让你专注于处理已加载好的资源。 
使用SimpleTarget,你需要提供你需要资源的宽高值(像素)到SimpleTarget构造器,并实现onResourceReady(T resource, GlideAnimation animation)方法:

<code class="language-java hljs  has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;"><span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> myWidth = <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">512</span>;<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> myHeight = <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">384</span>;Glide.with(yourApplicationContext))    .load(youUrl)    .asBitmap()    .into(<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> SimpleTarget<Bitmap>(myWidth, myHeight) {        <span class="hljs-annotation" style="color: rgb(155, 133, 157); box-sizing: border-box;">@Override</span>        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">onResourceReady</span>(Bitmap bitmap, GlideAnimation anim) {            <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">// Do something with bitmap here.</span>        }    };</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li><li style="box-sizing: border-box; padding: 0px 5px;">7</li><li style="box-sizing: border-box; padding: 0px 5px;">8</li><li style="box-sizing: border-box; padding: 0px 5px;">9</li><li style="box-sizing: border-box; padding: 0px 5px;">10</li><li style="box-sizing: border-box; padding: 0px 5px;">11</li><li style="box-sizing: border-box; padding: 0px 5px;">12</li></ul>

可能你已经注意到了,上面用的上下文是应用上下文ApplicationContext。因为通常我们把资源加载到View中,当fragment或activity暂停或销毁时,Glide也会暂停或取消请求,以确保不会浪费时间和资源在你不需要的显示上。 
但对SimpleTarget来说,并没有生命周期,所以调用Glide.with(context)时传application上下文,而不是fragment或activity。 
同时,考虑到长时间运行的操作可能会导致内存泄露,如果你要执行长时间运行的操作,要用静态内部类,而不是匿名内部类。

ViewTarget

如果你在加载资源到View时想要查看或覆盖某些Glide默认行为时,可以重写ViewTarget或它的子类。 
通常情况下你想要Glide决定你View的大小时用ViewTarget作为基类即可, 但当你想要处理开始动画或者把资源显示到自定义View中时,ViewTarget子类就特别的合适了,尤其是通过Glide内置的ImageViewTarget 和其子类显示ImageView出问题时。 
ViewTarget使用:可以创建静态的子类,或者匿名内部类方式创建:

<code class="language-java hljs  has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;">Glide.with(yourFragment)    .load(yourUrl)    .into(<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> ViewTarget<YourViewClass, GlideDrawable>(yourViewObject) {        <span class="hljs-annotation" style="color: rgb(155, 133, 157); box-sizing: border-box;">@Override</span>        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">onResourceReady</span>(GlideDrawable resource, GlideAnimation anim) {            YourViewClass myView = <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">this</span>.view;            <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">// 把资源设置到myView,开始播放动画</span>        }    });</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li><li style="box-sizing: border-box; padding: 0px 5px;">7</li><li style="box-sizing: border-box; padding: 0px 5px;">8</li><li style="box-sizing: border-box; padding: 0px 5px;">9</li></ul>

注意:如果你想指定加载Bitmap或GifDrawable,必须在.load(yourUrl)之后马上调用 .asBitmap().asGif(),并且把ViewTarget参数中的类型替换成你要加载的类型。 
可以实现LifecycleListener接口以便根据生命周期进行各种操作。 
如果你只是想查看而不是改变Glide的默认行为,可以使用ImageViewTarget的两个子类:

  • GlideDrawableImageViewTarget - 正常加载和使用asGif()进行加载的默认目标.
  • BitmapImageViewTarget - 使用asBitmap()进行加载的默认目标. 
    如:
<code class="language-java hljs  has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;">Glide.with(yourFragment)    .load(yourUrl)    .asBitmap()    .into(<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> BitmapImageViewTarget(yourImageView)) {        <span class="hljs-annotation" style="color: rgb(155, 133, 157); box-sizing: border-box;">@Override</span>        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">onResourceReady</span>(Bitmap bitmap, GlideAnimation anim) {            <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">super</span>.onResourceReady(bitmap, anim);            Palette.generateAsync(bitmap, <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> Palette.PaletteAsyncListener() {                  <span class="hljs-annotation" style="color: rgb(155, 133, 157); box-sizing: border-box;">@Override</span>                <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">onGenerated</span>(Palette palette) {                    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">// Here's your generated palette</span>                }            });        }    });</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li><li style="box-sizing: border-box; padding: 0px 5px;">7</li><li style="box-sizing: border-box; padding: 0px 5px;">8</li><li style="box-sizing: border-box; padding: 0px 5px;">9</li><li style="box-sizing: border-box; padding: 0px 5px;">10</li><li style="box-sizing: border-box; padding: 0px 5px;">11</li><li style="box-sizing: border-box; padding: 0px 5px;">12</li><li style="box-sizing: border-box; padding: 0px 5px;">13</li><li style="box-sizing: border-box; padding: 0px 5px;">14</li><li style="box-sizing: border-box; padding: 0px 5px;">15</li></ul>

References: 
1. Norman Peitek's blog 
2. Glide Wiki

0 0
原创粉丝点击