Firefox附加SDK中的Chrome的"setBadgeText"是否等效? [英] Is there an equivalent for Chrome's 'setBadgeText' in Firefox Add-on SDK?
问题描述
Chrome的方法chrome.browserAction.setBadgeText将文本覆盖在扩展程序图标上方.例如，如果要显示未读邮件总数，这将很方便.
从SDK 1.11版开始，我在Firefox附加SDK API中找不到类似的方法.
注意:由于删除了小部件模块，此答案在Firefox 38+中不再起作用.使用 ui模块中的按钮之一.
我已将 至此，您已经设置了所有先决条件.剩下的就是创建浏览器操作. 此附加组件在位置栏附近添加浏览器操作，该操作在单击时显示弹出窗口.在此弹出窗口的输入字段中键入内容时，选项卡的标题将更改为该字段的值.chrome.browserAction API移植到Firefox，并将其作为Jetpack模块发布，请参见 说明)
package.json，并将"browser-action"添加为依赖项.示例
lib/main.js
// lib/main.js
var badge = require('browserAction').BrowserAction({
default_icon: 'images/icon19.png', // optional
default_title: 'Badge title', // optional; shown in tooltip
default_popup: 'popup.html' // optional
});
badge.onMessage.addListener(function(message, sender, sendResponse) {
require('sdk/tabs').activeTab.title = message;
});
data/popup.html
<!-- (Example) Please avoid inline JavaScript/CSS in your production code -->
<body style="width:200px;">
Demo: This is a popup page.<br>
Uses <code>extension.sendMessage</code> to notify the background page,
which in turn changes the current tab's title to below value <br>
<input onkeyup="extension.sendMessage(this.value);" style="display:block;">
</body>
这里是结果的简短截屏(注意:工具提示的颜色略有不同； 由拜赞兹录制的):
Chrome's method chrome.browserAction.setBadgeText overlays text on top of the extensions icon. This is handy if you want to display total unread mails for example.
Is there an equivalent method when developing a Firefox Addon SDK extension, or what is the best way to change the icon at runtime?
As of version 1.11 of SDK I can't find similar method in Firefox Add-on SDK API.
Note: This answer does not work any more in Firefox 38+ due to the removal of the widget module. Use one of the buttons from the ui module instead.
I've ported the chrome.browserAction API to Firefox, and published it as a Jetpack module, see https://github.com/Rob--W/browser-action-jplib
If you're familiar with the chrome.browserAction API, using this module can't be easier. Even if you have never created a Firefox add-on before, you can get started within a few minutes:
- Install the add-on SDK (instructions from Mozilla).
- Activate the SDK (by running
addon-sdk) and create the boilerplate files (cfx init). - Download my browser-action Jetpack library (instructions).
- Edit your add-on's
package.json, and add"browser-action"as a dependency.
At this point, you've set up all prerequisites. What remains is the creation of the browser action.
Example
This add-on adds a browser action near the location bar, which shows a popup on click. When you type something in the input field within this popup, the tab's title is changes to the field's value.
lib/main.js
// lib/main.js
var badge = require('browserAction').BrowserAction({
default_icon: 'images/icon19.png', // optional
default_title: 'Badge title', // optional; shown in tooltip
default_popup: 'popup.html' // optional
});
badge.onMessage.addListener(function(message, sender, sendResponse) {
require('sdk/tabs').activeTab.title = message;
});
data/popup.html
<!-- (Example) Please avoid inline JavaScript/CSS in your production code -->
<body style="width:200px;">
Demo: This is a popup page.<br>
Uses <code>extension.sendMessage</code> to notify the background page,
which in turn changes the current tab's title to below value <br>
<input onkeyup="extension.sendMessage(this.value);" style="display:block;">
</body>
Here's a short screencast of the result (note: tooltip color is slightly off; recorded with byzanz):
这篇关于Firefox附加SDK中的Chrome的"setBadgeText"是否等效?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
