iT邦幫忙

2021 iThome 鐵人賽

DAY 22
0
Mobile Development

程式初學就來點swift吧!教你掌握整個蘋果生態圈!系列 第 22

Day 22 - SwiftUI開發實作1 (簡易計算機)

首先我們創建一個新專案

在這裡我們創建一個新專案,並且命名為計算機。

然後選擇swiftui,如果跳出沒有作者資訊,那可以先略過。

創建4個頁面

這邊我們創建4個頁面,分別作為加、減、乘、除。

這邊我不建議你使用中文命名,因為出現各種異常都有可能。

設計

主頁

一樣我們創建一組NavigationView。

接著使用NavigationLink去指向到plus頁面。

頁面

接著我們到plus頁面做。我們先設定號兩個變數,為加數、被加數。

接著就直接上code吧!

struct plus: View {
    @State private var p1 = ""
    @State private var p2 = ""
    @State private var sums = 0
    @State private var title: String = "0"
    var body: some View {
        VStack{
        HStack{
            TextField("p1", text: $p1)
        Text("+")
            TextField("p2", text: $p2)
            Button(action: {self.title = ac(n1: p1, n2: p2)}) {
                Text("combine")
            }
        }
            Text(self.title)
                .font(.title)
        }
    }
    func ac(n1: String , n2 : String ) -> String {
        sums = (Int(n1) ?? 0) + (Int(n2) ?? 0)
        return String(sums)
    }

}

這邊我們解釋一下。

我們先寫兩個輸入框(p1、p2),接著我們在設定一個button,button直接呼叫func ac。

進到ac裡之後先將String轉為Int(swift 變數轉型後會是 Optional 的型態,所以我們要寫 ?? 0),接著我們加起來回傳,回傳之前轉回String。

我們把title綁定之後,他就會自動更新,所以就寫self.title就好。

這邊要特別注意,如果你直接用xcode拉出button的話,button的action預設沒有括弧,我們這邊要把它改成大括弧喔,不然會出現報錯的情形。

接著我們有一樣的道理去做其餘的程式。

接著我們將主頁添加目的地到減、乘、除上面。

這樣這個程式就寫好了喔!


上一篇
Day 21 - SwiftUI開發學習5(文字填入)
下一篇
Day 23 - SwiftUI開發實作2 (多愛女朋友測試APP、Alert用法、傳遞變數)
系列文
程式初學就來點swift吧!教你掌握整個蘋果生態圈!30

尚未有邦友留言

立即登入留言