在 SwiftUI 中更改 Picker 的导航标题

Question

当用户在Picker 中选择某个选项时，我想设置一个导航标题

这是我的选择模型：

enum AppIcon: CaseIterable, Identifiable {

    var id: Self {
        return self
    }

    case `default`
    case ethereum
    case litecoin

    var name: String {
        switch self {
        case .default:
            return "Bitcoin"
        case .ethereum:
            return "Ethereum"
        case .litecoin:
            return "Litecoin"
        }
    }
}

这是我的看法

struct ContentView: View {
    @State var icon: AppIcon = .default
    var body: some View {
        NavigationView {
            Form {
                Section {
                    Picker(selection: $icon, label: Text("Icon")) {
                        ForEach(AppIcon.allCases) { icon in
                            Text(icon.name).tag(icon)
                        }
                    }
                }
            }
            .navigationBarTitle("Appearance")
        }
    }
}

我想获得这种行为：

但我尝试将.navigationBarTitle("Title") 放在任何右括号之后，但它不起作用。

Answer 1

我已尝试解决问题。

struct ContentView: View {
    
    @State var icon: AppIcon = .default
    
    var body: some View {
        NavigationView {
            Form {
                Section {
                    Picker(selection: $icon, label: Text("Icon")) {
                        ForEach(AppIcon.allCases) { icon in
                            Text(icon.name).tag(icon)
                        }
                        .navigationBarTitle("Title") // for picker navigation title 
                    }
                    .navigationBarTitle("Appearance")
                }
            }
        }
    }
}

Answer 2

诀窍是通过 NavigationLink 创建一个新视图。
所以给我们看代码！！！

这是在 NavigationView 中带有表单的主视图。

struct ContentView: View {

    @ObservedObject private var viewModel: ViewModel

    init() {
        self.viewModel = ViewModel()
    }

    var body: some View {
        NavigationView {
            Form {
                PickerView(viewModel: viewModel)
            }
            .navigationTitle("Appearance")
        }
    }
}

我使用 ViewModel 来保存 View 呈现的数据。我想没有它是可能的。

class ViewModel: ObservableObject {
    @Published var icon: AppIcon = .default
}

在这个结构中定义了实际的选择器。它是用一个列表来模拟的。

struct PickerView: View {

    @ObservedObject private var viewModel: ViewModel
    @State var presentSelectionView = false  // for getting back to main menu

    init(viewModel: ViewModel) {
        self.viewModel = viewModel
    }

    var body: some View {
        NavigationLink(isActive: $presentSelectionView) {
            picker()
                .navigationTitle("Title")
                .navigationBarTitleDisplayMode(.large)
        } label: {
            HStack {
                Text("Icon")
                Spacer()
                Text(viewModel.icon.name)
                    .foregroundColor(Color.gray)
            }
        }
    
    }

    private func picker() -> some View {
        List {
            ForEach(AppIcon.allCases, id: \.self) { icon in
                HStack {
                    Text(icon.name)
                    Spacer()
                    if icon == viewModel.icon  {
                        Image(systemName: "checkmark")
                            .foregroundColor(.accentColor)  // or any other color
                    }
                }
                .contentShape(Rectangle())  // whole line is tappable
                .onTapGesture {
                    self.viewModel.icon = icon
                    self.presentSelectionView = false
                }
            }
        }
        .listStyle(GroupedListStyle())
    }

}

我使用了问题中给出的枚举。

最后是这样的：

我已经使用 XCode 13.1 和 iOS 15.2 完成了这项工作