Chrome扩展程序:以编程方式设置浏览器操作图标会使图标像素化

Question

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

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

然而,这导致图标像素化非常糟糕(flappy bird style).

有没有人有同样的问题？我应该如何解决它.

Answer 1

我终于在高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似乎正在向其工具栏的Material Design转移,并将浏览器图标要求更改为16x16(HiDPI为32x32).建议为这些交换机做好准备(这已经在Linux中发生,有意或无意).