FlexUI

ロールアウトコントロールをフレキシブルに配置するためのフレームワーク。

特徴

• 通常はサイズが変更できないコントロールもサイズ変更が可能。

• 23種のロールアウトコントロールに対応。 （comboBox、subRollout、timerは非対応）

ライセンス

MIT License

要件

• imaoki/Standard

• （任意）imaoki/StartupLoader 導入済みの場合はインストール/アンインストールでスタートアップスクリプトの登録/解除が行われる。 未使用の場合はスクリプトの評価のみ行われる。

開発環境

3ds Max 2024

インストール

1. 依存スクリプトは予めインストールしておく。

2. install.msを実行する。

アンインストール

uninstall.msを実行する。

単一ファイル版

インストール

1. 依存スクリプトは予めインストールしておく。

2. Distribution\FlexUI.min.msを実行する。

アンインストール

::flexUI.Uninstall()

例

• Widget(Example\Widget\FlexEditTextControlWidget.ms)

  

• Layout(Example\Layout\FlexGridLayout.ms)

  

• Calc(Example\Calc.ms)

  

• Explorer(Example\Explorer.ms)

  

• Form(Example\Form.ms)

  

• TabPage(Example\TabPage.ms)

  

使い方

Widget

• ウィジェットは全種類が共通のプロパティとメソッドを持つ。

• 既定のサイズ、最小サイズ、およびリサイズの可/不可はロールアウトコントロールの特性に合わせて定数として定義されている。

(
  local widget = ::flexUI.CreateWidget Edt

  -- 全体の水平方向の位置合わせを設定
  widget.SetAlignmentH #Center

  -- 全体の垂直方向の位置合わせを設定
  widget.SetAlignmentV #Center

  -- キャプションと本体との余白ピクセルを設定
  widget.SetCaptionMargin 3

  -- キャプションの表示位置を設定
  widget.SetCaptionPosition #Left

  -- キャプションを含まない明示的な高さを設定
  widget.SetExplicitH undefined

  -- キャプションを含まない明示的な幅を設定
  widget.SetExplicitW undefined

  -- ロールアウトコントロールの可視性を設定
  widget.SetVisibility false

  -- ロールアウトコントロールの矩形を設定
  widget.SetRect (Box2 0 0 100 100)
)

Layout

GridLayout

• 仮想グリッド上にアイテムを配置するレイアウト。

• グリッドは必要に応じて自動的に拡張される。

(
  -- 任意でレイアウトオプションを設定
  local layoutOptions = ::flexUI.CreateLayoutOptions()
  local gridLayout = ::flexUI.CreateGridLayout options:layoutOptions

  -- レイアウトを追加（セルを配置する行、セルを配置する列）
  gridLayout.AddLayout vBoxLayout 1 1

  -- ウィジェットを追加（セルを配置する行、セルを配置する列、セルが専有する行数、セルが専有する列数）
  gridLayout.AddWidget widget 2 3 rowSpan:1 columnSpan:3

  -- 行の最小高を設定（対象の列、最小高）
  gridLayout.SetRowMinimumHeight 1 10

  -- 列の最小幅を設定（対象の列、最小幅）
  gridLayout.SetColumnMinimumWidth 2 10

  -- 行のストレッチ係数を設定（対象の行、ストレッチ係数）
  gridLayout.SetRowStretch 2 2

  -- 列のストレッチ係数を設定（対象の列、ストレッチ係数）
  gridLayout.SetColumnStretch 3 2

  -- 行の固定高を設定（対象の列、固定高）
  gridLayout.SetRowFixedLength 1 20

  -- 列の固定幅を設定（対象の列、固定幅）
  gridLayout.SetColumnFixedLength 1 20

  -- セルのアイテムの可視性を設定
  gridLayout.SetVisibility false

  -- レイアウトの矩形を設定
  gridLayout.SetRect (Box2 0 0 100 100)
)

GroupLayout

• GroupBoxControl用のレイアウト。

(
  -- `GroupBoxControl`ウィジェットが必須
  local groupBoxWidget = ::flexUI.CreateWidget Gbx
  local groupLayout = ::flexUI.CreateGroupLayout groupBoxWidget

  -- セルのアイテムを設定
  groupLayout.SetCell widget

  -- セルのアイテムの可視性を設定
  groupLayout.SetVisibility false

  -- レイアウトの矩形を設定
  groupLayout.SetRect (Box2 0 0 100 100)
)

HBoxLayout

• 水平方向にアイテムを配置するレイアウト。

(
  -- 任意でレイアウトオプションを設定
  local layoutOptions = ::flexUI.CreateLayoutOptions()
  local hBoxLayout = ::flexUI.CreateHBoxLayout options:layoutOptions

  -- レイアウトを追加
  hBoxLayout.AddLayout groupLayout

  -- 固定スペースを追加
  hBoxLayout.AddSpace 10

  -- ストレッチ可能なスペースを追加
  hBoxLayout.AddStretch stretch:2

  -- ウィジェットを追加
  hBoxLayout.AddWidget widget stretch:3

  -- 固定幅でレイアウトを追加
  hBoxLayout.AddLayout groupLayout fixedLength:20

  -- 固定幅でウィジェットを追加
  hBoxLayout.AddWidget widget fixedLength:20

  -- セルのアイテムの可視性を設定
  hBoxLayout.SetVisibility false

  -- レイアウトの矩形を設定
  hBoxLayout.SetRect (Box2 0 0 100 100)
)

VBoxLayout

• 垂直方向にアイテムを配置するレイアウト。

• メソッドはHBoxLayoutと共通。

(
  -- 任意でレイアウトオプションを設定
  local layoutOptions = ::flexUI.CreateLayoutOptions()
  local vBoxLayout = ::flexUI.CreateVBoxLayout options:layoutOptions

  -- レイアウトの矩形を設定
  vBoxLayout.SetRect (Box2 0 0 100 100)
)

StackedLayout

• 登録されたアイテムの内一つのみを表示するレイアウト。

(
  -- 任意でレイアウトオプションを設定
  local layoutOptions = ::flexUI.CreateLayoutOptions()
  local stackedLayout = ::flexUI.CreateStackedLayout options:layoutOptions

  -- レイアウトを追加
  stackedLayout.AddLayout layout

  -- ウィジェットを追加
  stackedLayout.AddWidget widget

  -- レイアウトを追加（挿入先インデックスを指定）
  stackedLayout.AddLayout layout index:2

  -- ウィジェットを追加（挿入先インデックスを指定）
  stackedLayout.AddWidget widget index:2

  -- 現在表示されているアイテムのインデックスを設定
  stackedLayout.SetCurrentIndex 2

  -- ロールアウトコントロールの選択と現在のインデックスを同期させる
  DdlPage.Selection = stackedLayout.GetCurrentIndex()

  -- レイアウトの矩形を設定
  stackedLayout.SetRect (Box2 0 0 100 100)
)

制限

• RolloutFloaterおよびSubRolloutには非対応。 Resizedイベントの発生するダイアログでのみ使用可能。

• FlexComboBoxControlWidgetStructはdropDownListにのみ対応。 現状ではdropDownListとの判別ができないため使用頻度の低そうなcomboBoxを非対応とした。

• curveControlのサイズ変更には非対応。

• sliderのorientパラメータは#Horizontalにのみ対応。

追加情報

グローバル変数

• 通常はグローバル変数::flexUIを通して操作する。

• 詳細はmxsdoc.FlexUI.msを参照。

ウィジェットの種類

ウィジェット	ロールアウトコントロール	幅	高さ	イメージ
FlexAngleControlWidgetStruct	angle	可変	可変
FlexBitmapControlWidgetStruct	bitmap	可変	可変
FlexButtonControlWidgetStruct	button	可変	可変
FlexCheckBoxControlWidgetStruct	checkBox	固定	固定
FlexCheckButtonControlWidgetStruct	checkButton	可変	可変
FlexColorPickerControlWidgetStruct	colorPicker	可変	可変
FlexComboBoxControlWidgetStruct	dropDownList	可変	固定
FlexDotNetControlWidgetStruct	dotNetControl	可変	可変
FlexEditTextControlWidgetStruct	editText	可変	可変
FlexGroupBoxControlWidgetStruct	groupBox	可変	可変
FlexImgTagWidgetStruct	imgTag	可変	可変
FlexLabelControlWidgetStruct	label	固定	固定
FlexLinkControlWidgetStruct	hyperLink	固定	固定
FlexListBoxControlWidgetStruct	listBox	可変	可変
FlexMapButtonControlWidgetStruct	mapButton	可変	可変
FlexMaxCurveCtlWidgetStruct	curveControl	固定	固定
FlexMtlButtonControlWidgetStruct	materialButton	可変	可変
FlexMultiListBoxControlWidgetStruct	multiListBox	可変	可変
FlexPickerControlWidgetStruct	pickButton	可変	可変
FlexProgressBarWidgetStruct	progressBar	可変	可変
FlexRadioControlWidgetStruct	radioButtons	可変	可変
FlexSliderControlWidgetStruct	slider	可変	固定
FlexSpinnerControlWidgetStruct	spinner	可変	固定

レイアウトの種類

レイアウト	説明	イメージ
FlexGridLayoutStruct	グリッドにアイテムを配置する
FlexGroupLayoutStruct	GroupBoxControl用のレイアウト
FlexHBoxLayoutStruct	水平方向にアイテムを配置する
FlexVBoxLayoutStruct	垂直方向にアイテムを配置する
FlexStackedLayoutStruct	登録されたアイテムの内一つのみを表示する

レイアウトオプション

• レイアウト各部の余白を設定する。

• 詳細はmxsdoc.FlexLayoutOptions.msを参照。

(
  local layoutOptions = ::flexUI.CreateLayoutOptions()

  -- セル間の水平方向の余白を設定
  layoutOptions.SetMarginH 0

  -- セル間の垂直方向の余白を設定
  layoutOptions.SetMarginV 0

  -- レイアウト外周の下側の余白を設定
  layoutOptions.SetPaddingB 0

  -- レイアウト外周の左側の余白を設定
  layoutOptions.SetPaddingL 0

  -- レイアウト外周の右側の余白を設定
  layoutOptions.SetPaddingR 0

  -- レイアウト外周の上側の余白を設定
  layoutOptions.SetPaddingT 0

  -- セル間の余白を一括設定（水平方向の余白、垂直方向の余白）
  layoutOptions.SetMargin 0 0

  -- レイアウト外周の余白を一括設定（上側の余白、右側の余白、下側の余白、左側の余白）
  layoutOptions.SetPadding 0 0 0 0
)

通知

Widget

全てのウィジェットで共通。

• Widget

Layout

• FlexGridLayoutStruct

• FlexGroupLayoutStruct

• FlexHBoxLayoutStruct

• FlexVBoxLayoutStruct

• FlexStackedLayoutStruct

Layout Options

• FlexLayoutOptionsStruct