面试题：Swift中SwiftUI自定义键盘基础实现

Question

在SwiftUI中，如何创建一个简单的自定义键盘视图，该键盘至少包含数字0 - 9的按钮，并且当按钮被点击时，能够将对应的数字显示在一个文本视图中？请描述主要步骤并给出关键代码片段。

Answer 1

1. 创建自定义键盘视图：
   • 首先，在SwiftUI中创建一个新的视图，用来表示键盘。这个视图可以是一个VStack或HStack的组合，以排列数字按钮。
   • 为每个数字按钮创建Button视图，并添加点击动作。
2. 创建文本视图以显示数字：
   • 创建一个Text视图，用于显示点击按钮后的数字。需要使用@State来跟踪文本内容的变化。
3. 关键代码片段：

import SwiftUI

struct CustomKeyboardView: View {
    @State private var displayText = ""
    
    var body: some View {
        VStack {
            Text(displayText)
               .font(.system(size: 30))
               .padding()
            
            // 创建键盘按钮
            let numbers = Array(0...9)
            ForEach(numbers, id: \.self) { number in
                Button(action: {
                    self.displayText.append("\(number)")
                }) {
                    Text("\(number)")
                       .frame(width: 60, height: 60)
                       .background(Color.blue)
                       .foregroundColor(.white)
                       .cornerRadius(10)
                }
            }
        }
    }
}

你可以在ContentView中使用这个CustomKeyboardView：

struct ContentView: View {
    var body: some View {
        CustomKeyboardView()
    }
}