Bố cục tiện ích chuẩn

Trước tiên, hãy xác định nội dung cốt lõi để tạo bố cục tiện ích hiệu quả. Bố cục của bạn sẽ quyết định cách sắp xếp thông tin và các phần tử tương tác trong tiện ích. Android cung cấp một số bố cục dựng sẵn cho thanh công cụ, văn bản, danh sách và tiện ích dạng lưới để đơn giản hoá quy trình này.

Văn bản

Bố cục văn bản là lựa chọn lý tưởng để hiển thị thông tin ngắn gọn. Bạn có thể cải thiện tính hấp dẫn về mặt hình ảnh của tiện ích bằng cách tuỳ ý thêm hình ảnh bên cạnh văn bản.

Chỉ có văn bản

Lý tưởng cho tiêu đề, thông tin cập nhật trạng thái, nội dung mô tả ngắn hoặc mọi trường hợp mà một dòng văn bản có thể truyền tải thông điệp một cách hiệu quả.

Văn bản và hình ảnh

Thêm hình ảnh để tăng tác động về mặt hình ảnh. Để biết thêm thông tin, hãy xem Điểm ngắt để tìm hiểu cách điều chỉnh bố cục này cho nhiều kích thước màn hình.

Thanh công cụ

Sử dụng bố cục thanh công cụ để giúp người dùng truy cập nhanh vào các tác vụ thường dùng trong ứng dụng của bạn, trong một bố cục linh hoạt có thể điều chỉnh theo kích thước tiện ích.

Thanh công cụ tìm kiếm

Bố cục thanh công cụ tìm kiếm được thiết kế có chủ đích để tập trung vào tính năng tìm kiếm như một hành động chính trong thanh công cụ. Các nút tiện dụng khác có thể giúp truy cập nhanh vào các chức năng thường dùng.

Thanh công cụ

Thanh công cụ trình bày thương hiệu của ứng dụng, sau đó là các nút cho các tác vụ được dùng nhiều nhất lý tưởng cho các chế độ cài đặt có thể bật/tắt hoặc đường liên kết đến tác vụ. Khi đổi kích thước, các tuỳ chọn ít dùng hơn có thể bị ẩn để nhường chỗ cho các hành động thường dùng hơn. Sử dụng Điểm ngắt để thêm một nút mới có thể nhấn tối thiểu 48dp khi có chỗ.

Danh sách

Sử dụng bố cục danh sách để sắp xếp nhiều mục ở định dạng rõ ràng, có thể quét. Đây là lựa chọn lý tưởng cho tiêu đề tin tức, danh sách việc cần làm hoặc tin nhắn. Sắp xếp nội dung thành một danh sách có cấu trúc, có thể quét. Chọn giữa bản trình bày có hoặc không có vùng chứa dựa trên nhu cầu về nội dung của bạn.

Danh sách văn bản và hình ảnh

Danh sách văn bản và hình ảnh có thể quét là lựa chọn hoàn hảo để giới thiệu nhiều loại nội dung, chẳng hạn như tiêu đề tin tức, danh sách phát có ảnh bìa đĩa nhạc hoặc tin nhắn.

Danh sách kiểm tra

Bố cục danh sách kiểm tra là lựa chọn hoàn hảo để hiển thị các tác vụ, cung cấp mục tiêu nhấn rõ ràng để người dùng nhanh chóng đánh dấu các mục là đã hoàn tất.

Danh sách hành động

Cung cấp tính năng nhóm điều khiển trực quan bằng danh sách hành động, trong đó trạng thái bật/tắt trực quan cung cấp ý kiến phản hồi ngay lập tức về trạng thái của mục.

Lưới

Trình bày hình ảnh trong một lưới nhỏ gọn, linh hoạt, phong phú về mặt hình ảnh với nhãn không bắt buộc. Sử dụng các cột và hàng có thể điều chỉnh theo nhiều kích thước màn hình.

Chỉ có hình ảnh

Tạo thư viện hình ảnh có thể cuộn, có tác động về mặt hình ảnh bằng cách sử dụng lưới chỉ có hình ảnh. Các hàng và cột sẽ tự động điều chỉnh theo nhiều kích thước màn hình để có bản trình bày tối ưu.

Hình ảnh và văn bản

Bạn cũng có thể kết hợp nhãn và nội dung mô tả bằng văn bản, làm phong phú nội dung lưới hình ảnh bằng thông tin và bối cảnh bổ sung.

Mã mẫu

Bảng sau đây ánh xạ từng bố cục chuẩn với phương thức triển khai Jetpack Glance tương ứng trong kho lưu trữ GitHub Mẫu nền tảng Android.

Bố cục chuẩn Danh mục bố cục Tệp triển khai mẫu
Chỉ có văn bản Văn bản LongTextAppWidget.kt
Văn bản và hình ảnh Văn bản TextWithImageAppWidget.kt
Thanh công cụ tìm kiếm Thanh công cụ SearchToolBarAppWidget.kt
Thanh công cụ (Chuẩn) Thanh công cụ ToolBarAppWidget.kt
Danh sách văn bản và hình ảnh Danh sách ImageTextListAppWidget.kt
Danh sách kiểm tra Danh sách CheckListAppWidget.kt
Danh sách hành động Danh sách ActionListAppWidget.kt
Chỉ có hình ảnh Lưới ImageGridAppWidget.kt
Hình ảnh và văn bản Lưới ImageGridAppWidget.kt