android點選全屏預覽照片第三方庫使用

android點選全屏預覽照片第三方庫使用-imgepreviewlibrary

移動端我們經常會遇到放大預覽照片，如果是一張照片，那就全屏展示圖檔就好了，但是如果是一個清單，滑動檢視，我們一般會借助viewpager進行實作，但是每次自己弄，感覺效率很低，今天給大家推薦一個第三方庫，很輕松實作，擴充也還可以哦。

這是點選預覽的效果圖，下邊是數字，也可以顯示成點

微信截圖_20180801172357.png

1.安裝配置

先添加依賴

implementation 'com.ycjiang:imgepreviewlibrary:1.1.3'
           

我們需要自定義一個類

ImageLoader

，進行圖檔加載，不限制架構，一般使用glide，當然你也可以使用其他的。

public class ImageLoader implements IZoomMediaLoader {
    RequestOptions options;

    {
        options = new RequestOptions()
                .centerCrop()
                .placeholder(R.drawable.ic_default_image)
                .error(R.drawable.ic_default_image)
                .priority(Priority.HIGH);
    }

    @Override
    public void displayImage(Fragment context, String path, final MySimpleTarget<Bitmap> simpleTarget) {
        Glide.with(context)
                .asBitmap()
                .load(path)
                .apply(options)
                .into(new SimpleTarget<Bitmap>() {
                    @Override
                    public void onResourceReady(Bitmap resource, Transition<? super Bitmap> transition) {
                        simpleTarget.onResourceReady(resource);
                    }
                    @Override
                    public void onLoadStarted(Drawable placeholder) {
                        super.onLoadStarted(placeholder);
                        simpleTarget.onLoadStarted();
                    }
                    @Override
                    public void onLoadFailed(Drawable errorDrawable) {
                        super.onLoadFailed(errorDrawable);
                        simpleTarget.onLoadFailed(errorDrawable);
                    }
                });
    }

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

在初始化的時候，初始化圖檔加載類。

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

2.項目使用

我們在點選的回調函數中，打開圖檔預覽代碼，根據自己的實際情況調整。

//組織資料
ArrayList<ThumbViewInfo> mThumbViewInfoList = new ArrayList<>(); // 這個最好定義成成員變量
ThumbViewInfo item;
mThumbViewInfoList.clear();
for (int i = 0;i < resultList.size(); i++) {
   Rect bounds = new Rect();
   //new ThumbViewInfo(圖檔位址);
   item=new ThumbViewInfo(resultList.get(i).getOriginUrl());
   item.setBounds(bounds);
   mThumbViewInfoList.add(item);
}

//打開預覽界面
GPreviewBuilder.from(Context context)
    //是否使用自定義預覽界面，當然8.0之後因為配置問題，必須要使用
    .to(ImageLookActivity.class)
    .setData(mThumbViewInfoList)
    .setCurrentIndex(position)
    .setSingleFling(true)
    .setType(GPreviewBuilder.IndicatorType.Number)
    // 小圓點
//  .setType(GPreviewBuilder.IndicatorType.Dot)
    .start();//啟動
           

3.自定義預覽界面

自定義預覽圖檔，可以擴充加一下自己的按鈕功能等。

public class ImageLookActivity extends GPreviewActivity {
    /***
     * 重寫該方法
     * 使用你的自定義布局
     **/
    @Override
    public int setContentLayout() {
        return R.layout.activity_image_look;
    }
}
           

自定義預覽的布局

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".activity.ImageLookActivity">
    
    // 這是第三方庫提供的，也就是預設的布局檔案
    <include layout="@layout/activity_image_preview_photo"/>

</FrameLayout>
           

關注

如果有問題，請在下方評論，或者加群讨論

200909980

關注下方微信公衆号，可以及時擷取到各種技術的幹貨哦，如果你有想推薦的文章，也可以聯系我們的。