You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Glass Element作为navigationTransition源时反向动画异常问题咨询

问题:Glass元素作为导航过渡源时反向动画出现高亮残留故障

当glass元素(包括独立Glass视图或tabViewBottomAccessory)作为navigationTransition的matchedTransitionSource时,在反向动画(比如关闭Sheet)过程中,对应的glass元素会保持高亮状态,直到动画结束前才迅速恢复正常。观察Apple Podcasts等官方应用并未出现此问题,特此询问:这是否属于预期行为?有没有办法避免该故障?

故障演示

Glass元素反向动画高亮故障

最小复现代码

struct ContentView: View {

    @Namespace private var namespace
    @State private var present = false

    var body: some View {
        TabView {
            Color.red.ignoresSafeArea()
        }
        .sheet(isPresented: $present) {
            Text("")
                .navigationTransition(.zoom(sourceID: "source", in: namespace))
        }
        .tabViewBottomAccessory {
            HStack {
                Image(systemName: "play.fill")
                Text("Start Session")

                Spacer(minLength: 0)
            }
            .padding()
            .contentShape(.rect)
            .matchedTransitionSource(id: "source", in: namespace)
            .onTapGesture {
                present = true
            }
        }
    }

}

解决方案与说明

这个现象大概率是SwiftUI框架的bug,并非预期行为。可以通过以下两种方式临时规避:

  • 方案1:转移过渡源到内部容器
    将.matchedTransitionSource修饰符从tabViewBottomAccessory的根内容视图移至内部嵌套容器,同时保留点击手势在最外层,避免过渡逻辑与glass视图的高亮逻辑冲突:
.tabViewBottomAccessory {
    HStack {
        HStack {
            Image(systemName: "play.fill")
            Text("Start Session")
            Spacer(minLength: 0)
        }
        .padding()
        .matchedTransitionSource(id: "source", in: namespace)
    }
    .contentShape(.rect)
    .onTapGesture {
        present = true
    }
}
  • 方案2:手动管控高亮状态
    禁用glass视图的默认按钮高亮,通过状态手动模拟点击反馈,避免反向动画时的高亮残留:
.tabViewBottomAccessory {
    HStack {
        Image(systemName: "play.fill")
        Text("Start Session")
        Spacer(minLength: 0)
    }
    .padding()
    .contentShape(.rect)
    .matchedTransitionSource(id: "source", in: namespace)
    .buttonStyle(.plain)
    .overlay(
        Color.white.opacity(present ? 0 : 0.1)
            .onTapGesture { present = true }
    )
}

Apple Podcasts等官方应用可能使用了内部优化的过渡实现或私有API,因此无此问题。建议优先使用上述方案规避,同时可通过Feedback Assistant向Apple反馈该bug。

内容的提问来源于stack exchange,提问作者Meyssam

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.01 22:33:10