Diycode開源項目 Glide圖片加載分析

本文轉載自查看原文 2017-11-22 22:35 1018 Diycode開源項目/ Android

1.使用Glide前的准備

1.1.首先要build.gradle中添加

　　github原地址點擊我。

　　參考博客：Glide-開始！

　　參考博客：android圖片加載庫Glide的使用介紹。

　　參考博客：Google推薦的圖片加載庫Glide介紹。

　　所有有關Glide的源頭都是來自於github，首先亮一手，可以自己去看看。

1.2.有必要添加混淆

　　為了APP的安全，現在一般都要求添加混淆

　　在github上復制粘貼即可。

1.3.最簡單的用法==>對於一個簡單的view

　　了解這么多就行了。

2.用Module自定義Glide

2.1.Glide Module存在的意義

　　Glide Module是一個抽象方法，全局改變Glide行為的一個方法。如果你需要GlideBuilder，它要在你要做的地方

　　創建Glide實例。這是要做的一種方法。為了定制Glide，你需要去實現一個GlideModule接口的公共類。

2.2.需要在AndroidManifest.xml中聲明這個Glide module。

2.3.然后就可以對這個Module為所欲為了。

　　有這些方法可以用的。

　　實際的項目中是這樣用的。

　　設置了內存緩存==10M

　　設置了磁盤緩存==250M

2.4.還可以增加Glide的圖片質量，用的也比較多

3.自定義Drawable實現Drawable.Callback

3.1.首先了解一下Drawable

　關於自定義Drawable，可以參考一下這篇文章。

3.2.然后了解一下Drawble.Callback回調接口

3.3.本項目的源代碼

/*
 * Copyright 2017 GcsSloop
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *    http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 *
 * Last modified 2017-03-11 22:24:02
 *
 * GitHub:  https://github.com/GcsSloop
 * Website: http://www.gcssloop.com
 * Weibo:   http://weibo.com/GcsSloop
 */

package com.gcssloop.diycode.base.glide;

import android.graphics.Canvas;
import android.graphics.ColorFilter;
import android.graphics.drawable.Drawable;

import com.bumptech.glide.load.resource.drawable.GlideDrawable;

/**
 * 為 {@link GlideImageGetter} 服務
 */
public class UrlDrawable extends Drawable implements Drawable.Callback {

    private GlideDrawable mDrawable;

    @Override
    public void draw(Canvas canvas) {
        if (mDrawable != null) {
            mDrawable.draw(canvas);
        }
    }

    @Override
    public void setAlpha(int alpha) {
        if (mDrawable != null) {
            mDrawable.setAlpha(alpha);
        }
    }

    @Override
    public void setColorFilter(ColorFilter cf) {
        if (mDrawable != null) {
            mDrawable.setColorFilter(cf);
        }
    }

    @Override
    public int getOpacity() {
        if (mDrawable != null) {
            return mDrawable.getOpacity();
        }
        return 0;
    }

    public void setDrawable(GlideDrawable drawable) {
        if (this.mDrawable != null) {
            this.mDrawable.setCallback(null);
        }
        drawable.setCallback(this);
        this.mDrawable = drawable;
    }

    @Override
    public void invalidateDrawable(Drawable who) {
        if (getCallback() != null) {
            getCallback().invalidateDrawable(who);
        }
    }

    @Override
    public void scheduleDrawable(Drawable who, Runnable what, long when) {
        if (getCallback() != null) {
            getCallback().scheduleDrawable(who, what, when);
        }
    }

    @Override
    public void unscheduleDrawable(Drawable who, Runnable what) {
        if (getCallback() != null) {
            getCallback().unscheduleDrawable(who, what);
        }
    }
}

View Code

3.4.本項目實現Drawable中4個必須實現的函數

　　其實這里的主角已經悄悄替換成了Glide中的一個GlideDrawble方法了

　　這個UrlDrawable就是起一個替換作用，就是自定義一個Drawable可以完美實現GlideDrawable中的所有方法。

3.5.最關鍵的setDrawable函數

　　僅僅這個函數被外部調用了，所以這里既設置了Callback回調，也將外部傳進來的GlideDrawable完美附上了值。

3.6.然后是看一下Drawable.Callback

　　這里沒有做什么改變，只是因為GlideDrawable要實現這些回調，只能被動去實現3個復寫的方法。

4.用Glide加載網絡圖片，並在textView中顯示

4.1.要實現的功能預覽。

　　如上圖，評論中有一張截圖+下方的文字。

　　整個評論其實是一個TextView。

　　問題是如何實現這個功能呢？

4.2.回顧之前的准備

　　我自定義了一個GlideModule，並在清單文件中配置好，有這個東西就行了。　　

　　然后我自定義了一個UrlDrawable，都是為GlideImageGetter做准備的。

　　這個是那個評論實現圖文混排的關鍵代碼。

　　所以我還要定義GlideImageGetter，將content注入這種特殊功能。

4.3.然后就來關注一下如何實現GlideImageGetter的吧。

/*
 * Copyright 2017 GcsSloop
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *    http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 *
 * Last modified 2017-03-31 14:20:42
 *
 * GitHub:  https://github.com/GcsSloop
 * Website: http://www.gcssloop.com
 * Weibo:   http://weibo.com/GcsSloop
 */

package com.gcssloop.diycode.base.glide;

import android.content.Context;
import android.graphics.Rect;
import android.graphics.drawable.Drawable;
import android.text.Html;
import android.view.View;
import android.widget.TextView;

import com.bumptech.glide.Glide;
import com.bumptech.glide.load.engine.DiskCacheStrategy;
import com.bumptech.glide.load.resource.drawable.GlideDrawable;
import com.bumptech.glide.request.Request;
import com.bumptech.glide.request.animation.GlideAnimation;
import com.bumptech.glide.request.target.ViewTarget;
import com.gcssloop.diycode.R;
import com.gcssloop.diycode_sdk.log.Logger;

import java.util.HashSet;
import java.util.Set;

/**
 * 用 Glide 加載圖片，並在 TextView 中顯示
 */
public final class GlideImageGetter implements Html.ImageGetter, Drawable.Callback {

    private final Context mContext;

    private final TextView mTextView;

    private final Set<ImageGetterViewTarget> mTargets;

    public static GlideImageGetter get(View view) {
        return (GlideImageGetter) view.getTag(R.id.drawable_callback_tag);
    }

    public void clear() {
        GlideImageGetter prev = get(mTextView);
        if (prev == null) return;

        for (ImageGetterViewTarget target : prev.mTargets) {
            Glide.clear(target);
        }
    }

    public GlideImageGetter(Context context, TextView textView) {
        this.mContext = context;
        this.mTextView = textView;

        clear();
        mTargets = new HashSet<>();
        mTextView.setTag(R.id.drawable_callback_tag, this);
    }

    @Override
    public Drawable getDrawable(String url) {
        final UrlDrawable urlDrawable = new UrlDrawable();

        Logger.i("Downloading from: " + url);
        Glide.with(mContext)
                .load(url)
                .diskCacheStrategy(DiskCacheStrategy.ALL)
                .into(new ImageGetterViewTarget(mTextView, urlDrawable));


        return urlDrawable;

    }

    @Override
    public void invalidateDrawable(Drawable who) {
        mTextView.invalidate();
    }

    @Override
    public void scheduleDrawable(Drawable who, Runnable what, long when) {

    }

    @Override
    public void unscheduleDrawable(Drawable who, Runnable what) {

    }

    private class ImageGetterViewTarget extends ViewTarget<TextView, GlideDrawable> {

        private final UrlDrawable mDrawable;

        private ImageGetterViewTarget(TextView view, UrlDrawable drawable) {
            super(view);
            mTargets.add(this);
            this.mDrawable = drawable;
        }

        @Override
        public void onResourceReady(GlideDrawable resource, GlideAnimation<? super GlideDrawable> glideAnimation) {
            Rect rect;
            if (resource.getIntrinsicWidth() > 100) {
                float width;
                float height;
                Logger.i("Image width is " + resource.getIntrinsicWidth());
                Logger.i("View width is " + view.getWidth());
                if (resource.getIntrinsicWidth() >= getView().getWidth()) {
                    float downScale = (float) resource.getIntrinsicWidth() / getView().getWidth();
                    width = (float) resource.getIntrinsicWidth() / (float) downScale;
                    height = (float) resource.getIntrinsicHeight() / (float) downScale;
                } else {
                    float multiplier = (float) getView().getWidth() / resource.getIntrinsicWidth();
                    width = (float) resource.getIntrinsicWidth() * (float) multiplier;
                    height = (float) resource.getIntrinsicHeight() * (float) multiplier;
                }
                Logger.i("New Image width is " + width);


                rect = new Rect(0, 0, Math.round(width), Math.round(height));
            } else {
                rect = new Rect(0, 0, resource.getIntrinsicWidth() * 2, resource.getIntrinsicHeight() * 2);
            }
            resource.setBounds(rect);

            mDrawable.setBounds(rect);
            mDrawable.setDrawable(resource);


            if (resource.isAnimated()) {
                mDrawable.setCallback(get(getView()));
                resource.setLoopCount(GlideDrawable.LOOP_FOREVER);
                resource.start();
            }

            getView().setText(getView().getText());
            getView().invalidate();
        }

        private Request request;

        @Override
        public Request getRequest() {
            return request;
        }

        @Override
        public void setRequest(Request request) {
            this.request = request;
        }
    }
}