#74 簡易計算機 App ：Swift Function Type 與 Stack View 實作。

Published in

彼得潘的 Swift iOS / Flutter App 開發教室

6 min readMay 23, 2024

在這個筆記中，練習使用 Swift 中的 function 函數型別來實作一個簡單的計算機 App，並使用 UIKit 中的 Stack View 來進行按鍵的排版。這個練習有助於理解函數型別的靈活性，也再利用 Stack View 來構建整潔且可擴展的 UI，熟悉 Stack View 易於管理和自適應的特性。

操作影片:

螢幕截圖：

練習目標

運用及理解 function 函數型別：

使用 function 函數型別來定義基本的加、減、乘、除運算。
瞭解如何將函數作為變數存儲和傳遞。

2. 使用 Stack View 排版：

利用 Stack View 簡化按鍵的排列和布局，使介面更具自適應性和易維護性。
透過 Stack View 來管理不同尺寸和方向的螢幕佈局。

實作過程

設計 UI：在 Storyboard 中，使用 Stack View 來排列計算機按鍵，包括數字、運算符、小數點和清零按鍵。
定義 function 函數型別：在 ViewController 中，定義並使用 function 函數型別來處理計算邏輯。
實作按鍵功能：連接按鍵和相應的 IBAction 方法，實作各種按鍵的功能，包括數字輸入、運算的類型和結果顯示。
處理小數和符號：確保計算機可以處理小數點輸入和正負號切換。

UI設計

模仿 MAC 的計算機介面

使用 stack view 來排版，一個直向 Stack View ，裡面有5排橫向的 Stack View.

數字 0–9 和小數點指定同一個 function：numberTapped . 會把數字顯示在上方的 label。這裡會需要做一些控制，像是點了小數點後，之後再點小數點就不理他，還有如果點了加減乘除後, 再按數字要清除之前的數字。

加減乘除指定同一個 function：operationTapped,

程式摘要

定義 Function Type 變數

重點：private var currentOperation: ((Double, Double) -> Double)?

定義 currentOperation 變數，用來記錄當前所選擇的運算符，它的型別是一個可選的函數型別，可以存儲一個函數，也可以是 nil。這樣的設計方便了我們在計算結果時確定應該執行哪種運算。因為要處理小數點，所以變數型態都使用Double。

private var currentOperation: ((Double, Double) -> Double)?

定義可選的函數型別，有4個運算函數：add(a:b:)、subtract(a:b:)、multiply(a:b:)、divide(a:b:)：定義基本的加減乘除運算。

private func add(a: Double, b: Double) -> Double { a + b }
private func subtract(a: Double, b: Double) -> Double { a - b }
private func multiply(a: Double, b: Double) -> Double { a * b }
private func divide(a: Double, b: Double) -> Double { a / b }

Function Type 指定

重點：currentOperation = add

當使用者點了加減乘除後，會執行 operationTapped ，就把目前的操作函數指定到 currentOperation 函數型別變數。例如點了 “+” 那 currentOperation = add。

@IBAction func operationTapped(_ sender: UIButton) {
        guard let operationText = sender.titleLabel?.text,
              let currentText = displayLabel.text,
              let currentNumber = Double(currentText) else { return }
        
        previousNumber = currentNumber
        
        switch operationText {
        case "+": currentOperation = add
        case "-": currentOperation = subtract
        case "*": currentOperation = multiply
        case "/": currentOperation = divide
        default:
            break
        }
    }

執行 Function Type 所指定的程式

重點： let result = operation(previousNumber, currentNumber)

當按下 “＝” 等於鍵時的程式

@IBAction func equalTapped(_ sender: UIButton) {
        guard let operation = currentOperation,
              let previousNumber = previousNumber,
              let currentText = displayLabel.text,
              let currentNumber = Int(currentText) else { return }
        
        let result = operation(previousNumber, currentNumber)
        displayLabel.text = "\(result)"
        self.currentOperation = nil
        self.previousNumber = nil
    }

如果使用者是點”加 ” 的話，那 operation(previousNumber, currentNumber) 就等於 add(previousNumber, currentNumber)

這樣就完成大部份的功能了，function type 真的蠻好用的唷。