TVOS 16.1中LazyVGrid滚动时丢失焦点问题求助

AI 小北

2026-8-1

TVOS 16.1 LazyVGrid 焦点丢失问题分析与解决

问题原因

TVOS 16.1 中 LazyVGrid 存在焦点计算逻辑bug：长按遥控器上键快速滚动时，系统对网格可视区域内的焦点候选识别不及时，接近顶部时会错误将焦点转移到外部顶部菜单栏。
LazyVGrid 的懒加载视图复用机制，导致快速滚动时部分未完全渲染的单元格无法被系统判定为有效焦点目标，触发焦点回退到父层级或外部视图。

解决办法

1. 限制焦点范围

给 LazyVGrid 添加 focusSection() 修饰符，明确将焦点锁定在网格内部，避免焦点逃逸：

LazyVGrid(columns: gridColumns) {
    // TVShowCard 内容
}
.focusSection()

2. 调整滚动区域内边距

在 LazyVGrid 外层嵌套 ScrollView 并设置顶部内边距，确保滚动到顶部时，网格顶部单元格仍处于可视焦点区域，降低系统误判概率：

ScrollView {
    LazyVGrid(columns: gridColumns) {
        // TVShowCard 内容
    }
    .padding(.top, 20)
}

3. 自定义焦点引导

为每个 TVShowCard 添加焦点变化回调，当网格内单元格失去焦点时，主动将焦点引导回网格内的有效单元格：

ForEach(shows) { show in
    TVShowCard(show: show)
        .onFocusChanged { isFocused in
            if !isFocused && !gridHasFocus {
                focusedShowId = shows[max(0, currentIndex - 1)].id
            }
        }
        .focused($focusedShowId, equals: show.id)
}

配合 focused(_:equals:) 修饰符，确保焦点始终在网格内流转。