如何将操作按钮图标放在Firefox附加组件的地址/ url栏中

时间:2014-08-13 10:18:18

标签: firefox firefox-addon-sdk

根据Firefox插件sdk的UI/Button/Action低级API,我可以完美地将扩展图标放在工具栏上。实际上默认情况下,该按钮出现在Firefox工具栏中。

var buttons = require('sdk/ui/button/action');

var button = buttons.ActionButton({
    id: "XXXX",
    label: "XXXXXXYYYYY",
    icon: {
        "16": "./icon-16.png",
        "32": "./icon-32.png",
        "64": "./icon-64.png"
    },
onClick: handleClick
});

我无法在API文档中看到任何选项,无法将图标放在哪里。

但很少有FF扩展那样做。我想将扩展图标放在浏览器的地址栏中,如下面的屏幕截图所示:

enter image description here

有没有解决办法?

2 个答案:

答案 0 :(得分:3)

以下是@ ZER0描述的一些代码。 我没有在Australis中对此进行过测试,但我认为它仍然有用我已经测试了它,它确实有效。

var loadUrlbarButton = function(doc, urlBtnClick) {
    var urlBarIcons = doc.getElementById('urlbar-icons')
    var btn = doc.createElement('toolbarbutton');
    btn.setAttribute('id', 'my-id');
    btn.setAttribute('image', require('sdk/self').data.url('my-icon.png'));
    btn.addEventListener('command', urlBtnClick, false);
    urlBarIcons.appendChild(btn);
    return btn;
}

var doc = require('sdk/window/utils').getMostRecentBrowserWindow().document;

var onBtnClick = function(event) {
    //do something when URL bar button is clicked
}

var urlbarButton = loadUrlbarButton(doc, onBtnClick);

答案 1 :(得分:1)

目前无法使用附加SDK或可自定义的UI API;您基本上可以手动执行此操作 - 这意味着,跟踪所有浏览器窗口,并在正确的位置附加XUL DOM节点,并处理单击。

这样的功能实际上是有计划的,但是因为在新的Australis界面中,UX团队决定使位置栏更清洁,删除所有图标 - 注意书签星形图标也被移到外面 - 它被取消优先级。然而,我们有一个错误,我有一个这样的功能原型,除非用户体验仍然有强烈的感觉,我想降落。 如果是这种情况,我可能会发布这样的模块作为第三方模块。