AssNineGridView——九宫格图片展示

目录

前言

一、AssNineGridView是什么？

预览效果：

二、使用步骤

1、添加依赖

（1）build.gradle(:app)

（2）settings.gradle（Project  Settings）

         （3）gradle.properties

（4）添加权限

2、功能实现

自定义图片加载器GlideImageLoader

        activity_main

         MainActivity

关于

---

---

前言

这是我Android学习过程中一次记录，参考了一些大佬们的文章，记录在此，只是为了以后方便自己查阅，希望对大家有用。

下面是我所学习的文章：

https://blog.csdn.net/weixin_45882303/article/details/121319794

 https://blog.csdn.net/weixin_40509481/article/details/82774002

---

一、AssNineGridView是什么？

AssNineGridView是一个九宫格图片展示的第三方的开源控件，类似于QQ空间或者微信朋友圈的图片展示。

预览效果：

---

二、使用步骤

1、添加依赖

（1）build.gradle(:app)

    implementation 'com.github.assion:AssNineGridView:v1.0.2'

 下面这个是Glide的第三方依赖包，用于图片加载，当然你也可以使用其他的图片加载框架。

    //第三方框架依赖包 glide
    implementation 'com.github.bumptech.glide:glide:4.13.0'
    annotationProcessor 'com.github.bumptech.glide:compiler:4.13.0'

（2）settings.gradle（Project  Settings）

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

 Android Studio升级到Arctic Fox后，一些配置项的位置都做了改变。新版的Android Studio中，这些配置放到了settings.gradle文件中。

可以参考这篇文章：https://blog.csdn.net/firechun/article/details/121797615

（3）gradle.properties

android.enableJetifier=true

 

 在Android Studio中新建项目使用Androidx库，如果此时使用的第三方库中包含旧版Support库，会导致冲突报错。

参考文档：https://blog.csdn.net/yqc603090635/article/details/123819737

（4）添加权限

 <uses-permission android:name="android.permission.INTERNET"/>
 <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
 <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

 android:requestLegacyExternalStorage="true"
 android:usesCleartextTraffic="true"

2、功能实现

自定义图片加载器GlideImageLoader

//自定义图片加载器GlideImageLoader
public class GlideImageLoader implements AssNineGridView.ImageLoader{

    @Override
    public void onDisplayImage(Context context, ImageView imageView, String url) {
        Glide.with(context).load(url).into(imageView);
    }

    @Override
    public Bitmap getCacheImage(String url) {
        return null;
    }
}

源码中只提供了接口并没有实现，所以需要自己实现该接口。

activity_main

    <!--
    angv_singleImgRatio	只显示一张图片时图片宽高比
    angv_gridSpace	    网格显示图片时，图片之间的间距，默认3dp
    angv_maxSize	    最多显示图片的数量，默认最大9张
    -->

    <com.assionhonty.lib.assninegridview.AssNineGridView
        android:id="@+id/angv"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        app:angv_gridSpace="3dp"
        app:angv_maxSize="9"
        app:angv_singleImgRatio="1"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
       />

 MainActivity

 详细信息已经注释在下面代码中。

import androidx.appcompat.app.AppCompatActivity;
import android.content.Context;
import android.os.Bundle;
import com.assionhonty.lib.assninegridview.AssNineGridView;
import com.assionhonty.lib.assninegridview.AssNineGridViewAdapter;
import com.assionhonty.lib.assninegridview.AssNineGridViewClickAdapter;
import com.assionhonty.lib.assninegridview.ImageInfo;
import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {

    List<String> stringList = new ArrayList<>();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        //初始化AssNineGridView的图片加载器
        AssNineGridView.setImageLoader(new GlideImageLoader());

        stringList.add("https://tse1-mm.cn.bing.net/th/id/OIP-C.y3AMSus4KMcbFza-uewOhgHaLH?w=117&h=180&c=7&r=0&o=5&pid=1.7");
        stringList.add("https://tse1-mm.cn.bing.net/th/id/OIP-C.bLEHmVkvEUuwtN41iaQyMQHaLE?w=117&h=180&c=7&r=0&o=5&pid=1.7");
        stringList.add("https://tse2-mm.cn.bing.net/th/id/OIP-C._PLdprpwofxUKJ0xjVWfSQHaLL?w=127&h=193&c=7&r=0&o=5&pid=1.7");
        stringList.add("https://tse1-mm.cn.bing.net/th/id/OIP-C.V1uQgeE2nybdshpMyIEbxgHaEK?w=322&h=180&c=7&r=0&o=5&pid=1.7");
        stringList.add("https://tse1-mm.cn.bing.net/th/id/OIP-C.Zte3ljd4g6kqrWWyg-8fhAHaEo?w=290&h=180&c=7&r=0&o=5&pid=1.7");
        stringList.add("https://tse2-mm.cn.bing.net/th/id/OIP-C.Tqph3dJ7hqyYh4e9Wn30ywHaEK?w=332&h=186&c=7&r=0&o=5&pid=1.7");
        stringList.add("https://tse1-mm.cn.bing.net/th/id/OIP-C.86467O4jZP-Q2f4Qt7_V5wHaEK?w=302&h=180&c=7&r=0&o=5&pid=1.7");
        stringList.add("https://tse1-mm.cn.bing.net/th/id/OIP-C.pl32bZJr8BHIQANNQkHNGQHaHa?w=169&h=180&c=7&r=0&o=5&pid=1.7");
        stringList.add("https://tse4-mm.cn.bing.net/th/id/OIP-C.AUcgy3ag3HC1Af-0M3RH_QHaFS?w=260&h=186&c=7&r=0&o=5&pid=1.7");
        stringList.add("https://tse2-mm.cn.bing.net/th/id/OIP-C.j1XzvGRPR15s3jDAUFZ2XgHaHa?w=178&h=180&c=7&r=0&o=5&pid=1.7");

        //ImageInfo是库中提供的数据Bean   Bean简单来讲就是可重用 Java 组件
        // 需要两个url，分别表示小图和大图的url，没有大图或者小图，则都赋给相同的Url即可
        List<ImageInfo> imageInfo = getImageInfo();

        AssNineGridView assNineGridView = findViewById(R.id.angv);

        //AssNineGridViewClickAdapter：库中自带的适配器，点击预览大图
        assNineGridView.setAdapter(new AssNineGridViewClickAdapter(this, imageInfo));
    }

    private List<ImageInfo> getImageInfo() {
        List<ImageInfo> imageInfoS = new ArrayList<>();
        for (String url : stringList){
            ImageInfo imageInfo = new ImageInfo();
            imageInfo.setBigImageUrl(url);//设置大图
            imageInfo.setThumbnailUrl(url);//设置缩略图
            imageInfoS.add(imageInfo);
        }
        return imageInfoS;
    }

    //如果想实现其他的点击事件，可以自己继承 AssNineGridViewAdapter 实现其中 onImageItemClick 方法。
    private class MyAssAdapter extends AssNineGridViewAdapter {
        private Context mContext;

        public MyAssAdapter(Context context, List<ImageInfo> imageInfo) {
            super(context, imageInfo);
            mContext = context;
        }

        @Override
        public void onImageItemClick(Context context, AssNineGridView angv, int index, List<ImageInfo> imageInfo) {
            super.onImageItemClick(context, angv, index, imageInfo);
            //执行点击事件

        }

    }


}

---

关于

如果在使用过程中有疑问或其他问题，可以给我留言。