如何在Firefox上创建工具栏？

Question

我需要在Firefox上创建两个工具栏：一个是水平的，另一个垂直于浏览器的右侧。但是，对于Firefox的sdk库没有资源来做到这一点。任何消化？

Answer 1

这可能帮助，很简单的指南制定了为方便阅读：

http://www.borngeek.com/firefox/toolbar-tutorial/

Answer 2

自1.15版本附加组件SDK允许您创建工具栏和按钮添加到它。我不认为有可能创建一个垂直的工具栏，只有水平的工具栏。

有一个关于如何做到这一点的Addon SDK official repository一个很好的例子：

/* This Source Code Form is subject to the terms of the Mozilla Public 
* License, v. 2.0. If a copy of the MPL was not distributed with this 
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */ 
"use strict"; 

const { Toolbar } = require("sdk/ui/toolbar"); 
const { Frame } = require("sdk/ui/frame"); 
const { Button } = require("sdk/ui/button"); 

let button = new Button({ 
    id: "button", 
    label: "send!", 
    icon: "./favicon.ico", 
    onClick:() => { 
    frame.postMessage({ 
     hello: "content" 
    }); 
    } 
}); 

let frame = new Frame({ 
    url: "./index.html", 
    onAttach:() => { 
     console.log("frame was attached"); 
    }, 
    onReady:() => { 
     console.log("frame document was loaded"); 
    }, 
    onLoad:() => { 
     console.log("frame load complete"); 
    }, 
    onMessage: (event) => { 
     console.log("got message from frame content", event); 
     if (event.data === "ping!") 
     event.source.postMessage("pong!", event.source.origin); 
    } 
}); 

let toolbar = new Toolbar({ 
    items: [frame], 
    title: "Addon Demo", 
    hidden: false, 
    onShow:() => { 
    console.log("toolbar was shown"); 
    }, 
    onHide:() => { 
    console.log("toolbar was hidden"); 
    } 
}); 

此外，还有an older SO thread解释如何做到这一点的旧版本附加组件的SDK和基于XUL的插件。

Answer 3

上述代码仅适用于Firefox Australis（upcomming版本29.0）。您可以使用像toolbarwidget-jplib by Rob--W这样的Jetpack模块。

所以，你可以在导航栏上添加小工具：

require("toolbarwidget").ToolbarWidget({ 
toolbarID: "nav-bar", // <-- Place widget on Navigation bar 
id: "mozilla-icon", 
label: "My Mozilla Widget", 
contentURL: "http://www.mozilla.org/favicon.ico" 
});