Chrome扩展:通过编程设置浏览器操作图标，使图标像素化

Chrome Extension: Programmatically setting browser action icon causes the icon to pixelate

本文关键字：图标 操作 像素 浏览器 设置 扩展 编程 Chrome      更新时间：2023-09-26

我试图使用以下代码更改background.js中的浏览器操作图标

chrome.browserAction.setIcon({path: "img/logo-off.png", tabId:tab.id});

然而，这导致图标像素化非常糟糕（flappy bird风格）。

有人遇到过同样的问题吗？我应该如何解决它。

我终于在高DPI的Windows屏幕上使用了Chrome 38，它显示了同样的行为。

对于高DPI屏幕，您需要提供更高分辨率的图标，并更新提供替代方案的图标：

chrome.browserAction.setIcon({
  path: {
    19: "img/logo-off.png",
    38: "img/logo-off-hidpi.png"
  },
  tabId: tab.id
});

Chrome将根据屏幕DPI选择合适的图像。它目前仅支持19x19和38x38比例。

编辑（2016年6月）：

Chrome似乎正朝着工具栏的材料设计方向发展，这将浏览器图标要求更改为16x16（对于HiDPI为32x32）。建议也提供这些，以便为切换做好准备（无论是否有意，Linux中已经发生了这种情况）。

相关文章：