插件SDK制作对话框的方法 [英] Addon SDK way to make a dialog

问题描述

使用SDK进行对话框(不固定在附加栏等，而是在屏幕上居中显示)的正确方法是什么?似乎没有针对此重要功能的任何API.我确实看到windows/utils具有open，但是我有两个问题:

1. 打开对话框似乎需要使用"chrome" privs才能使其在屏幕上居中(我希望其他评论家抱怨chrome privs，即使不是，我也想尝试一下坚持使用SDK的方式.
2. 虽然我可以获取新的window/utils'open()对话框的DOM窗口引用，但是我不确定如何附加内容脚本，因此我可以通过提示的方式来响应用户交互(并可以响应来)特权行为ala postMessage或port.emit(无需再次使用，直接与chrome privs一起使用).

解决方案

好吧，对于那些对SDK有一点经验的人来说，这个答案应该很明显.我意识到我可以只使用面板.在我的辩护中，"panel"这个名字在表达这个想法时并不像"dialog"那么清晰，而且我习惯于使用带有小部件的面板，以至于我没有想到我可以独立使用它！ /p>

修改

不幸的是，根据错误595040 ，这些对话框不是持久性的，这意味着如果专家组失去焦点，对话"就消失了……所以专家组看起来毕竟不是合适的候选人...:(

编辑2

此后，我继续前进，并使大多数工作满足于sdk/window/utils和openDialog的要求，在它们返回的窗口上，我添加了一个加载侦听器，然后调用tabs.activeTab.on('ready',，然后将tabs.activeTab.url设置为我的添加项-在本地HTML文件上，因此ready事件将获得一个选项卡，我可以在该选项卡上附加一个工作程序.我猜想chrome privs仍然存在问题，但是至少主要的通信使用的是SDK进程.

更新为修改2 :

请求提供的代码示例:

var data = require('sdk/self').data,
    tabs = require('sdk/tabs');
var win = require('sdk/window/utils').openDialog({
    // No "url" supplied here in this case as we add it below (in order to have a ready listener in place before load which can give us access to the tab worker)
    // For more, see https://developer.mozilla.org/en-US/docs/Web/API/window.open#Position_and_size_features
    features: Object.keys({
        chrome: true, // Needed for centerscreen per docs
        centerscreen: true, // Doesn't seem to be working for some reason (even though it does work when calling via XPCOM)
        resizable: true,
        scrollbars: true
    }).join() + ',width=850,height=650',
    name: "My window name"
    // parent: 
    // args: 
});
win.addEventListener('load', function () {
    tabs.activeTab.on('ready', function (tab) {
        var worker = tab.attach({
            contentScriptFile: ....
            // ...
        });
        // Use worker.port.on, worker.port.emit, etc...
    });
    tabs.activeTab.url = data.url('myHTMLFile.html');
});

What is the proper way to use the SDK to make a dialog (which is not anchored to the add-on bar, etc. but shows centered on screen)? It doesn't seem like there is any API for this important capability. I do see windows/utils has open but I have two problems with that:

1. The dialog opening seems to require "chrome" privs to get it to be centered on the screen (and I'd be expectant of add-on reviewers complaining of chrome privs, and even if not, I'd like to try to stick to the SDK way).
2. While I can get the DOM window reference of the new window/utils' open() dialog, I'm not sure how to attach a content script so I can respond to user interaction in a way that prompts (and can respond to) privileged behavior ala postMessage or port.emit (without again, directly working with chrome privs).

解决方案

Ok, this answer should have been pretty obvious for anyone with a little experience with the SDK. I realized I can just use a panel. In my defense, the name "panel" is not as clear as "dialog" in conjuring up this idea, and I am so used to using panels with widgets, that it hadn't occurred to me that I could use it independently!

Edit

Unfortunately, as per Bug 595040, these dialogs are not persistent, meaning if the panel loses focus, the "dialog" is gone... So panel looks like it is not a suitable candidate after all... :(

Edit 2

I've since moved on and have gotten things working mostly to my satisfaction with sdk/window/utils and openDialog on whose returned window I add a load listener and then call tabs.activeTab.on('ready', and then set tabs.activeTab.url to my add-on local HTML file so the ready event will get a tab to which I can attach a worker. There is still the problem with chrome privs I suppose, but at least the main communications are using SDK processes.

Update to Edit 2:

Code sample provided by request:

var data = require('sdk/self').data,
    tabs = require('sdk/tabs');
var win = require('sdk/window/utils').openDialog({
    // No "url" supplied here in this case as we add it below (in order to have a ready listener in place before load which can give us access to the tab worker)
    // For more, see https://developer.mozilla.org/en-US/docs/Web/API/window.open#Position_and_size_features
    features: Object.keys({
        chrome: true, // Needed for centerscreen per docs
        centerscreen: true, // Doesn't seem to be working for some reason (even though it does work when calling via XPCOM)
        resizable: true,
        scrollbars: true
    }).join() + ',width=850,height=650',
    name: "My window name"
    // parent: 
    // args: 
});
win.addEventListener('load', function () {
    tabs.activeTab.on('ready', function (tab) {
        var worker = tab.attach({
            contentScriptFile: ....
            // ...
        });
        // Use worker.port.on, worker.port.emit, etc...
    });
    tabs.activeTab.url = data.url('myHTMLFile.html');
});

这篇关于插件SDK制作对话框的方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！