RecyclerView GridLayoutManager多屏宽适配布局实现问题

保持spanCount固定为2即可，无需为大屏场景修改总列数，通过动态控制item边距、固定普通item宽度的方式，实现大屏下内容居中、Header/Footer全宽的效果。

步骤1：初始化GridLayoutManager #

保留现有spanSizeLookup逻辑，Header、Footer始终占满整行span，普通item占1span：

// 固定普通内容为2列
val mLayoutManager = GridLayoutManager(context, 2)
mLayoutManager.spanSizeLookup = object : GridLayoutManager.SpanSizeLookup() {
    override fun getSpanSize(position: Int): Int {
        return when (adapter.getItem(position)) {
            is HeaderItem, is FooterItem -> 2 // 头尾项横跨全宽
            else -> 1
        }
    }
}
recyclerView.layoutManager = mLayoutManager

步骤2：自定义ItemDecoration控制边距 #

不要在item布局中写死margin，通过ItemDecoration根据当前屏幕宽度动态计算边距，小屏均匀分布、大屏自动计算左右留白让内容居中：

class GridSpacingItemDecoration(
    private val spacingPx: Int, // 通用间距（单位px）
    private val contentMaxWidthPx: Int, // 大屏下普通内容区总最大宽度（单位px）
    private val isLargeScreen: Boolean, // 是否为宽度>767dp的大屏
    private val isHeaderOrFooter: (position: Int) -> Boolean
) : RecyclerView.ItemDecoration() {

    override fun getItemOffsets(
        outRect: Rect,
        view: View,
        parent: RecyclerView,
        state: RecyclerView.State
    ) {
        val position = parent.getChildAdapterPosition(view)
        if (position == RecyclerView.NO_POSITION) return
        // 头尾项不加左右边距，仅保留底部间距，实现全宽展示
        if (isHeaderOrFooter(position)) {
            outRect.set(0, 0, 0, spacingPx)
            return
        }
        // 小屏（360-767dp）：两列均匀分配间距
        if (!isLargeScreen) {
            val column = position % 2
            outRect.left = if (column == 0) spacingPx else spacingPx / 2
            outRect.right = if (column == 1) spacingPx else spacingPx / 2
            outRect.bottom = spacingPx
            return
        }
        // 大屏（>767dp）：计算左右边距，让内容区整体居中
        val recyclerWidth = parent.width
        val sidePadding = (recyclerWidth - contentMaxWidthPx) / 2
        val column = position % 2
        outRect.left = if (column == 0) sidePadding else spacingPx / 2
        outRect.right = if (column == 1) sidePadding else spacingPx / 2
        outRect.bottom = spacingPx
    }
}

初始化ItemDecoration并添加到RecyclerView：

val spacingDp = 16f // 全局间距可按设计稿调整
val spacingPx = (spacingDp * resources.displayMetrics.density).toInt()
// 大屏下普通内容区总宽度固定为720dp，可按需调整
val contentMaxWidthPx = (720f * resources.displayMetrics.density).toInt()
// 获取当前实际内容宽度，适配分屏、折叠屏场景建议在RecyclerView布局完成后获取实际宽度
val currentWidthDp = resources.displayMetrics.widthPixels / resources.displayMetrics.density
val isLargeScreen = currentWidthDp > 767f

recyclerView.addItemDecoration(
    GridSpacingItemDecoration(spacingPx, contentMaxWidthPx, isLargeScreen) { pos ->
        val item = adapter.getItem(pos)
        item is HeaderItem || item is FooterItem
    }
)

步骤3：固定普通item宽度避免拉伸 #

大屏场景下不要让普通item随屏幕拉伸，在普通item的ViewHolder中动态设置宽度：

// 普通item绑定逻辑
fun bind() {
    val lp = itemView.layoutParams
    lp.width = if (isLargeScreen) {
        // 单item宽度 = (内容区总宽度 - 中间间距)/2
        (contentMaxWidthPx - spacingPx) / 2
    } else {
        // 小屏自动撑满分配到的宽度
        ViewGroup.LayoutParams.MATCH_PARENT
    }
    itemView.layoutParams = lp
    // 其余数据绑定逻辑
}

效果参考 #

最终实现效果：

• 360-767dp宽度区间：Header/Footer全宽展示，普通item两列均匀排布，间距一致
• 宽度大于767dp区间：Header/Footer依然撑满全宽，两个普通item保持固定设计尺寸、整体居中，不会拉伸贴边

适配提示：如果需要支持折叠屏开合、分屏/自由窗口等动态宽度变化场景，建议监听RecyclerView的布局变化，在宽度更新时重新设置ItemDecoration和item宽度参数，避免布局错乱。

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