BigImageViewPager

Introduction: 🔥🔥🔥 BigImage ImageView ViewPager 支持超长图、超大图的图片浏览器,优化内存,支持手势放大、下拉关闭、查看原图、加载百分比、保存图片等功能。现已支持 androidx。
More: Author   ReportBugs   OfficialWebsite   
Tags:

头图

BigImageViewPager = BigImage + ImageView + ViewPager

BigImageViewPager 是一个图片/视频浏览器库,支持超大图、超长图、动图、视频,支持手势,支持查看原图、下载、加载百分比进度显示。采用区块复用加载,优化内存占用,有效避免 OOM。

推荐扫描二维码进行安装体验:

蒲公英

界面展示:

界面 界面 界面

界面

界面 界面

视频展示:

https://github.com/user-attachments/assets/101d706c-d8d0-455b-b38a-6c42282c03e2

https://github.com/user-attachments/assets/b7becb07-e6bd-459b-9795-d048d02fb21b

https://github.com/user-attachments/assets/070caa63-8e9f-4b11-9240-4cb56440d3c2

⭐️⭐️Star 数量曲线⭐️⭐️

Star History Chart

用法

一、添加依赖

Step 1. 在你 project 层级的 build.gradle 中,添加仓库地址:

    allprojects {
        repositories {
            ...
            maven { url 'https://jitpack.io' }
        }
    }

Step 2. 在你 app 的 build.gradle 中添加依赖:

当前最新版本为:androidx-8.1.0

    dependencies {
        // 本框架
        implementation 'com.github.SherlockGougou:BigImageViewPager:androidx-8.1.0'

        // glide
        implementation 'com.github.bumptech.glide:glide:4.16.0'
        annotationProcessor 'com.github.bumptech.glide:compiler:4.16.0'// kotlin 请使用 kapt
        implementation 'com.github.bumptech.glide:okhttp3-integration:4.16.0'
        implementation "com.github.zjupure:webpdecoder:2.3.4.14.2"

        // ExoPlayer https://developer.android.com/media/media3/exoplayer/hello-world?hl=zh-cn#groovy
        implementation "androidx.media3:media3-exoplayer:1.4.1"
        implementation "androidx.media3:media3-exoplayer-dash:1.4.1"
        implementation "androidx.media3:media3-ui:1.4.1"
    }

Step 3. 在你 app 中添加 AppGlideModule。需要继承 AppGlideModule 并添加以下代码到对应的重载方法中,例如:

    @GlideModule
    public class MyAppGlideModule extends AppGlideModule {
      @Override
      public void registerComponents(@NonNull Context context, @NonNull Glide glide, @NonNull Registry registry) {
        super.registerComponents(context, glide, registry);

        // 替换底层网络框架为 okhttp3,这步很重要!如果不添加会无法正常显示原图的加载百分比,或者卡在 1%
        // 如果你的 app 中已经存在了自定义的 GlideModule,你只需要把这一行代码,添加到对应的重载方法中即可。
        registry.replace(GlideUrl.class, InputStream.class, new OkHttpUrlLoader.Factory(ProgressManager.getOkHttpClient()));
      }
    }

Step 4. 以上操作完成后,请点击顶部按钮:Build->Rebuild Project,等待重建完成,至此,框架添加完成。如遇到任何问题,请附带截图提 issues,我会及时回复,或添加底部 QQ 群,进行交流。

二、调用方式

1:生成图片源:

    ImageInfo imageInfo;
    final List<ImageInfo> imageInfoList = new ArrayList<>();
    for (String image : images) {
            imageInfo = new ImageInfo();
            imageInfo.setType(Type.VIDEO);// 指定媒体类型:VIDEO/IMAGE
            imageInfo.setOriginUrl(url);// 原图 url
            imageInfo.setThumbnailUrl(thumbUrl);// 缩略图 url
            imageInfoList.add(imageInfo);
    }

2:最简单的调用方式:

    // 最简单的调用,即可实现大部分需求,如需定制,可参考 Demo 相关代码:
    ImagePreview
        .getInstance()
        .setContext(MainActivity.this)
        .setMediaInfoList(imageInfoList)
        .start();
3:自定义多种配置,请查看 Demo 相关代码

MainActivity.java

4:加载策略介绍
    enum class LoadStrategy {
        /**
         * 仅加载原图;会强制隐藏查看原图按钮
         */
        AlwaysOrigin,

        /**
         * 仅加载普清;会强制隐藏查看原图按钮
         */
        AlwaysThumb,

        /**
         * 根据网络自适应加载,WiFi 原图,流量普清;会强制隐藏查看原图按钮
         */
        NetworkAuto,

        /**
         * 手动模式:默认普清,点击按钮再加载原图;会根据原图、缩略图 url 是否一样来判断是否显示查看原图按钮
         */
        Default,

        /**
         * 全自动模式:WiFi 原图,流量下默认普清,可点击按钮查看原图
         */
        Auto
    }

注:以上所有方式,如果原图缓存存在,会默认加载原图缓存保证清晰度;且原图缓存只要存在,就不会显示查看原图按钮。

5:完全自定义预览界面布局:

详细操作请参考 Demo:https://raw.githubusercontent.com/SherlockGougou/BigImageViewPager/master/sample/src/main/java/cc/shinichi/bigimageviewpager/MainActivity.java

6:Q\&A

1.查看原图卡在 1%? 答:请仔细查看以上第三步的操作。

GitHub 源码

https://github.com/SherlockGougou/BigImageViewPager

致谢

  • 本框架核心是开源作者 davemorrisseysubsampling-scale-image-view,在此感谢他的付出! 对原作感兴趣的,可以去研究学习 ---> 传送门点我
  • okhttp 进度监听部分代码,借鉴使用了GlideImageView,在此对其表示感谢,喜欢其作品的可以移步去查看学习

    Bug 反馈、增加需求,加 QQ 交流群

    QQ 群

如果有帮助到你,欢迎请我喝杯☕️:

LICENSE

Copyright (C) 2018 SherlockGougou qinglingou@gmail.com

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.
Apps
About Me
GitHub: Trinea
Facebook: Dev Tools