为什么这个chrome.browserAction.setIcon方法不起作用



我正在查看文档页面,但我不知道我的代码中出了什么问题:

chrome.browserAction.setIcon({
details.imageData = {
"48": "Icons/iconfavorite48x.png",
"64": "Icons/iconfavorite64x.png",
"128": "Icons/iconfavorite128x.png"
}
});

文件上写着:

请注意,'details.imageData=foo'等效于"details.imageData={19":foo}">

所以我非常困惑

您的代码基本上是一个很大的语法错误。JavaScript对象文字应该是成对key: value的列表。你不能(也不需要)key部分的任何作业。

因此,只修复语法错误,它将是:

// Still wrong:
chrome.browserAction.setIcon({
imageData : {
"48": "Icons/iconfavorite48x.png",
"64": "Icons/iconfavorite64x.png",
"128": "Icons/iconfavorite128x.png"
}
});

这将失败。imageData期望例如从<canvas>获得的像素数据的二进制斑点。如果要提供路径,则需要使用path属性:

// Still wrong:
chrome.browserAction.setIcon({
path : {
"48": "Icons/iconfavorite48x.png",
"64": "Icons/iconfavorite64x.png",
"128": "Icons/iconfavorite128x.png"
}
});

请注意,您只能提供所需的尺寸。如果你包括其他任何一个,它都会失败。引用文档:

如果适合一个屏幕空间单位的图像像素数等于比例,则将选择尺寸比例为*19的图像。最初只支持比例1和2。

正常大小的图标为19x19像素;在高DPI屏幕上,Chrome可能会显示一个38x38的图标。

更新:由于Chrome在53年切换到了材料设计,现在预计分别为16x16和32x32。您可以提供旧尺寸和新尺寸,不会出错

所以你可以这样做:

// Correct
chrome.browserAction.setIcon({
path : {
"19": "Icons/iconfavorite19x.png",
"38": "Icons/iconfavorite38x.png"
}
});
// Also correct
chrome.browserAction.setIcon({
path : {
"19": "Icons/iconfavorite19x.png"
}
});
// Also correct
chrome.browserAction.setIcon({
path : "Icons/iconfavorite19x.png"
});

图像没有来具有这些尺寸,如果需要,它们将被缩放;但确切地说当然更好。

对于清单版本3,必须使用chrome.action.setIcon而不是chrome.browserAction.setIcon

例如,单独文件夹中的灰色图像:

chrome.action.setIcon({
path: {
"16": "/icons/gray/icon16.png",
"19": "/icons/gray/icon19.png",
"32": "/icons/gray/icon32.png",
"48": "/icons/gray/icon48.png",
"128": "/icons/gray/icon128.png"
}
});

或者,如果不是问题的一部分,可以通过setBadgeText:解决

state是我自己的变量

chrome.action.setBadgeText({
text: (state ? 'off' : '')
});
chrome.action.setBadgeBackgroundColor({
color: '#2f2f2f'
});

在Chrome V3 中使用此功能

chrome.action.setIcon({ path: "media/background1.png" });

在v3中使用这个:在manifest中使用"icons"记住图标对象有键值对,其中键定义图标的大小,值是图标的路径。

chrome.action.setIcon({
path : {
"19": "images/icon-19.png"
}
});

最新更新