UI 概要

@univerjs-pro/boards-ui は、ライセンスが必要な Univer Boards のブラウザーキャンバスを提供します。シーン、選択とビューポートの操作、ツールバー、コンテキストメニュー、テキスト、図形、コネクター、対応する Board 要素の編集 UI を描画します。

Board UI を登録する

Board プラグインより先に UniverLicensePlugin を設定します。Docs、Drawing、Ink、Shape Editor は技術的な描画および編集依存関係であり、それらの製品について事前に知る必要はありません。

TypeScript
univer.registerPlugin(UniverLicensePlugin, {  license: process.env.CLIENT_LICENSE_TEXT,})univer.registerPlugin(UniverBoardsPlugin)univer.registerPlugin(UniverBoardsUIPlugin, {  workbench: {    content: true,    header: false,    headerMenu: false,    toolbar: false,    footer: false,  },  interaction: {    minZoomRatio: 0.1,    maxZoomRatio: 4,    wheelZoomWithModifier: true,    trackpadPanEnabled: true,  },})

依存関係、スタイル、ロケールの完全な登録順序はインストールと基本的な使い方を参照してください。

キャンバス設定

IUniverBoardsUIConfig はグリッド、挿入時の既定値、図形と付箋の色、ツール、ビューポートバー、レンダーアダプター、クイック追加、精密選択、寸法表示、共同編集カーソルも制御します。

コンテキストメニューの上書きには menu と updateMenuConfig() を使用します。Boards 独自のキャンバスツールバーは toolbar.tools で設定し、Ribbon の gridLayout では制御しません。

このガイドはいかがですか?

© 2026 DreamNum Co., Ltd.