Biểu tượng có thể che là một định dạng biểu tượng mới giúp đảm bảo biểu tượng PWA của bạn trông đẹp trên tất cả thiết bị Android. Trên các thiết bị Android mới hơn, các biểu tượng PWA không tuân theo định dạng biểu tượng có thể che sẽ có nền trắng. Khi bạn sử dụng biểu tượng có thể che, biểu tượng đó sẽ đảm bảo chiếm toàn bộ không gian mà Android cung cấp cho biểu tượng đó.
Trường hợp kiểm tra biểu tượng có thể che của Lighthouse không thành công
Lighthouse sẽ gắn cờ các trang không hỗ trợ biểu tượng có thể che mờ:
Để vượt qua quy trình kiểm tra, hãy làm như sau:
Phải có tệp kê khai ứng dụng web.
Tệp kê khai ứng dụng web phải có một mảng icons.
Mảng icons phải chứa một đối tượng có thuộc tính purpose và giá trị của thuộc tính purpose đó phải bao gồm maskable.
Cách thêm tính năng hỗ trợ biểu tượng có thể che vào PWA
Sử dụng Maskable.app Editor để chuyển đổi một biểu tượng hiện có thành biểu tượng có thể che.
Thêm thuộc tính purpose vào một trong các đối tượng icons trong tệp kê khai ứng dụng web.
Đặt giá trị của purpose thành maskable. Xem phần Giá trị.
[[["Dễ hiểu","easyToUnderstand","thumb-up"],["Giúp tôi giải quyết được vấn đề","solvedMyProblem","thumb-up"],["Khác","otherUp","thumb-up"]],[["Thiếu thông tin tôi cần","missingTheInformationINeed","thumb-down"],["Quá phức tạp/quá nhiều bước","tooComplicatedTooManySteps","thumb-down"],["Đã lỗi thời","outOfDate","thumb-down"],["Vấn đề về bản dịch","translationIssue","thumb-down"],["Vấn đề về mẫu/mã","samplesCodeIssue","thumb-down"],["Khác","otherDown","thumb-down"]],["Cập nhật lần gần đây nhất: 2024-04-16 UTC."],[],[]]