Watch App交互视图时工具栏与标题消失问题排查

我开发了一款从iPhone接收图片的Watch App，用户需要解放双手，所以要在Watch上查看图片，做了个基础图片查看器，支持缩放和平移。但用户平移或缩放时，工具栏和标题会消失。这个问题在模拟器和同事的A2376型号Watch上出现，我的A2356型号Watch上没出现，已经在watchOS 9.6.2和10.0.1版本测试过。

示例代码 #

// View is presented on a sheet

TabView(selection: $viewing) {
    ForEach(images) { reference in
        reference.img
            .resizable()
            .aspectRatio(contentMode: .fit)
            .scaleEffect(scale)
            .offset(offset + draggingOffset)
            .frame(width: screenSize.width, height: screenSize.height-1)
            .clipped()
            .id(reference.id)
            .gesture(panGesture, including: .gesture)
            .gesture(tapZoomGesture)
            .navigationTitle(viewerTitle)
            .focusable()
            .digitalCrownRotation(detent: $scale,
                                  from: 0.5,
                                  through: scaleMax,
                                  by: 0.1,
                                  sensitivity: .low,
                                  isContinuous: false,
                                  isHapticFeedbackEnabled: false,
                                  onIdle: { offset = stickyEdgeOffset })
    }
}

问题成因分析 #

• 机型交互逻辑差异：A2376是支持全屏手势的Apple Watch Series 7/8，而A2356是无全屏手势的初代SE。watchOS在全屏手势机型上，默认会在用户执行拖拽类手势时自动隐藏导航栏和工具栏，这是系统针对全屏交互的优化设计，非全屏手势机型没有这个默认行为。
• 手势优先级冲突：你给图片添加的panGesture未明确设置与系统手势的优先级，在支持全屏手势的机型上，系统会把图片的拖拽操作识别为导航栏隐藏的触发条件，导致标题和工具栏被自动隐藏。
• 全屏视图触发系统逻辑：你设置的图片视图.frame(width: screenSize.width, height: screenSize.height-1)几乎占满整个屏幕，系统判定当前为全屏交互场景，触发了自动隐藏导航栏的机制，而你的机型因不支持全屏手势，不会触发该逻辑。

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