1. 程式人生 > 其它 >圖片多圖預覽ImagePreview

圖片多圖預覽ImagePreview

技術標籤:圖片工具android

ImagePreview一個非常好用的圖片預覽工具庫

不需要我們任何佈局,只需要簡單的初始化,放入資料即可,就可以實現非常好看的圖片預覽(多圖)。

1.首先我們先引入依賴

    implementation 'com.ycjiang:ImagePreview:2.3.5'
    //glide
    implementation 'com.github.bumptech.glide:glide:4.9.0'
    annotationProcessor 'com.github.bumptech.glide:compiler:4.9.0'

2.初始化(這裡引用了Glide)

  ZoomMediaLoader.getInstance().init(new TestImageLoader());

import android.content.Context;
import android.graphics.Bitmap;
import android.widget.ImageView;

import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.fragment.app.Fragment;

import com.bumptech.glide.Glide;
import com.bumptech.glide.load.DataSource;
import com.bumptech.glide.load.engine.DiskCacheStrategy;
import com.bumptech.glide.load.engine.GlideException;
import com.bumptech.glide.load.resource.gif.GifDrawable;
import com.bumptech.glide.request.RequestListener;
import com.bumptech.glide.request.RequestOptions;
import com.bumptech.glide.request.target.SimpleTarget;
import com.bumptech.glide.request.target.Target;
import com.bumptech.glide.request.transition.Transition;
import com.previewlibrary.loader.IZoomMediaLoader;
import com.previewlibrary.loader.MySimpleTarget;

public class TestImageLoader implements IZoomMediaLoader {
    @Override
    public void displayImage(@NonNull Fragment context, @NonNull String path, final ImageView imageView, @NonNull final MySimpleTarget simpleTarget) {
        Glide.with(context)
                .asBitmap()
                .load(path)
                .apply(new RequestOptions().fitCenter())
                .into(new SimpleTarget<Bitmap>() {
                    @Override
                    public void onResourceReady(@NonNull Bitmap resource, @Nullable Transition<? super Bitmap> transition) {
                        simpleTarget.onResourceReady();
                        imageView.setImageBitmap(resource);
                    }
                });
    }

    @Override
    public void displayGifImage(@NonNull Fragment context, @NonNull String path, ImageView imageView, @NonNull final MySimpleTarget simpleTarget) {
        Glide.with(context)
                .asGif()
                .load(path)
                //可以解決gif比較幾種時 ,載入過慢  //DiskCacheStrategy.NONE
                .apply(new RequestOptions().diskCacheStrategy(DiskCacheStrategy.RESOURCE).dontAnimate())
                //去掉顯示動畫
                .listener(new RequestListener<GifDrawable>() {
                    @Override
                    public boolean onLoadFailed(@Nullable GlideException e, Object model, Target<GifDrawable> target, boolean isFirstResource) {
                        simpleTarget.onResourceReady();
                        return false;
                    }

                    @Override
                    public boolean onResourceReady(GifDrawable resource, Object model, Target<GifDrawable> target, DataSource dataSource, boolean isFirstResource) {
                        simpleTarget.onLoadFailed(null);
                        return false;
                    }

                })
                .into(imageView);
    }

    @Override
    public void onStop(@NonNull Fragment context) {
        Glide.with(context).onStop();
    }

    @Override
    public void clearMemory(@NonNull Context c) {
        Glide.get(c).clearMemory();
    }

}

3.放入資料

private List<UserViewInfo> stringList = new ArrayList<>();   //資料集合 
            
GPreviewBuilder.from(me)//這裡放入activity,me是我自己的命名。
                        .setData(stringList)//放入資料集合
                        .setCurrentIndex(position)//放入你需要檢視圖片的下標(通常我們使用RecyclerView來展示圖片,可以在點選item時放入此程式碼塊,這樣可以實現點選檢視圖片的功能,下標就是為了知道當前展示的是哪一張圖)

                        .setSingleFling(true)//是否在黑屏區域點選返回
                        .setDrag(true)//是否禁用圖片拖拽返回
                        .setType(GPreviewBuilder.IndicatorType.Number)//指示器型別
                        .start();//啟動

4.大家一定很好奇UserViewInfo是什麼,這是一個bean類,在裡面會放入一些資料。

import android.graphics.Rect;
import android.os.Parcel;

import androidx.annotation.Nullable;

import com.previewlibrary.enitity.IThumbViewInfo;

public class UserViewInfo implements IThumbViewInfo {
    //圖片地址
    private String url;
    // 記錄座標
    private Rect mBounds;
    private String user = "使用者欄位";
    private String videoUrl;

    public UserViewInfo(String url) {
        this.url = url;
    }
    public UserViewInfo(String videoUrl,String url) {
        this.url = url;
        this.videoUrl = videoUrl;
    }
    public String getUser() {
        return user;
    }

    public void setUser(String user) {
        this.user = user;
    }

    @Override
    public String getUrl() {//將你的圖片地址欄位返回
        return url;
    }

    public void setUrl(String url) {
        this.url = url;
    }

    @Override
    public Rect getBounds() {//將你的圖片顯示座標欄位返回
        return mBounds;
    }

    @Nullable
    @Override
    public String getVideoUrl() {
        return videoUrl;
    }

    public void setBounds(Rect bounds) {
        mBounds = bounds;
    }

    public void setVideoUrl(String videoUrl) {
        this.videoUrl = videoUrl;
    }

    @Override
    public int describeContents() {
        return 0;
    }

    @Override
    public void writeToParcel(Parcel dest, int flags) {
        dest.writeString(this.url);
        dest.writeParcelable(this.mBounds, flags);
        dest.writeString(this.user);
        dest.writeString(this.videoUrl);
    }

    protected UserViewInfo(Parcel in) {
        this.url = in.readString();
        this.mBounds = in.readParcelable(Rect.class.getClassLoader());
        this.user = in.readString();
        this.videoUrl = in.readString();
    }

    public static final Creator<UserViewInfo> CREATOR = new Creator<UserViewInfo>() {
        @Override
        public UserViewInfo createFromParcel(Parcel source) {
            return new UserViewInfo(source);
        }

        @Override
        public UserViewInfo[] newArray(int size) {
            return new UserViewInfo[size];
        }
    };

}

5.還看啥呀完事了!(有啥疑問可以在評論區留言)對了忘了上效果圖。。。(效果圖如下)