在Firefox中顯示小部件

Question

我的Firefox插件使用小部件，當我點擊它時，它顯示面板。下面是它的代碼

var Widget = require("widget").Widget; 
var tabs = require('tabs'); 
var data = require("sdk/self").data; 
var panel = require("sdk/panel").Panel({ 
    contentURL: "about:blank", 
    width: 200, 
    height: 480, 
    onHide: function(){ 
    panel.contentURL = data.url("loading.html") 
    } 
}); 
exports.main = function() { 
    // Widget documentation: https://addons.mozilla.org/en-US/developers/docs/sdk/latest/modules/sdk/widget.html 
    var widget = new Widget({ 
     id: "MobileView-widget-1", 
     label: "MobileView", 
     tooltip : "Start Mobile View", 
     panel: panel, 
     onClick: function() { 
      panel.contentURL = "https://developer.mozilla.org/en-US/Add-ons/SDK/High-Level_APIs/tabs#activeTab"; 
     }, 
     contentURL: data.url("mobile.png") 
    }); 
}; 

當我點擊的小部件，它顯示了它上面的面板，但是當焦點出，立即關閉並重新再次啓動。我如何確保它不會關閉焦點，但我需要再次單擊該小部件才能隱藏它。

Answer 1

微件系統在Firefox 29中除去，你必須現在使用此：https://developer.mozilla.org/en-US/Add-ons/SDK/High-Level_APIs/ui

var { ToggleButton } = require('sdk/ui/button/toggle'); 
var panels = require("sdk/panel"); 
var self = require("sdk/self"); 

var button = ToggleButton({ 
    id: "my-button", 
    label: "my button", 
    icon: { 
    "16": "./icon-16.png", 
    "32": "./icon-32.png", 
    "64": "./icon-64.png" 
    }, 
    onChange: handleChange 
}); 

var panel = panels.Panel({ 
    contentURL: self.data.url("panel.html"), 
    onHide: handleHide 
}); 

function handleChange(state) { 
    if (state.checked) { 
    panel.show({ 
     position: button 
    }); 
    } 
} 

function handleHide() { 
    button.state('window', {checked: false}); 
}