自定义ViewGroup实现微信朋友圈九宫格图片控件

1:自定义属性如下

2：布局中使用自定义NineImageLayout

<com.cyq.customview.nineLayout.view.NineImageLayout

android:id=“@+id/nine_image_layout”

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:layout_below=“@+id/tv_title”

android:layout_marginTop=“20dp”

app:nine_imageGap=“4dp”

app:nine_layoutWidth=“300dp”

app:nine_singleImageWidth=“180dp” />

3：Adapter方式绑定数据和UI

其中Glide.asBitmap是为了计算图片宽高，如果后台有返回图片的宽高可以省略这一步，直接setSingleImage(width, height,imageView)。

Ps:如果可以建议后台返回图片宽高，这样可以避免单张图片的时候控件高度跳屏，比如我限制单张图片宽高在·200dp·范围，要展示宽1000px高500px的时候，在图片未加载完成时控件宽高为200dp，图片加载完成后高度变为100dp，会有一个不好的用户体验，所以建议上传图片的时候记录图片宽高信息。

nineImageLayout.setAdapter(new NineImageAdapter() {

@Override

protected int getItemCount() {

return mData.size();

}

@Override

protected View createView(LayoutInflater inflater, ViewGroup parent, int i) {

return inflater.inflate(R.layout.item_img_layout, parent, false);

}

@Override

protected void bindView(View view, final int i) {

final ImageView imageView = view.findViewById(R.id.iv_img);

Glide.with(mContext).load(mData.get(i)).into(imageView);

if (mData.size() == 1) {

Glide.with(mContext)

.asBitmap()

.load(mData.get(0))

.into(new SimpleTarget() {

@Override

public void onResourceReady(Bitmap bitmap, Transition<? super Bitmap> transition) {

final int width = bitmap.getWidth();

final int height = bitmap.getHeight();

nineImageLayout.setSingleImage(width, height,imageView);

}

});

Glide.with(mContext).load(mData.get(0)).into(imageView);

} else {

Glide.with(mContext).load(mData.get(i)).into(imageView);

}

}

@Override

public void OnItemClick(int i, View view) {

super.OnItemClick(position, view);

Toast.makeText(mContext, “position:” + mData.get(i), Toast.LENGTH_SHORT).show();

}

});

列表里面使用

1：页面放一个RecyclerView

<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=“.nineLayout.NineImageLayoutActivity”>

<androidx.recyclerview.widget.RecyclerView

android:id=“@+id/recyclerview”

android:layout_width=“match_parent”

android:layout_height=“wrap_content” />

2：item布局如下

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android=“http://schemas.android.com/apk/res/android”

xmlns:app=“http://schemas.android.com/apk/res-auto”

android:layout_width=“match_parent”

android:layout_height=“wrap_content”

android:layout_margin=“20dp”>

<TextView

android:id=“@+id/tv_title”

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:text=“标题”

android:textColor=“@android:color/black”

android:textSize=“18sp” />

<com.cyq.customview.nineLayout.view.NineImageLayout

android:id=“@+id/nine_image_layout”

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:layout_below=“@+id/tv_title”

android:layout_marginTop=“20dp”

app:nine_imageGap=“4dp”

app:nine_layoutWidth=“300dp”

app:nine_singleImageWidth=“180dp” />

3：Activity中构造一下测试数据，大致代码如下

public class NineImageLayoutActivity extends AppCompatActivity {

private RecyclerView mRecyclerView;

private MyAdapter mAdapter;

private Random random;

private final String URL_IMG = “http://q3x62hkt1.bkt.clouddn.com/banner/58f57dfa5bb73.jpg”;

private final String URL_IMG_2 = “http://q3x62hkt1.bkt.clouddn.com/timg.jpeg”;

private List<List> mList = new ArrayList<>();

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_nine_image_layout);

random = new Random();

List testList = new ArrayList<>();

testList.add(URL_IMG_2);

for (int i = 0; i < 100; i++) {

int count = i % 9 + 1;

List list = new ArrayList<>();

for (int j = 0; j < count; j++) {

list.add(URL_IMG);

}

if (i % 8 == 0) {

mList.add(testList);

}

mList.add(list);

}

mRecyclerView = findViewById(R.id.recyclerview);

mAdapter = new MyAdapter(mList, this);

mRecyclerView.setLayoutManager(new LinearLayoutManager(this));

mRecyclerView.setAdapter(mAdapter);

}

}

尾声

如果你想成为一个优秀的 Android 开发人员，请集中精力，对基础和重要的事情做深度研究。

对于很多初中级Android工程师而言，想要提升技能，往往是自己摸索成长，不成体系的学习效果低效漫长且无助。 整理的这些架构技术希望对Android开发的朋友们有所参考以及少走弯路，本文的重点是你有没有收获与成长，其余的都不重要，希望读者们能谨记这一点。

这里，笔者分享一份从架构哲学的层面来剖析的视频及资料分享给大家梳理了多年的架构经验，筹备近6个月最新录制的，相信这份视频能给你带来不一样的启发、收获。

PS：之前因为秋招收集的二十套一二线互联网公司Android面试真题 （含BAT、小米、华为、美团、滴滴）和我自己整理Android复习笔记（包含Android基础知识点、Android扩展知识点、Android源码解析、设计模式汇总、Gradle知识点、常见算法题汇总。）

架构篇

《Jetpack全家桶打造全新Google标准架构模式》

经验，筹备近6个月最新录制的，相信这份视频能给你带来不一样的启发、收获。[外链图片转存中…(img-Bv1ze2qF-1726065131741)]

PS：之前因为秋招收集的二十套一二线互联网公司Android面试真题 （含BAT、小米、华为、美团、滴滴）和我自己整理Android复习笔记（包含Android基础知识点、Android扩展知识点、Android源码解析、设计模式汇总、Gradle知识点、常见算法题汇总。）

[外链图片转存中…(img-lDDCP8WF-1726065131742)]

架构篇

《Jetpack全家桶打造全新Google标准架构模式》
[外链图片转存中…(img-UeH2D8Wx-1726065131743)]