核心功能
Univer Slides 核心功能由簡報模型和瀏覽器編輯介面組成。模型使用 ISlideData 快照儲存簡報，介面則透過 Univer 命令算繪和編輯該模型。
功能
- 簡報模型：管理簡報識別、頁面尺寸、投影片順序、投影片、母片頁、版面配置頁、主題、轉場效果和資源。
- 算繪與編輯：提供投影片畫布、縮圖、選取、剪貼簿、文字與圖形編輯、對齊參考線和播放功能。
- 命令管線：透過命令和變更套用頁面與元素更新，使模型、算繪以及復原和重做保持同步。
- Facade API：透過面向應用程式的物件建立和尋找簡報、儲存快照，並操作投影片和元素。
- 外掛程式架構：表格、圖表、列印和匯入匯出等選用功能與核心外掛程式堆疊相互獨立。
外掛程式模式
安裝
pnpm add @univerjs/core @univerjs/design @univerjs/docs @univerjs/docs-ui @univerjs/drawing @univerjs/engine-render @univerjs/ui @univerjs-pro/license @univerjs-pro/slides @univerjs-pro/slides-uinpm install @univerjs/core @univerjs/design @univerjs/docs @univerjs/docs-ui @univerjs/drawing @univerjs/engine-render @univerjs/ui @univerjs-pro/license @univerjs-pro/slides @univerjs-pro/slides-uiyarn add @univerjs/core @univerjs/design @univerjs/docs @univerjs/docs-ui @univerjs/drawing @univerjs/engine-render @univerjs/ui @univerjs-pro/license @univerjs-pro/slides @univerjs-pro/slides-uibun add @univerjs/core @univerjs/design @univerjs/docs @univerjs/docs-ui @univerjs/drawing @univerjs/engine-render @univerjs/ui @univerjs-pro/license @univerjs-pro/slides @univerjs-pro/slides-ui使用
import { UniverLicensePlugin } from '@univerjs-pro/license'import { UniverSlidesPlugin } from '@univerjs-pro/slides'import { UniverSlidesUIPlugin } from '@univerjs-pro/slides-ui'import SlidesUIEnUS from '@univerjs-pro/slides-ui/locale/en-US'import SlidesEnUS from '@univerjs-pro/slides/locale/en-US'import { LocaleType, mergeLocales, Univer } from '@univerjs/core'import { FUniver } from '@univerjs/core/facade'import DesignEnUS from '@univerjs/design/locale/en-US'import { UniverDocsPlugin } from '@univerjs/docs'import { UniverDocsUIPlugin } from '@univerjs/docs-ui'import DocsUIEnUS from '@univerjs/docs-ui/locale/en-US'import { UniverDrawingPlugin } from '@univerjs/drawing'import { UniverRenderEnginePlugin } from '@univerjs/engine-render'import { UniverUIPlugin } from '@univerjs/ui'import UIEnUS from '@univerjs/ui/locale/en-US'import '@univerjs-pro/slides/facade'import '@univerjs/design/lib/index.css'import '@univerjs/ui/lib/index.css'import '@univerjs/docs-ui/lib/index.css'import '@univerjs-pro/slides-ui/lib/index.css'const univer = new Univer({ locale: LocaleType.EN_US, locales: { [LocaleType.EN_US]: mergeLocales(DesignEnUS, UIEnUS, DocsUIEnUS, SlidesEnUS, SlidesUIEnUS), },})univer.registerPlugin(UniverRenderEnginePlugin)univer.registerPlugin(UniverUIPlugin, { container: 'app' })univer.registerPlugin(UniverDocsPlugin)univer.registerPlugin(UniverDocsUIPlugin)univer.registerPlugin(UniverDrawingPlugin)univer.registerPlugin(UniverLicensePlugin, { license: process.env.CLIENT_LICENSE_TEXT,})univer.registerPlugin(UniverSlidesPlugin)univer.registerPlugin(UniverSlidesUIPlugin)const univerAPI = FUniver.newAPI(univer)const presentation = univerAPI.createPresentation({ name: 'Quarterly review' })如果瀏覽器只需要算繪簡報而不顯示編輯控制項，請為 UniverSlidesUIPlugin 傳入 { editor: { enabled: false } }。在 Node.js 中，只註冊 UniverSlidesPlugin，無需註冊介面外掛程式。
預設模式
Univer Slides 目前沒有提供預設套件。無論只使用模型還是建立瀏覽器編輯器，都請使用外掛程式模式。
工具列分組
開始索引標籤包含主題、轉場、背景與演講者備註；插入索引標籤組織內容插入與物件清單；檢視索引標籤提供頁面尺寸、縮放與全螢幕。情境格式索引標籤隨選取內容改變：形狀顯示形狀格式、圖片顯示圖片格式、圖表顯示圖表格式，包含圖片或圖表的混合選取顯示通用物件操作。圖片格式提供裁剪與裁剪形狀、尺寸、位置及旋轉，部分控制項僅適用單張圖片。選取表格時使用表格 UI 外掛的控制項。形狀格式另有獨立浮動工具列開關。
選單順序與網格佈局
在既有的 UniverUIPlugin 註冊設定中設定 menu 和 ribbonType。它們屬於共用 UI 設定，不應傳給 UniverSlidesUIPlugin。以下使用 Slides 的實際選單項目 ID：
初始化設定
import type { MenuConfig } from '@univerjs/ui'import { UniverUIPlugin } from '@univerjs/ui'const menu: MenuConfig = { 'ribbon.view': { order: -1 }, 'ribbon.start.layout': { order: -1 }, 'slide.menu.insert.text': { order: 1, gridLayout: { row: 1, column: 2, rowSpan: 2, showLabel: true, width: 96 }, }, 'slide.menu.insert.shape': { order: 0, gridLayout: { row: 1, column: 1, rowSpan: 2, showLabel: true }, },}univer.registerPlugin(UniverUIPlugin, { container: 'app', ribbonType: 'grid', menu })order 依數值由小到大排列同層級頁籤、群組或選單項目，不會將項目移到其他群組。選單項目 ID 可從其 data-u-command 屬性取得，不應直接假設它與命令 ID 相同。
執行階段更新
先匯入 @univerjs/ui/facade，再透過 FUniver.newAPI(univer) 建立 univerAPI。updateMenuConfig() 會合併修改、保留未指定的欄位並重新整理選單，設定也會套用到之後註冊的選單。
import '@univerjs/ui/facade'univerAPI.updateMenuConfig({ 'slide.menu.insert.text': { gridLayout: { row: 1, column: 2, width: 120 } },})gridLayout 僅控制網格 Ribbon。每個群組固定兩列，row 和 column 從 1 開始。明確座標優先決定位置，因此交換已佔用的儲存格時應同時修改兩個選單項目，不能只調整 order。未指定的選用欄位沿用既有設定或 Schema。跨列、跨欄、標籤、寬度和圖示尺寸請見 IRibbonGridLayout。
請保持 UniverSlidesUIPlugin 的編輯功能開啟：editor.enabled: false 會略過該產品 Ribbon 的註冊。選單覆寫設定不會建立尚未註冊的按鈕。
自訂按鈕和子選單入口也能透過 createMenu()、createSubmenu() 設定 order 與 gridLayout，再呼叫 appendTo() 註冊。彈出選單內部不使用 Ribbon 的網格佈局。
你覺得這篇文檔如何？