SwiftUI货币转换器示例
我们的下一个SwiftUI示例是货币转换赢博体育程序。这是我们的第一个有两个视图的赢博体育程序，所以我们将看到在赢博体育程序中的视图之间导航所需的机制。第一个视图显示货币转换计算器：
第二个视图显示供用户选择的货币列表。
显示货币列表
SwiftUI的一般规则是，我们为赢博体育程序中的每个视图创建一个单独的View结构体，并将每个视图的代码放在自己单独的源代码文件中。下面是CurrencyList.swift文件中的代码：
导入SwiftUI struct CurrencyList: View {var currencies: [String] @Binding var selected: String var body: some View {List {ForEach(currencies,id: \.self) {currency in Text（currency）。onTapGesture {self。select = currency}. listrowbackground (self。选定==货币？颜色。accentColor: Color(uiccolor . systemgroupedbackground))}}}}
由于我们将显示货币字符串列表，因此我们需要一个currency属性来存储该字符串列表。这里我们还需要第二个属性来存储用户从列表中选择的货币。这个属性使用@Binding属性修饰符来表明这个属性实际上是对我们将从其他地方获得的属性的引用。具体来说，当我们导航到第二个视图时，这将是对来自第一个视图的属性的引用。
要在SwiftUI中实现列表视图，我们使用list（）组件。我们传递给组件初始化器的闭包使用SwiftUI ForEach（）构造来指定如何在列表视图中为列表所基于的数据列表的每个元素创建一个单元格。ForEach初始化器的第一个参数是我们想要迭代的数据项列表：在本例中是货币字符串列表。ForEach使用的末尾闭包是一个闭包，它将特定项的数据作为参数，并从中构造一个视图。在本例中，我们创建一个显示货币字符串的文本标签。我们还为标签配备了一个onTapGesture（）事件处理程序，当用户点击标签时，它会设置当前选择的货币。
导航控制器和第一个视图
下面是赢博体育程序第一个视图的代码，它实现了计算器：
struct ContentView: View {@FocusState private var amountIsFocused: Bool @State var current: String @State private var amount: String = "0.00" @State private var convertedAmount: String = "0.00" let rates = ["EUR":0.9829,"GBP":0.8397,"JPY":135.72,"CAD":1.3049] var keys: Array<String> {return Array(rate .keys)} func convert() -> String {let dollars: Double = Double(amount) ?？0.0让amt =美元*(汇率[当前]?？0.0)返回String(format: "%.2f",amt)} var body：一些观点{NavigationStack {VStack {HStack {TextField(“”,文本:金额美元).keyboardType (.decimalPad) .textFieldStyle (.roundedBorder) .focused (amountIsFocused美元)文本(“美元”)}.padding()按钮(“转换”){convertedAmount =()转换amountIsFocused = false} .buttonStyle (.bordered) .padding()文本(“\ (convertedAmount) \(当前)”).padding ()} .onAppear () {convertedAmount =转换()}.navigationTitle(“旅游钱”).navigationBarTitleDisplayMode .inline .navigationBarItems(落后:NavigationLink("Currency") {CurrencyList(Currency:keys,selected:$current)})}}
这个例子中最重要的新想法是在同一个赢博体育中使用导航来显示多个视图。为了实现屏幕之间的导航，我们将使用一个NavigationStack组件。我们在这里构造的视图是一个NavigationStack，它包含赢博体育程序的第一个视图作为它的唯一内容。第一个视图以通常的方式作为VStack实现。
注意，我们必须对视图赢博体育一系列修饰符来设置它的赢博体育特性，包括导航栏的详细信息。这里最重要的修饰符是navigationBarItems()，它是我们设置NavigationLink的地方，它实现了到第二个视图的导航。NavigationLinks实际上可以出现在视图中的任何位置，并且非常像网页中的链接。NavigationLink最重要的方面是它的目的地，它是一个视图，将在用户单击导航链接时构造并显示。在本例中，我们希望导航到显示货币列表的视图，因此我们将目标设置为新的CurrencyList视图。请注意，CurrencyList初始化器的第二个参数是对我们自己的current属性的引用，该属性存储了我们当前使用的货币的货币代码。当第二个视图更改该值时，它将自动更新我们的属性，因为第二个视图将使用对我们属性的引用。
我们在本例中看到的另一种新类型的事件处理程序是使用附加在VStack上的onAppear（）修饰符，它充当第一个屏幕的主容器。这个事件处理程序将在第一个屏幕重新出现时被调用。当我们从第二个视图导航回第一个视图时，我传递给该事件处理程序的闭包会重新计算转换后的数量。这是必要的，因为用户可能在第二个屏幕中选择了一种新的货币，这反过来将迫使我们在导航回第一个屏幕时重新计算转换后的货币数量。
另一种消除键盘的方法
在前面的例子中，我展示了一种在不再需要软件键盘时使其消失的策略。这个例子演示了做同样事情的另一种策略。该策略基于特殊状态变量amountIsFocused布尔值的使用。我们对这个状态变量做的第一件事是通过TextField的focused（）修饰符将对它的引用传递给TextField。当用户单击文本字段时，该字段将接收焦点，状态变量将被设置为true。
在下面的代码中，我附加了一个闭包到“转换”按钮。闭包所做的一件事是将amountIsFocused状态变量重置回false，这反过来会导致文本字段失去焦点。这将导致与文本字段关联的键盘消失。