无法为ActionSheet手动设置colorScheme问题求助

当前ActionSheet会自动适配系统设置里的colorScheme，我想手动给它指定配色模式，现有实现代码如下：

var body: some View {
    VStack {
        Button(action: {
            showingActionSheet = true
        }) {
            Text("Action")
        }
        .actionSheet(isPresented: $showingActionSheet) {
            ActionSheet(
                title: Text("Title"),
                buttons: [
                    .destructive(Text("Action 2")) {
                    },
                    .cancel()
                ]
            )
        }
    }
}

我尝试在VStack上添加以下三个修饰器，但都没对ActionSheet产生效果：

.preferredColorScheme(.dark)
.environment(\.colorScheme, .dark)
.accentColor(.black)

解决方法 #

SwiftUI的ActionSheet是系统级模态组件，它的环境继承自应用根视图而非触发它的父视图，因此直接在父视图添加环境修饰器无法生效。可以通过以下两种方式实现需求：

1. iOS 15+ 推荐方案：使用ConfirmationDialog替代ActionSheet

苹果在iOS 15及以后推出了ConfirmationDialog作为ActionSheet的替代组件，支持直接为其添加环境修饰器指定配色：

@State private var showingDialog = false

var body: some View {
    VStack {
        Button("Action") {
            showingDialog = true
        }
        .confirmationDialog("Title", isPresented: $showingDialog) {
            Button("Action 2", role: .destructive) {}
            Button("Cancel", role: .cancel) {}
        }
        .environment(\.colorScheme, .dark) // 直接为弹窗指定配色模式
    }
}

2. 兼容旧版本：自定义UIKit包装的弹窗

如果需要支持iOS 15以下版本，可以基于UIKit的UIAlertController自定义实现，通过overrideUserInterfaceStyle强制指定配色：

import SwiftUI
import UIKit

struct CustomActionSheet: UIViewControllerRepresentable {
    @Binding var isPresented: Bool
    let title: String
    let destructiveAction: (() -> Void)?
    let colorScheme: UIUserInterfaceStyle
    
    func makeUIViewController(context: Context) -> UIViewController {
        UIViewController()
    }
    
    func updateUIViewController(_ uiViewController: UIViewController, context: Context) {
        guard isPresented, uiViewController.presentedViewController == nil else { return }
        
        let alert = UIAlertController(title: title, message: nil, preferredStyle: .actionSheet)
        alert.overrideUserInterfaceStyle = colorScheme // 设置配色模式
        
        if let action = destructiveAction {
            alert.addAction(UIAlertAction(title: "Action 2", style: .destructive, handler: { _ in action() }))
        }
        alert.addAction(UIAlertAction(title: "Cancel", style: .cancel, handler: { _ in isPresented = false }))
        
        uiViewController.present(alert, animated: true)
    }
}

// 使用示例
struct ContentView: View {
    @State private var showingActionSheet = false
    
    var body: some View {
        VStack {
            Button("Action") {
                showingActionSheet = true
            }
        }
        .overlay(CustomActionSheet(
            isPresented: $showingActionSheet,
            title: "Title",
            destructiveAction: {},
            colorScheme: .dark
        ))
    }
}

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