Menu
CoddyTech

Trường văn bản

Thuộc phần Giới thiệu về SwiftUI trong hành trình Swift của Coddy. Bài học 24 trên 50.

TextField cho phép người dùng nhập. Nó cần một văn bản gợi ý và một liên kết (binding) với trạng thái String:

@State private var name = ""

var body: some View {
    VStack {
        TextField("Your name", text: $name)
        Text("Hello, \(name)!")
    }
}

$ trong $name biến state thành một binding: một kết nối hai chiều. Trường này hiển thị giá trị của name, và mỗi phím người dùng nhập sẽ ghi giá trị trở lại đó. Phần văn bản bên dưới đọc cùng state đó, nên sẽ cập nhật sau mỗi lần nhấn phím.

.textFieldStyle(.roundedBorder) vẽ khung bo tròn quen thuộc quanh trường.

challenge icon

Thử thách

Dễ

Chào người dùng bằng tên. Thêm một TextField có văn bản giữ chỗ Your name được liên kết với name, rồi đặt mã định danh cho trường này là name. Giữ nguyên nội dung lời chào, nội dung này sẽ hiển thị là Hello, Ada! sau khi người dùng nhập Ada.

Tự làm thử

import SwiftUI

@main
struct CoddyApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}
quiz iconTự kiểm tra

Bài học này có một bài trắc nghiệm ngắn. Bắt đầu bài học để trả lời và theo dõi tiến độ.

Tất cả bài học trong Giới thiệu về SwiftUI

Tự luyện tập: Playground SwiftUI