Android Kotlin：如何按Firestore ArrayList大小在RecyclerView项中创建ImageView

1. 修改ItemCard布局，添加图片容器 #

在你的ItemCard布局里，新增一个用于承载动态ImageView的容器，后续将动态生成的ImageView添加到这个容器中：

<!-- 插入到现有ItemCard布局的合适位置 -->
<LinearLayout
    android:id="@+id/image_container"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:gap="8dp"
    android:paddingVertical="4dp"/>

如果需要支持横向滚动（图片数量较多时），可以用HorizontalScrollView包裹这个LinearLayout：

<HorizontalScrollView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:scrollbars="none">
    <LinearLayout
        android:id="@+id/image_container"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:gap="8dp"
        android:paddingVertical="4dp"/>
</HorizontalScrollView>

2. 在RecyclerView ViewHolder中绑定容器控件 #

在Adapter的ViewHolder类里，获取图片容器的引用：

class ChatViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
    val imageContainer: LinearLayout = itemView.findViewById(R.id.image_container)
    // 其他需要绑定的控件（如message、timeStamp等）
}

3. 动态生成ImageView并加载图片 #

在Adapter的onBindViewHolder方法中，遍历images列表，逐个生成ImageView并添加到容器中，同时加载Firestore返回的图片链接：

override fun onBindViewHolder(holder: ChatViewHolder, position: Int) {
    val currentChat = ajansChatList[position]
    
    // 清空容器，避免RecyclerView复用Item时出现重复图片
    holder.imageContainer.removeAllViews()
    
    // 遍历图片列表生成ImageView
    currentChat.images.forEach { imageUrl ->
        imageUrl?.let { url ->
            val imageView = ImageView(holder.itemView.context)
            // 设置ImageView布局参数，可按需调整宽高
            val layoutParams = LinearLayout.LayoutParams(
                dpToPx(120, holder.itemView.context),
                dpToPx(120, holder.itemView.context)
            )
            imageView.layoutParams = layoutParams
            
            // 设置图片显示样式
            imageView.scaleType = ImageView.ScaleType.CENTER_CROP
            // 可选：添加圆角效果
            imageView.clipToOutline = true
            imageView.outlineProvider = object : ViewOutlineProvider() {
                override fun getOutline(view: View, outline: Outline) {
                    outline.setRoundRect(0, 0, view.width, view.height, dpToPx(8, view.context).toFloat())
                }
            }
            
            // 用Glide加载网络图片（需添加依赖）
            Glide.with(holder.itemView.context)
                .load(url)
                .placeholder(R.drawable.placeholder) // 加载中占位图
                .error(R.drawable.load_error) // 加载失败占位图
                .into(imageView)
            
            // 将ImageView添加到容器
            holder.imageContainer.addView(imageView)
        }
    }
    
    // 绑定其他数据（如message、sender、timeStamp等）
    // holder.messageTv.text = currentChat.message
    // ...
}

// 工具方法：dp转px
private fun dpToPx(dp: Int, context: Context): Int {
    return (dp * context.resources.displayMetrics.density).toInt()
}

4. 添加Glide依赖（未添加时需执行） #

在Module级别的build.gradle文件中添加Glide依赖，用于高效加载网络图片：

dependencies {
    // 其他依赖...
    implementation 'com.github.bumptech.glide:glide:4.16.0'
    annotationProcessor 'com.github.bumptech.glide:compiler:4.16.0'
}

可选优化：用嵌套RecyclerView替代LinearLayout #

如果图片数量较多，嵌套RecyclerView的性能更优，避免一次性创建过多ImageView：

1. 创建单独的图片Item布局item_image.xml：

<ImageView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/image_view"
    android:layout_width="120dp"
    android:layout_height="120dp"
    android:scaleType="CENTER_CROP"
    android:clipToOutline="true"
    android:radius="8dp"/>

2. 原ItemCard布局替换为嵌套RecyclerView：

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/images_rv"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"/>

3. 编写图片列表Adapter：

class ImagesAdapter(private val images: List<String?>) : RecyclerView.Adapter<ImagesAdapter.ImageViewHolder>() {
    inner class ImageViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
        val imageView: ImageView = itemView.findViewById(R.id.image_view)
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ImageViewHolder {
        val view = LayoutInflater.from(parent.context).inflate(R.layout.item_image, parent, false)
        return ImageViewHolder(view)
    }

    override fun onBindViewHolder(holder: ImageViewHolder, position: Int) {
        images[position]?.let { url ->
            Glide.with(holder.itemView.context)
                .load(url)
                .placeholder(R.drawable.placeholder)
                .error(R.drawable.load_error)
                .into(holder.imageView)
        }
    }

    override fun getItemCount() = images.size
}

4. 主Adapter中初始化嵌套RecyclerView：

override fun onBindViewHolder(holder: ChatViewHolder, position: Int) {
    val currentChat = ajansChatList[position]
    // 初始化嵌套RecyclerView
    holder.imagesRv.adapter = ImagesAdapter(currentChat.images)
    // 其他数据绑定...
}

内容的提问来源于stack exchange，提问作者Sezai