工具栏

插件可以放置在工具栏上：创建自己的标签页并填充内容，或者向标准标签页添加按钮。

Toolbar item

创建工具栏项目

如有必要，使用 AddToolbarMenuItem 方法向工具栏菜单添加项目。

参数说明:

名称	类型	描述
items	Array.<ToolbarMenuMainItem>	包含主工具栏菜单项的数组

返回值：该方法不返回任何数据。

示例:

Asc.plugin.executeMethod("AddToolbarMenuItem", [{
  guid: Asc.plugin.guid,
  tabs: [
    {
      id: "my_tab",
      text: "MYTAB",
      items: [
        {
          id: "idButton1",
          type: "big-button",
          text: "Test item",
          hint: "test hint",
          data: "test_data",
          lockInViewMode: false,
          icons: "resources/%theme-type%(light|dark)/icon%state%(normal)%scale%(default|*).%extension%(png|svg)",
          items: [],
        },
      ],
    },
  ],
}])

主工具栏菜单项

主工具栏菜单项.

类型：对象

属性：

名称	类型	描述
guid	string	插件的 guid（全局唯一标识符）
tabs	Array.<ToolbarMenuTab>	包含当前菜单项工具栏标签页的数组

示例:

const oToolbarMenuMainItem = {
  guid: "asc.{9DC93CDB-B576-4F0C-B55E-FCC9C48DD007}",
  tabs: [oToolbarMenuTab],
}

工具栏菜单选项卡

工具栏菜单选项卡。

类型: 对象 (object)

属性:

名称	类型	描述
id	string	标签页 ID。标准工具栏标签页 ID 列表见下方。
text	string	标签页文本。
items	Array.<ToolbarMenuItem>	包含当前标签页工具栏菜单项的数组。

示例:

const oToolbarMenuTab = {
  id: "ChatGPT",
  text: "AI Assistant",
  items: [oToolbarMenuItem],
}

工具栏菜单项

工具栏菜单项。

类型：对象

属性：

名称	种类	描述
id	string	菜单项 ID。
type	ToolbarMenuItemType	菜单项类型。
text	string	菜单项标题。如果此字段为""，工具栏按钮仅显示图标，不显示标题。
hint	string	菜单项提示信息。
icons	string / object	菜单项图标（参见插件的config文档）。
disabled	boolean	指定当前菜单项是否被锁定。
enableToggle	boolean	指定工具栏菜单项（当 "split == false"）或其上半部分（当 "split == true"）是否可切换。
lockInViewMode	boolean	指定工具栏菜单项在视图模式下（如预览、查看表单、断开连接等）是否自动锁定。
separator	boolean	指定工具栏菜单项之间是否使用分隔符。
split	boolean	指定工具栏菜单项是否拆分为两部分，并包含下拉菜单。
items	Array.<ToolbarMenuItem>	包含当前菜单项上下文菜单项的数组。

示例:

const oToolbarMenuItem = {
  id: "MeaningItem",
  type: "button",
  text: "Meaning",
  hint: "Meaning",
  icons: "resources/%theme-name%(classic|dark)/%theme-type%(light|dark)/icon%state%(normal|hover)%scale%(default|*).%extension%(png|svg)",
  disabled: false,
  enableToggle: false,
  lockInViewMode: false,
  separator: true,
  split: true,
  items: [
    {
      id: "onMeaningT",
      text: "Explain text in comment",
    },
    {
      id: "onFixSpelling",
      text: "Fix spelling & grammar",
    },
    {
      id: "onMakeLonger",
      text: "Make longer",
    },
    {
      id: "onMakeShorter",
      text: "Make shorter",
    },
  ],
}

工具栏菜单项类型

工具栏菜单项类型。button 和 big-button 两个值等效，可用于指定工具栏按钮。

类型："button" | "big-button"

标准工具栏标签页 ID

文档编辑器

标签页ID	标签页名称
home	主页
ins	插入
draw	绘图
layout	布局
links	参考
forms	表单（仅限 PDF 表单）
review	协作
protect	保护
view	视图
plugins	插件

电子表格编辑器

标签页 ID	标签页名称
home	主页
ins	插入
draw	绘图
layout	布局
formula	公式
data	数据
pivot	数据透视表（当光标位于数据透视表时）
review	协作
protect	保护
view	视图
plugins	插件

演示文稿编辑器

标签页 ID	标签页名称
home	主页
ins	插入
draw	绘图
transit	切换
review	协作
view	视图
plugins	插件

PDF 编辑器

标签页 ID	标签页名称
home	主页
ins	插入
comment	评论
view	视图
plugins	插件

样例

样例1

普通按钮。

{
  "text": "caption",
  "split": false,
  "enableToggle": false
}

Regular button

样例2

一个被拆分为两部分的按钮：按钮的上半部分可以单独切换，下半部分包含一个下拉菜单。

{
  "text": "caption",
  "split": true,
  "enableToggle": true,
  "items": []
}

Split and toggled button

样例3

一个拆分为两部分的按钮，每部分可以单独点击，按钮的下半部分包含一个下拉菜单。

{
  "text": "caption",
  "split": true,
  "enableToggle": true,
  "items": []
}

Split button

样例4

带有下拉菜单的按钮，点击按钮时会打开该菜单。

{
  "text": "caption",
  "split": false,
  "enableToggle": false,
  "items": []
}

Button with menu

样例5

可切换的按钮。

{
  "text": "caption",
  "split": false,
  "enableToggle": true
}

订阅 onToolbarMenuClick 事件，当工具栏菜单按钮被点击时调用。

参数说明：

名称类型描述
id string 项目 ID。

示例:
```
window.Asc.plugin.event_onToolbarMenuClick = (id) => {
  this._onCustomMenuClick("toolbarMenuEvents", id)
}
```

名称	类型	描述
id	string	项目 ID。

更新工具栏菜单项

要更新工具栏菜单项，请指定更新工具栏菜单项方法。

参数：

名称	类型	说明
items	Array.<工具栏主菜单>	包含主工具栏菜单项的数组。

返回值：此方法不返回任何值。

示例：

Asc.Buttons.updateToolbarMenu = function(id, name, buttons)
  {
    let buttonMainToolbar = new Asc.ButtonToolbar(null, id);
    buttonMainToolbar.text = name;

    let items = {
      guid : window.Asc.plugin.guid,
      tabs : []
    };

    buttonMainToolbar.childs = buttons;
    for (let i = 0, len = buttons.length; i < len; i++)
      buttons[i].parent = buttonMainToolbar;

    buttonMainToolbar.toToolbar(items);

    if (items.tabs.length > 0)
      window.Asc.plugin.executeMethod("UpdateToolbarMenuItem", [items]);
  };

点击工具栏项

使用 attachToolbarMenuClickEvent 添加事件监听器，即当工具栏菜单中指定按钮被点击并触发事件时调用的函数。对于每个工具栏菜单按钮，可以通过其 ID 指定单独的事件监听器。

参数说明:

名称	类型	描述
id	string	事件名称
action	function	事件监听器函数

返回值：此方法不返回任何数据。

示例:

plugin.attachToolbarMenuClickEvent("my_tab", (data) => {
  console.log(data)
})

创建工具栏项目​

主工具栏菜单项​

工具栏菜单选项卡​

工具栏菜单项​

工具栏菜单项类型​

标准工具栏标签页 ID​

文档编辑器​

电子表格编辑器​

演示文稿编辑器​

PDF 编辑器​

样例​

样例1​

样例2​

样例3​

样例4​

样例5​

更新工具栏菜单项​

点击工具栏项​