跟 GPT / Gemini / Claude 斗智斗勇好几个日日夜夜都没能摸清楚里面的门道,可能 AI 在一些小众的技术细节上还是力不从心,特别是 tvOS 上的焦点控制。只能来请教熟悉 tvOS / SwiftUI 的大佬们了。
用文字不太好描述,做了个图:

想请教:
- Apple TV 上的 Apple TV+ app 顶部 Hero (大图背景)和上层的按钮可能是用什么 SDK 实现的?( Tabview ? ScrollView ?普通的 ZStack ?)
- 它是怎么做到焦点在最左侧的“Renew Apple TV”按钮上时,既可以向左切换影片,又能仅在到达最左侧第一部影片时才呼出侧边栏(侧边栏应该是.tabViewStyle(.sidebarAdaptable))?
我尝试了:
- 用 ScrollView 或 Tabview 。但这两种方式似乎只适合单个焦点的场景,对于这种有多个按钮的情况无从下手,我甚至试了让实际焦点透明,在上层按钮上模拟焦点行为,但总是会遇到各种问题,特别是快速滑动的情况下;
- 用普通的 ZStack 和 index 索引驱动。通过 onMoveCommand 拦截左右按键,但发现系统 TabView 的优先级更高,总是会在向左切影片时呼出侧边栏;又尝试在最左侧添加了“幽灵焦点”,这样几乎完美,但在快速向左切影片时,侧边栏还是会一直闪现从而露馅。
折腾得心累,我甚至怀疑 Apple 是不是用了什么私有 SDK 或者什么 UIKit 的特性来实现。
还请大佬们不吝赐教。
15 条回复 • 2025-12-31 13:26:02 +08:00
|
1
Cabana 2025 年 12 月 30 日 via Android 哈哈,这个在 Android 上感觉挺好实现的。你们不能监听拦截并消费按键事件么?
|
|
3
Cabana 2025 年 12 月 30 日 via Android |
|
5
timesh 2025 年 12 月 30 日 是不是影片标题和按钮是一个大 div 。切换底图时,这个 div 渐隐,切图,然后 div 显示。配上 A15 芯片,就很丝滑吧。
|
|
6
timesh 2025 年 12 月 30 日 左侧我觉的有 2 个方案,一个是计数器,轮播和右按钮就加,左按就减到 0 就唤起左侧功能区。
或者是轮播图有个 index ,不开启无线轮播那再往左轮播就变-1 然后展开左侧功能区。 |
|
7
Dukewill OP @timesh 现在问题的关键,就是找到关键的问题🐶
大佬的思路就是我现在的 index 方案,麻烦的是侧边栏,它有一个系统级的响应,就是焦点只要到屏幕最左侧,再按一下向左就能呼出这个侧边栏。 我就是不知道 Apple 是怎么做到既能向左切影片,又避免呼出侧边栏,焦点还不抖的(直到最左侧的第一部影片) |
|
8
pc10300 2025 年 12 月 30 日 额 我能想到的就是,在 renew apple tv 按钮左侧,加个透明的按钮,当 focusstat == 这个透明的按钮的时候 index -= 1 ,当动画执行完了以后 再把 focusstate 给到动画结束后的 index 的按钮上。
|
|
9
Dukewill OP @pc10300 看起来就是我说的“幽灵焦点”的方案,这个的问题就是 - 快速连续左切的话,焦点似乎来不及回到正确位置,会让侧边栏鬼畜闪现 。。。
|
|
10
RSTAR 2025 年 12 月 30 日 说句题外话,我觉得这个侧边栏特别恶心,它违反了统一的交互规则,所有 App 都是在 Top 页面再按返回就是退出到桌面,它这一弹出,很容易给用户一种错觉,已经到头了,然后继续留在 TV app 里。
我觉得这明显是故意的,因为任何交互设计师都能发现这个问题,只不过浓眉大眼的苹果竟然也明目张胆的干这种龌龊之事,着实让我震惊。 |
|
14
Loratad1ne 2025 年 12 月 31 日
@RSTAR 用下来感觉:侧边栏可以容纳比顶部导航还要多的东西,而且有层级。iPad tv app 里,顶部导航好看是好看,但是有些菜单只有侧边栏有
|
|
15
RSTAR 2025 年 12 月 31 日
@Loratad1ne #14 主要问题是苹果自己打破自己定的规范,就像法院亲自违法,吃相太难看了。
|
iOS 开发实用技术导航
NSHipster 中文版
› http://nshipster.cn/
cocos2d 开源 2D 游戏引擎
› http://www.cocos2d-iphone.org/
CocoaPods
› http://cocoapods.org/
Google Analytics for Mobile 统计解决方案
› http://code.google.com/mobile/analytics/
WWDC
› https://developer.apple.com/wwdc/
Design Guides and Resources
› https://developer.apple.com/design/
Transcripts of WWDC sessions
› http://asciiwwdc.com
Cocoa with Love
› http://cocoawithlove.com/
Cocoa Dev Central
› http://cocoadevcentral.com/
NSHipster
› http://nshipster.com/
Style Guides
› Google Objective-C Style Guide
› NYTimes Objective-C Style Guide
Useful Tools and Services
› Charles Web Debugging Proxy
› Smore