javascript - 如何在 Chrome 扩展程序图标顶部设置文本

Question

我需要在图标顶部设置一个文本，但现在已经下来了。我在 chrome 扩展中使用 setbadgetext 如下

chrome.tabs.executeScript(tabId, {code: chrome.browserAction.setBadgeText ( { text: 'hi' } )}, function() {
});

因此文本 hi 出现在扩展程序图标的右下角。我希望它位于顶部。

请提出建议。欢迎任何 js hack 或 chrome 添加。

Answer 1

您无法调整徽章中文本的位置。

您需要在适当的位置动态绘制一个图标( Canvas )和文本，并动态设置它。

来自chrome.browserAction docs :

ImageDataType

( imagedata ) Pixel data for an image. Must be an ImageData object (for example, from a canvas element).

示例来自 Dynamic Chrome Extension Icons :

var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
// ...draw to the canvas...
var imageData = context.getImageData(0, 0, 19, 19);
chrome.browserAction.setIcon({
  imageData: imageData
});

另请参阅Drawing text using a canvas