From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- .../user_interface/page_actions/index.html | 93 ++++++++++++++++++++++ 1 file changed, 93 insertions(+) create mode 100644 files/zh-cn/mozilla/add-ons/webextensions/user_interface/page_actions/index.html (limited to 'files/zh-cn/mozilla/add-ons/webextensions/user_interface/page_actions') diff --git a/files/zh-cn/mozilla/add-ons/webextensions/user_interface/page_actions/index.html b/files/zh-cn/mozilla/add-ons/webextensions/user_interface/page_actions/index.html new file mode 100644 index 0000000000..fe3901c4a8 --- /dev/null +++ b/files/zh-cn/mozilla/add-ons/webextensions/user_interface/page_actions/index.html @@ -0,0 +1,93 @@ +--- +title: 地址栏按钮 +slug: Mozilla/Add-ons/WebExtensions/user_interface/Page_actions +translation_of: Mozilla/Add-ons/WebExtensions/user_interface/Page_actions +--- +
{{AddonSideBar}}
+ +
通常来说的page action,是添加到浏览器地址栏中的按钮。用户通过点击这个按钮与你的扩展进行交互。
+ +

+ +

地址栏按钮(Page actions)和工具栏按钮( browser actions)

+ +

地址栏按钮(或 page action) 与工具栏按钮(或 browser action)非常相似。

+ +

其不同之处为:

+ + + +

当动作(行为)与当前页面关联时,使用地址栏按钮,而当动作(行为)与浏览器相关或与多个页面相关时使用工具栏按钮。例如:

+ + + + + + + + + + + + + + + + + + + + + + + + +
类型书签动作内容动作标签操作
page action将本页面保存到书签Reddit enhancementSend tab
browser action显示所有书签使能ad-blocking同步所有打开的标签
+ +

 

+ +

定义地址栏按钮

+ +

你可以在manifest.json中使用page_action键定义地址栏按钮的属性:

+ +
"page_action": {
+  "browser_style": true,
+  "default_icon": {
+    "19": "button/geo-19.png",
+    "38": "button/geo-38.png"
+  },
+  "default_title": "Whereami?"
+}
+ +

仅default_icon是强制(必需)的。

+ +

有两种方式定义地址栏按钮:带popup窗口和无popup窗口。如果你没有指定一个popup,则当用户点击此按钮时,事件被派送到使用pageAction.onClicked侦听器的扩展:

+ +
browser.pageAction.onClicked.addListener(handleClick);
+ +

如果你指定了一个popup,则点击事件不被派送,在用户点击按钮时显示popup。用户可以与popup进行交互,并且当用户点击popup以外区域时,popup自动关闭。参见Popup可获得创建和管理popups更详细内容。

+ +

注意你的扩展只能有一个地址栏按钮。

+ +

通过使用pageAction API,你可以以编程方式修改地址栏按钮的任何属性。

+ +

Icons

+ +

如何创建用于地址栏按钮的ICONS的详细内容,请参见Photon Design System文档中的Iconography节。

+ +

示例

+ +

GitHub上的 webextensions-examples 库中包括了实现无popup地址栏按钮的例子 chill-out

-- cgit v1.2.3-54-g00ecf