Danh sách là cách trình bày trực quan một hoặc nhiều mục có liên quan. Chúng thường được dùng để hiển thị một tập hợp các tuỳ chọn.
Tài nguyên
Loại | Đường liên kết | Trạng thái |
---|---|---|
Thiết kế | Nguồn thiết kế (Figma) | Có |
Triển khai | Jetpack Compose | Sắp ra mắt |
Tiêu điểm
- Danh sách là một tập hợp liên tục các văn bản hoặc hình ảnh.
- Danh sách phải tự nhiên và dễ đọc được.
- Danh sách bao gồm các mục chứa các thao tác chính và bổ sung được biểu thị bằng các biểu tượng và văn bản.
Biến thể
Có ba loại danh sách: danh sách một dòng, danh sách hai dòng và danh sách ba dòng.
- Danh sách một dòng: Một dòng duy nhất để giao tiếp từng mục. Kiểu thiết kế đơn giản này đảm bảo các mục đều khác biệt rõ ràng với các mục khác.
- Danh sách hai dòng: Sử dụng hai đường thẳng song song để giao tiếp từng mục. Thiết kế có cấu trúc này đảm bảo khả năng đọc tự nhiên và tránh tình trạng quá tải nhận thức.
- Danh sách ba dòng: Sử dụng ba đường song song để biểu thị từng mục. Thiết kế trang trí này tạo ra mức độ nổi bật trực quan cao.
Phân tích
- Biểu tượng: Một hình ảnh nhỏ đại diện cho một đối tượng hoặc hành động cụ thể, thường dùng để truyền đạt ý tưởng hoặc khái niệm một cách trực quan.
- Dòng chữ gạch đầu: Một dòng văn bản ngắn xuất hiện phía trên tiêu đề hoặc tiêu đề phụ, thường dùng để cung cấp thêm ngữ cảnh hoặc điểm nhấn.
- Tiêu đề: Một dòng văn bản lớn, in đậm đóng vai trò là tiêu đề chính của trang hoặc phần tử thiết kế.
- Tiêu đề phụ: Dòng văn bản nhỏ hơn, cung cấp thêm thông tin hoặc ngữ cảnh bên dưới tiêu đề chính.
- Control: Một thành phần tương tác cho phép người dùng nhập quyết định.
Các trạng thái
Thông số kỹ thuật
Cách sử dụng
Danh sách là các nhóm văn bản và hình ảnh được sắp xếp theo chiều dọc. Được tối ưu hoá để đọc hiểu nội dung, danh sách sẽ bao gồm một cột liên tục gồm các mục. Các mục trong danh sách có thể chứa các thao tác chính và bổ sung được biểu thị bằng biểu tượng và văn bản.
Bộ điều khiển lựa chọn
Kiểm soát thông tin hiển thị và thao tác cho các mục trong danh sách. Các thành phần này có thể được căn chỉnh theo cạnh trên cùng hoặc cạnh cuối của mục danh sách.
- Hộp đánh dấu: Chọn một hoặc nhiều mục trong danh sách.
- Nút chọn: Chọn đúng một mục trong danh sách.
- Nút chuyển: Bật hoặc tắt một nút điều khiển.
Biểu tượng
Hình đại diện và hình ảnh
Các mục trong danh sách có thể bao gồm hình ảnh trong một đường cắt hình tròn để đại diện cho một người hoặc thực thể.