Tạo kiểu cho các phần văn bản

Bạn có thể tạo kiểu cho các phần văn bản để cải thiện khả năng đọc, tăng trải nghiệm tích cực cho người dùng và khuyến khích sự sáng tạo hơn thông qua việc sử dụng màu sắc và phông chữ.

Kết quả

Văn bản Hello World có nhiều kiểu
Hình 1. Một dòng văn bản có nhiều kiểu chữ.

Khả năng tương thích giữa các phiên bản

Việc triển khai này yêu cầu bạn đặt minSDK của dự án thành cấp độ API 21 trở lên.

Phần phụ thuộc

Tạo kiểu cho các phần của văn bản

Đoạn mã sau đây hiển thị chuỗi "Hello World" bằng màu xanh dương cho chữ "H", màu đỏ cho chữ "W" và màu đen cho phần còn lại của văn bản. Để đặt các kiểu khác nhau trong một thành phần kết hợp Text duy nhất, hãy sử dụng đoạn mã sau:

@Composable
fun MultipleStylesInText() {
    Text(
        buildAnnotatedString {
            withStyle(style = SpanStyle(color = Color.Blue)) {
                append("H")
            }
            append("ello ")

            withStyle(style = SpanStyle(fontWeight = FontWeight.Bold, color = Color.Red)) {
                append("W")
            }
            append("orld")
        }
    )
}
TextSnippets.kt

Các điểm chính về mã

  • Sử dụng buildAnnotatedString trả về một chuỗi AnnotatedString để đặt nhiều kiểu trong văn bản.
  • Tạo kiểu cho một phần văn bản bằng SpanStyle, một cấu hình cho phép tạo kiểu ở cấp ký tự.

Bộ sưu tập chứa hướng dẫn này

Hướng dẫn này là một phần của bộ sưu tập Hướng dẫn nhanh được tuyển chọn, bao gồm các mục tiêu phát triển Android rộng hơn:

Văn bản hiển thị

Văn bản là phần chính của mọi giao diện người dùng. Tìm hiểu các cách trình bày văn bản trong ứng dụng để mang lại trải nghiệm thú vị cho người dùng.
Tuyển tập hướng dẫn nhanh

Bạn có câu hỏi hoặc ý kiến phản hồi

Truy cập vào trang câu hỏi thường gặp của chúng tôi để tìm hiểu về các hướng dẫn nhanh hoặc liên hệ với chúng tôi để chia sẻ ý kiến của bạn.
Chuyển đến phần Câu hỏi thường gặp Gửi ý kiến phản hồi