在iOS26启动弹出层时,UI组件初始显示的颜色就不对
在iOS26使用SwiftUI启动.sheet时,我遇到了一个怪异的bug。视图首次出现时,按钮和选择器等组件的初始颜色是错误的,但很快就会变成正确的颜色:
https://youtube.com/shorts/trKvZCYuYQ8
我知道如果把按钮上的.disabled注释掉,它就不会再这样了,但选择器就不确定了。以下是完整的代码:
import SwiftUI
struct ContentView: View
{
@State private var selection = "Option 1"
@State private var sheetIsPresented: Bool = false
let options = ["Option 1",
"Option 2",
"Option 3",
"Option 4"]
var body: some View
{
Button("Enter")
{
self.sheetIsPresented = true
}
.buttonStyle(.borderedProminent)
.sheet(isPresented: self.$sheetIsPresented)
{
VStack
{
Picker("Choose Option", selection: self.$selection)
{
ForEach(self.options, id: \.self)
{
option in Text(option).tag(option)
}
}
.pickerStyle(.menu)
}
Button("Test")
{
}
.disabled(true)
.buttonStyle(.borderedProminent)
}
}
}
解决方案
Button 和 Picker 的外观似乎取决于sheet的背景,而在iOS 26中,sheet的背景取决于sheet的大小。Apple关于 Adopting Liquid Glass 的说明中有更多解释:
模态视图,如sheets和 action sheets,采用Liquid Glass。Sheets有更大的圆角半径,半张sheets会从显示边缘向内缩进,让底下的内容可以从下面若隐若现地透出。当半张sheet扩展到全高时,它会过渡为更不透明的外观,以帮助保持对任务的专注。
如果在你的示例中把 .presentationDetents([.medium, .large]) 应用到sheet内容并在iPhone 17模拟器上运行,你将看到在切换两种sheet大小时组件的外观如何变化。需要把被禁用的 Button 移动到 VStack 内部,以实现这个效果:
.sheet(isPresented: $sheetIsPresented) {
VStack {
// ... Picker + Button
}
.presentationDetents([.medium, .large])
}

在iPad的情况下,似乎任何小于整页的sheet在过渡时都会呈现半透明的玻璃外观,而到达时却是更不透明的外观。因此,这也是你在示例中按钮外观变化的原因。
作为变通方法,尝试将 .presentationBackground 设置为纯色。
- 如果你想要与一个大sheet相同的背景,可以使用
UIColor.systemBackground。这会自动适应明暗模式。 - 不幸的是,使用
ShapeStyle.background不起作用,因为这与sheet已经拥有的背景相同。
.sheet(isPresented: $sheetIsPresented) {
VStack {
// ...
}
.presentationBackground(Color(.systemBackground))
}

站内所有文章版权归属LeftHeroAI导航站,无授权禁止任何主体转载、抄袭、复制内容,亦不得私自架设镜像站点。一经侵权,本站将通过法律途径追责。