Home

Awesome

NineGridView

类似QQ空间,微信朋友圈,微博主页等,展示图片的九宫格控件,自动根据图片的数量确定图片大小和控件大小,使用Adapter模式设置图片,对外提供接口回调,支持任意的图片加载框架,如 Glide,ImageLoader,Fresco,xUtils3,Picasso 等,支持点击图片全屏预览大图。

该项目是根据:https://github.com/laobie/NineGridImageView 修改而成,进行了优化扩展,使代码更加简单,喜欢原作的可以去使用。同时欢迎大家下载体验本项目,如果使用过程中遇到什么问题,欢迎反馈。

联系方式

演示

image image image image imageimage

1.用法

使用前,对于Android Studio的用户,可以选择添加:

	compile 'com.lzy.widget:ninegridview:0.2.0'

或者使用

    compile project(':ninegridview')

2.项目功能

3.参数含义

<table> <tdead> <tr> <th align="center">自定义属性名字</th> <th align="center">参数含义</th> </tr> </tdead> <tbody> <tr> <td align="center">ngv_singleImageSize</td> <td align="center">只显示一张图片时的最大图片大小</td> </tr> <tr> <td align="center">ngv_singleImageRatio</td> <td align="center">只显示一张图片时图片宽高比</td> </tr> <tr> <td align="center">ngv_gridSpacing</td> <td align="center">网格显示图片时,图片之间的间距,默认3dp</td> </tr> <tr> <td align="center">ngv_maxSize</td> <td align="center">最多显示图片的数量,默认最大9张</td> </tr> <tr> <td align="center">ngv_mode</td> <td align="center">支持fill和grid两种显示模式,其中grid模式在显示4张图片时采用2*2的布局</td> </tr> </tbody> </table>

4.代码演示

1.在Application中初始化NineGridView的图片加载器

    NineGridView.setImageLoader(new PicassoImageLoader());

    /** Picasso 加载 */
    private class PicassoImageLoader implements NineGridView.ImageLoader {

        @Override
        public void onDisplayImage(Context context, ImageView imageView, String url) {
            Picasso.with(context).load(url)//
                    .placeholder(R.drawable.ic_default_image)//
                    .error(R.drawable.ic_default_image)//
                    .into(imageView);
        }

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

2.在自己的Adapter中初始化NineGridView的适配器

	ArrayList<ImageInfo> imageInfo = new ArrayList<>();
    List<EvaluationPic> imageDetails = item.getAttachments();
    if (imageDetails != null) {
        for (EvaluationPic imageDetail : imageDetails) {
            ImageInfo info = new ImageInfo();
            info.setThumbnailUrl(imageDetail.smallImageUrl);
            info.setBigImageUrl(imageDetail.imageUrl);
            imageInfo.add(info);
        }
    }
    holder.nineGrid.setAdapter(new ClickNineGridViewAdapter(context, imageInfo));