javascript - Firefox Extension Addon SDK 合并多个 'Action Buttons'

标签 javascript firefox firefox-addon firefox-addon-sdk navbar

我想将两个“操作按钮”合并为一个,就像 Firefox 当前对其书签插件所做的一样,注意它在“自定义...”选项中被视为一个按钮。

这是导航栏上整个按钮的屏幕截图。

Here is what the button looks like on the navBar

这是“自定义”GUI 中“书签”按钮的屏幕截图。

Here is what the button looks like in the customization panel (Bookmarks)

我仔细查看了 SDK 文档,没有明确的方法可以做到这一点。看来这需要对 sdk/ui 库本身进行操作。我很感激能帮助我解决这个问题的任何信息或见解。谢谢。

点击here操作按钮 api 引用。

最佳答案

一开始我很犹豫要不要回答这个问题,但显然没有其他人有更好的答案,现在这是我的“非答案”答案:

ActionButton API 目前不支持此功能。

但一切并没有丢失。您可以使用新的 CustomizableUI 直接实现它API 加上一些 XUL 和 CSS,但这通常是未知领域。这里有龙;你已被警告。

如果您查看默认按钮的源代码,您会发现通常有不同的方法来实现这样的按钮:

  • 书签按钮本质上是一个“普通” <toolbarbutton type="menu-button"> 带有一些自定义样式 .toolbarbutton-menubutton-dropmarker (包含下拉标记的框)和/或 .dropmarker-icon (<image> 中的 .toolbarbutton-menubutton-dropmarker 持有实际的下拉图标)。当按钮位于工具栏上时,下拉标记图像将设置为该“列表”图标而不是默认的向下箭头图标,而当位于调色板或“汉堡包”菜单中时,整个图标将被隐藏。当然,还有一些额外的代码可以修复按钮和/或下拉标记的默认操作。
  • 另一方面,Zoom 控件似乎实际上是一个特殊容器中的三个按钮,其中有一些自定义样式,这些样式大部分似乎是可重用的类(通过 updateCombinedWidgetStyle 设置)。参见 CustomizeableWidgets例如在 MXR .

我建议您阅读如何使用 CustomizableUI ,当然还要阅读内置小部件的代码和 CSS 规则。使用 DOM Inspector 附加组件检查 Chrome Window DOM 也可能有所帮助,例如更快地找出哪些 CSS 规则在起作用以及它们来自何处;)实际的文件历史记录/变更集也可能会有所帮助。

此外,要求 SDK 团队在 ActionButton 中支持此类组合按钮可能是个好主意。 SDK(或自己创建一个补丁;)

关于javascript - Firefox Extension Addon SDK 合并多个 'Action Buttons',我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24215651/

相关文章:

java - firefox selenium webdriver 错误

javascript - 在 Firefox 中测试和添加 Javascript 到页面的更简单方法?

php - 在 jquery ajax 输出上运行 if 语句时遇到问题

javascript - 使用 $_POST 从 HTML 表单向 js 函数传递 2 个值

javascript - 确定这个节点集的长度?

css - 为什么我对表格的媒体查询在 chrome 而不是 firefox 中工作?

javascript - 远程站点,本地文件重定向

javascript - Firefox SDK 插件,左右两侧同时有侧边栏

javascript - Ember JS + Ember Data 中使用字符串代替 ID 的 URL

javascript - 如何将循环数组项传递给函数变量