iT邦幫忙

2023 iThome 鐵人賽

DAY 26
0
Mobile Development

在 iOS 專案上加上 Unit testing - 因為 You need testing系列 第 26

D26 - 在 iOS 專案加上測試-You need testing {測試 SwiftUI 的 View 的 State Value}

  • 分享至 

  • xImage
  •  

在 SwiftUI 的框架下,建議使用 Apple 文件上寫的資料流。Action → State → View。讓資料的流動為單一方向,並讓 SwiftUI 替你進行 Binding 後的 UI 渲染工作。資料的流動可以參考下圖。

https://ithelp.ithome.com.tw/upload/images/20231007/20140622pQPcYRTkDR.png

我們先來製作一個會隨著有沒有文字的輸入,會讓 Text 變化的簡單 View,程式碼如下。

//
//  MemoInputView.swift
//  TwStockTools
//
//  Created by cm0679 on 2023/10/4.
//

import SwiftUI

struct MemoInputView: View {
    
    @State var inputedText: String = ""
    
    var displayText: String {
        if inputedText.isEmpty {
            return "請輸入文字"
        } else {
            return "你輸入的是: \(inputedText)"
        }
    }
    
    var body: some View {
        
        VStack {
            Text(displayText)
            TextField("請輸入交易心得", text: $inputedText)
        }
        .padding()
    }
}

struct MemoInputView_Previews: PreviewProvider {
    static var previews: some View {
        MemoInputView()
    }
}

完成後,你可以看到如果沒有文字,會在上面的文字出現「請輸入文字」

https://ithelp.ithome.com.tw/upload/images/20231007/20140622uwwwrlAjjj.png

如果有 input,字的前面還可以加上一些變化。

https://ithelp.ithome.com.tw/upload/images/20231007/201406228jhq5GvQ3Y.png


上一篇
D25 - 在 iOS 專案加上測試-You need testing {測試 SwiftUI 的 View}
下一篇
D27 - 在 iOS 專案加上測試-You need testing {測試 SwiftUI 的 View 的 State Value .pt2}
系列文
在 iOS 專案上加上 Unit testing - 因為 You need testing32
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言