更改瀏覽器擴展程序圖標

Question

，所以我知道如何更改圖標了與擴展

chrome.browserAction.setIcon({ 
    path : "green.png" 
}); 

但我怎麼會讓它所以我不會改變圖標，而是我加入一個小圖像中瀏覽器圖標？我真的不知道該怎麼稱呼它......它與擴展名爲「AdBlock」的擴展名類似，它的圖標是圖標左下方的一個數字，告訴您有多少廣告被阻止。

對於我的擴展，我試圖通過在擴展的瀏覽器圖標上顯示綠色/黃色/紅色正方形來顯示擴展的「狀態」。

我該如何做到這一點，比如說，在圖標左下方彈出一個綠色正方形，類似於被阻止的廣告數量？現在，我有3個不同的圖像，我將圖標更改爲相應的圖像，但我覺得有一個更直觀的方法來做到這一點。

編輯：

所以我想出了這個代碼，但徽章的顏色一直顯示爲紅色，無論什麼我做 -

chrome.browserAction.setBadgeText({ text: " " }); 

function setIconStatus(status){ 
    if (status == 1){ 
     chrome.browserAction.setBadgeBackgroundColor({color:"green"}) 
    } else if (status == 0){ 
     chrome.browserAction.setBadgeBackgroundColor({color:"red"}) 
    } else { 
     chrome.browserAction.setBadgeBackgroundColor({color:"yellow"}) 
    } 
} 

我得到這個控制檯無差錯

Unchecked runtime.lastError while running browserAction.setBadgeBackgroundColor: Unknown error. 
at setIconStatus (chrome-extension://blnceljpkdfniagjdagcnfeceanjcipe/rap.js:17:24) 
at chrome-extension://blnceljpkdfniagjdagcnfeceanjcipe/rap.js:86:3reportIfUnchecked @ extensions::lastError:133handleResponse @ extensions::sendRequest:78 

jquery.js：5 POST https://shibboleth.buffalo.edu/idp/Authn/Stateless 500（內部服務器錯誤）x.support.cors.e.crossDomain.send @ jquery.js：5x.extend.ajax @ jquery.js：5x。（匿名函數）@ jquery.js ：5（匿名功能）@ rap.js：116l @ jquery.js：3c.fireWith @ jquery.js：3k @ jquery.js：5（匿名函數）@ jquery.js：5

Answer 1

因爲你只是想要一個彩色框出現：

var status = " "; 
chrome.browserAction.setBadgeText({ text: status }); 
              // Red, Green, Blue, Alpha 
chrome.browserAction.setBadgeBackgroundColor({color: [0,255,0,255]}); 

除此之外，您可以使用html canvas元素對圖標圖像進行動態更改。然後用編輯後的圖像更新browseActionIcon。

Answer 2

現在， chrome.browserAction.setBadgeBackgroundColor（對象詳細信息）不支持css樣式顏色關鍵字。如https://developer.chrome.com/extensions/browserAction#method-setBadgeBackgroundColor所述，您可以使用十六進制RGB值或顏色數組。