Biểu tượng thích ứng hay AdaptiveIconDrawable
, có thể hiển thị theo cách khác nhau tuỳ thuộc vào tính năng của từng thiết bị và chủ đề của người dùng. Biểu tượng thích ứng chủ yếu được trình chạy trên màn hình chính sử dụng, nhưng cũng có thể được dùng trong lối tắt, ứng dụng Cài đặt, hộp thoại chia sẻ và màn hình tổng quan. Biểu tượng thích ứng được dùng trên mọi kiểu dáng Android.
Trái ngược với hình ảnh bitmap, biểu tượng thích ứng có thể phù hợp với các trường hợp sử dụng khác nhau:
Nhiều hình dạng: biểu tượng thích ứng có thể hiển thị nhiều hình dạng trên các mẫu thiết bị khác nhau. Ví dụ: ứng dụng này có thể hiển thị hình tròn trên một thiết bị OEM và hiển thị hình vuông (hình vuông giữa hình vuông và hình tròn) trên một thiết bị khác. Mỗi nhà sản xuất thiết bị gốc (OEM) phải cung cấp một mặt nạ mà hệ thống sử dụng để kết xuất tất cả biểu tượng thích ứng có cùng hình dạng.
Hiệu ứng hình ảnh: biểu tượng thích ứng hỗ trợ nhiều hiệu ứng hình ảnh hấp dẫn, xuất hiện khi người dùng đặt hoặc di chuyển biểu tượng xung quanh màn hình chính.
Tuỳ chỉnh giao diện cho người dùng: kể từ Android 13 (API cấp 33), người dùng có thể tuỳ chỉnh giao diện cho các biểu tượng thích ứng. Nếu người dùng bật các biểu tượng ứng dụng theo chủ đề, bằng cách bật nút bật/tắt Biểu tượng theo chủ đề trong phần cài đặt hệ thống và trình chạy hỗ trợ tính năng này, thì hệ thống sẽ sử dụng màu của hình nền và giao diện mà người dùng đã chọn để xác định màu phủ.
Trong các trường hợp sau, màn hình chính sẽ không hiện biểu tượng ứng dụng theo chủ đề mà sẽ hiện biểu tượng ứng dụng tiêu chuẩn hoặc thích ứng:
- Nếu người dùng không bật biểu tượng ứng dụng theo chủ đề.
- Nếu ứng dụng của bạn không cung cấp biểu tượng ứng dụng đơn sắc.
- Nếu trình chạy không hỗ trợ biểu tượng ứng dụng theo chủ đề.
Thiết kế biểu tượng thích ứng
Để đảm bảo biểu tượng thích ứng hỗ trợ nhiều hình dạng, hiệu ứng hình ảnh và giao diện người dùng, thiết kế phải đáp ứng các yêu cầu sau:
Bạn phải cung cấp 2 lớp cho phiên bản màu của biểu tượng: một lớp cho nền trước và một lớp cho nền. Các lớp có thể là vectơ hoặc bitmap, mặc dù vectơ được ưu tiên.
Nếu bạn muốn hỗ trợ người dùng tuỳ chỉnh giao diện cho biểu tượng ứng dụng, hãy cung cấp một lớp duy nhất cho phiên bản biểu tượng đơn sắc.
Định kích thước tất cả các lớp là 108x108 dp.
Sử dụng biểu tượng có cạnh rõ ràng. Các lớp không được có mặt nạ hoặc bóng nền xung quanh đường viền của biểu tượng.
Sử dụng biểu trưng có kích thước tối thiểu là 48x48 dp. Kích thước không được vượt quá 66x66 dp, vì 66x66 dp bên trong của biểu tượng xuất hiện trong khung nhìn bị che khuất.
18 dp bên ngoài ở mỗi bên trong số 4 mặt của các lớp được dành riêng cho việc che giấu và tạo hiệu ứng hình ảnh như thị sai hoặc nhấp nháy.
Để tìm hiểu cách tạo biểu tượng thích ứng bằng Android Studio, hãy xem mẫu Figma biểu tượng ứng dụng Android hoặc tài liệu về Android Studio để tạo biểu tượng trình chạy. Ngoài ra, hãy xem bài đăng trên blog Thiết kế biểu tượng thích ứng.
Thêm biểu tượng thích ứng vào ứng dụng
Các biểu tượng thích ứng (cũng như biểu tượng không thích ứng) được chỉ định bằng thuộc tính android:icon
trong tệp kê khai ứng dụng.
Thuộc tính không bắt buộc, android:roundIcon
, được các trình chạy biểu thị ứng dụng có biểu tượng hình tròn sử dụng. Thuộc tính này có thể hữu ích nếu biểu tượng của ứng dụng là phần cốt lõi trong thiết kế của biểu tượng ứng dụng. Các trình chạy như vậy phải tạo biểu tượng ứng dụng bằng cách áp dụng một mặt nạ hình tròn cho android:roundIcon
. Việc đảm bảo này có thể cho phép bạn tối ưu hoá giao diện của biểu tượng ứng dụng bằng cách phóng to biểu trưng một chút và đảm bảo khi cắt, nền hình tròn sẽ tràn lề.
Đoạn mã sau minh hoạ cả hai thuộc tính này, nhưng hầu hết ứng dụng chỉ chỉ định android:icon
:
<application ... android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher_round" ...> </application>
Tiếp theo, hãy lưu biểu tượng thích ứng vào res/mipmap-anydpi-v26/ic_launcher.xml
. Sử dụng phần tử <adaptive-icon>
để xác định tài nguyên lớp nền trước, nền sau và lớp đơn sắc cho các biểu tượng. Các phần tử <foreground>
, <background>
và <monochrome>
bên trong hỗ trợ cả hình ảnh vectơ và bitmap.
Ví dụ sau đây cho thấy cách xác định các phần tử <foreground>
, <background>
và <monochrome>
bên trong <adaptive-icon>
:
<?xml version="1.0" encoding="utf-8"?> ... <adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android"> <background android:drawable="@drawable/ic_launcher_background" /> <foreground android:drawable="@drawable/ic_launcher_foreground" /> // Starting with Android 13 (API level 33), you can opt-in to providing a // <monochrome> drawable. <monochrome android:drawable="@drawable/ic_launcher_monochrome" /> </adaptive-icon> ...
Bạn cũng có thể xác định các đối tượng có thể vẽ là phần tử bằng cách chèn các đối tượng đó vào các phần tử <foreground>
, <background>
và <monochrome>
. Đoạn mã sau đây cho thấy một ví dụ về cách thực hiện việc này bằng đối tượng có thể vẽ trên nền trước.
<?xml version="1.0" encoding="utf-8"?> ... <foreground> <inset android:insetBottom="18dp" android:insetLeft="18dp" android:insetRight="18dp" android:insetTop="18dp"> <shape android:shape="oval"> <solid android:color="#0000FF" /> </shape> </inset> </foreground> ...
Nếu bạn muốn áp dụng cùng một mặt nạ và hiệu ứng hình ảnh cho lối tắt dưới dạng biểu tượng thích ứng thông thường, hãy dùng một trong các kỹ thuật sau:
- Đối với các lối tắt tĩnh, hãy dùng phần tử
<adaptive-icon>
. - Đối với lối tắt động, hãy gọi phương thức
createWithAdaptiveBitmap()
khi bạn tạo lối tắt.
Để biết thêm thông tin về cách triển khai biểu tượng thích ứng, hãy xem phần Triển khai biểu tượng thích ứng. Để biết thêm thông tin về lối tắt, hãy xem bài viết Tổng quan về lối tắt ứng dụng.
Tài nguyên khác
Hãy xem các tài nguyên sau đây để biết thêm thông tin về cách thiết kế và triển khai biểu tượng thích ứng.
- Mẫu trang cộng đồng trên Fitbit
- Hiểu về các biểu tượng thích ứng dành cho Android
- Thiết kế biểu tượng thích ứng
- Triển khai biểu tượng thích ứng
- Tạo biểu tượng ứng dụng trong Android Studio
- Thông số kỹ thuật thiết kế biểu tượng Google Play