Thành phần kết hợp Icon
là cách thuận tiện để vẽ một biểu tượng một màu duy nhất trên màn hình theo nguyên tắc của Material Design. Để sử dụng Icon
, hãy thêm thư viện Compose Material (hoặc thư viện Compose Material 3).
Ví dụ: nếu muốn tải một vectơ vẽ được lên bằng các giá trị mặc định của Material, bạn có thể dùng thành phần kết hợp Icon
như sau:
Icon( painter = painterResource(R.drawable.baseline_directions_bus_24), contentDescription = stringResource(id = R.string.bus_content_description) )
Theo mặc định, thành phần kết hợp Icon
được phủ màu LocalContentColor.current
và có kích thước 24.dp
. Thành phần này cũng hiển thị tham số màu tint
(tận dụng cơ chế phủ màu tương tự như mô tả trong phần Phủ màu hình ảnh).
Thành phần kết hợp Icon
là để dùng cho các phần tử biểu tượng nhỏ. Bạn nên sử dụng thành phần kết hợp Image
để có thêm lựa chọn tuỳ chỉnh.
Thư viện Biểu tượng Material cũng bao gồm một tập hợp Icons
được xác định trước. Có thể dùng tập hợp này trong Compose mà không cần nhập SVG (Đồ hoạ vectơ có thể mở rộng) theo cách thủ công. Cách vẽ phiên bản hình tròn của biểu tượng giỏ hàng như sau:
Icon( Icons.Rounded.ShoppingCart, contentDescription = stringResource(id = R.string.shopping_cart_content_desc) )
![Vectơ giỏ hàng có biểu tượng](https://developer.android.google.cn/static/develop/ui/compose/images/graphics-shopping.png?authuser=19&hl=vi)
Lưu ý rằng về bản chất, bạn không bắt buộc phải dùng Icon
để hiển thị VectorDrawable
trên màn hình. Icon
sử dụng Modifier.paint(painterResource(R.drawable.ic_bus_stop)
) để vẽ Icon
trên màn hình. Để biết thêm thông tin về tất cả các biểu tượng có sẵn, hãy xem tài liệu về Biểu tượng.
Đề xuất cho bạn
- Lưu ý: văn bản có đường liên kết sẽ hiện khi JavaScript tắt
- Tài nguyên trong Compose
- Hỗ trợ tiếp cận trong Compose
- Hình ảnh xuất hiện khi đang tải {:#loading-images}