端午过去不久,假期还没享受完就急急忙忙来了工作,本来假期前想写这遍文章的,结果一直忙的没空,对于微信朋友圈和微博上传图片大家应该都很熟悉吧,微信几乎是现在广大男女老少的必备,我也是其中一个,,O(∩_∩)O,每天挤着地铁刷刷微博朋友圈看看头条,一小时就默然的过去了。接下来介绍下NineGridlayout、这个控件,相信用到的都不陌生,github 安卓社区上很多这样的Demo,但是在用到的地方还是得根据自己的需求进行修改就好了,切入正题
首先我们来看看效果图
- 自定义view 继承 ViewGroup,在多张图片的时候根据屏幕进行适配,单张图片时需要自己指定图片的宽高。
1.大家都知道自定义view的基本过程,这里就省略了,贴出主要的代码
/** 设置图片数据 Image是存放图片的实体<Url、宽和高>*/
private int gap = 5; //图片之间的间隔
private int columns; //列
private int rows; //行
private List listData;
private int totalWidth;
//构造方法
public NineGridlayout(Context context, AttributeSet attrs) { super(context, attrs); ScreenTools screenTools=ScreenTools.instance(getContext());
totalWidth=screenTools.getScreenWidth()-screenTools.dip2px(80);
}
public void setImagesData(List<Image> lists) {
if (lists == null || lists.isEmpty()) {
return;
}
//初始化子布局
generateChildrenLayout(lists.size());
//这里做一个重用view的处理
if (listData == null) {
int i = 0;
while (i < lists.size()) {
CustomImageView iv = generateImageView();
addView(iv, generateDefaultLayoutParams());
i++;
}
} else {
int oldViewCount = listData.size();
int newViewCount = lists.size();
if (oldViewCount > newViewCount) {
removeViews(newViewCount - 1, oldViewCount - newViewCount);
} else if (oldViewCount < newViewCount) {
for (int i = 0; i < newViewCount - oldViewCount; i++) {
CustomImageView iv = generateImageView();
addView(iv, generateDefaultLayoutParams());
}
}
}
listData = lists;
layoutChildrenView();
}
2.根据图片个数确定行列数量
private void generateChildrenLayout(int length) {
if (length <= 3) {
rows = 1;
columns = length;
} else if (length <= 6) {
rows = 2;
columns = 3;
if (length == 4) {
columns = 2;
}
} else {
rows = 3;
columns = 3;
}
}
3.设置对应的索引
private int[] findPosition(int childNum) {
int[] position = new int[2];
for (int i = 0; i < rows; i++) { for (int j = 0; j < columns; j++) { if ((i * columns + j) == childNum) { position[0] = i;//行 position[1] = j;//列 break; } } } return position;}
4.计算子view的位置
private void layoutChildrenView(){
int childrenCount = listData.size();
int singleWidth = (totalWidth - gap * (3 - 1)) / 3;
int singleHeight = singleWidth;
//根据子view数量确定高度
ViewGroup.LayoutParams params = getLayoutParams();
params.height = singleHeight * rows + gap * (rows - 1);
setLayoutParams(params);
for (int i = 0; i < childrenCount; i++) {
CustomImageView childrenView = (CustomImageView) getChildAt(i);
childrenView.setImageUrl(((Image) listData.get(i)).getUrl());
int[] position = findPosition(i);
int left = (singleWidth + gap) * position[1];
int top = (singleHeight + gap) * position[0];
int right = left + singleWidth;
int bottom = top + singleHeight;
childrenView.layout(left, top, right, bottom);
}
5.在布局中使用
<com.lukey.ninegridlayout.NineGridlayout
android:id="@+id/nine_gd_layout" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="8dp"/>
6.在MainActivity 设置数据的时候 9条朋友圈对应就9张图片, images.length是图片数组的数 据源,demo上的图片来源于网络
for (int i = 0; i < images.length; i++) { ArrayList<Image> itemList = new ArrayList<>(); for (int j = 0; j <= i; j++) { itemList.add(new Image(images[j][0], Integer.parseInt(images[j][1]), Integer.parseInt(images[j][2]))); } imagesList.add(itemList);}
- 主要的代码自定义view就是这么多了,在调用的时候咱们还得用图片进行赋值自定义的图片,CustomImageView是自定义的图片view,大家也可以用fresco,或者ImageView,当然了这个没有定制性的规定只是实现出这个效果就O了。需要完整demo的朋友可以留言
- 下面是几个反鸡汤语录,有兴趣的朋友可以看看,平时喜欢段子和优雅的心灵鸡汤,看看就好
有时候你不逼自己一把,你就不知道你还有把事情搞砸的本事。
掉落枯井的王老汉在热心村民们的帮助之下总算适应了井底生活。
真正努力过的人,就会明白天赋的重要。
上帝是公平的,给了一张丑脸,当然也会给你一个矮的身高来搭配。
还是要努力的,不然有时候不努力一把你就不知道什么叫绝望。
以前车马信件都很慢,书信很远,一生只够爱一个人,但……能纳很多妾……
为什么别人看你一眼就觉得你是学生?不是因为你长得小,而是因为你穿的土。
朋友遭遇挫折后,如果他茶饭不思,不要太担心,这说明他还在思考问题。如果他暴饮暴食,那就要小心了,这种破罐子破摔的人,跳楼都是小事,就怕他偷你零食。
沉默,沉默是今晚的康桥,赵州桥,郑板桥。
一路上有你,苦一点也愿意。苦多了免谈。
- 努力真的有回报,如果暂时没有,只是努力不够。
- Github源码