フローティングパネルFloatingPanel
Experimental

作業面やキャンバス上に、ツール、状態、補助情報を重ねて表示するパネルです。必要に応じてドラッグやリサイズも有効化できます。

プレビュー

状態とバリエーション

キャンバス上の複数パネル

ツールパネルやプロパティパネルのように、作業面に重ねて配置します。

ドラッグ・リサイズ可能

タイトルバーをドラッグして移動し、右下のハンドルでサイズを調整できます。

フローティングツールバー

編集対象の近くに、アイコン操作をまとめた小さなパネルを置きます。

通知と状態

作業の完了や確認が必要な状態を、画面上に一時的に重ねます。

固定幅の情報パネル

背景を透過しない情報パネルとして使う場合は solid を選びます。

プロパティ

表は横にスクロールできます
プロパティ初期値説明
variant"glass" | "solid" | "ghost""glass"パネルの見た目を切り替えます。
titlestring-ヘッダーに表示する任意のタイトルです。
dragEnabledbooleanfalseタイトルバーをドラッグハンドルとして移動を有効にします。
resizablebooleanfalse右下からサイズ変更できるようにします。
minWidth / minHeightnumber220 / 140リサイズ時の最小サイズを指定します。
contentClassNamestring-スクロール領域など、本文エリアに追加する className です。

使い方

Loading...

使用コンポーネント