（履歴） - NeosVR日本語Wiki

UIX

高パフォーマンスなUIを作成できるフレームワーク。
要は「軽い」。

Neos VR内の多くのUI（インスペクター・インベントリ・コンテキストメニュー・その他）はUIXで構成されている。

UIXの作り方

DevToolを使用してCreate new→Object→NeosUI→Panelを作成する。
これをInspectorで開くとContentというSlotにCanvasというコンポーネントが入っている。

Contentの子にSlotを追加し、そこにUIX関連のコンポーネントを入れることでUIを作っていく。

Canvas

UIXの土台となるコンポーネント。
ここでUI全体のサイズやタッチ方式の設定ができる。

Graphics

DualColorImage

Image

単色、または画像を表示する。

Sprite	画像を表示する場合、SpriteProviderを指定する
Material	マテリアルを指定する（nullの場合デフォルトのUI Unlitが使用される）
Tint	色合い
PreserveAspect	画像を表示する場合、アスペクト比を保持する
InteractionTarget

Mask

Imageと同じSlotにつけて使用する。
子のSlotの表示を同じSlotのImageでマスクする。

ゴミ箱のアイコンでマスクした例

OutlinedArc

アウトライン付きの円弧を描画する。

Arc	Arcの角度
Offset	Arc開始点の角度
OuterRadiusRatio	Rectに対する外径の比率
InnerRadiusRatio	Rectに対する内径の比率
FillColor	塗りの色
OutlineColor	アウトラインの色
OutlineThickness	アウトラインの太さ
Material	マテリアル（nullの場合初期設定のUI Unlitが使用される）

RawImage

Text

テキストを表示する。

Font	フォント
Content	表示する文字列
ParseRichText	リッチテキストを使用する（<b><color>などによる装飾）
NullContent	ContentがNullのときに表示する文字列
Size	文字サイズ
HorizontalAlign	横揃えの位置
VerticalAlign	縦揃えの位置
AlignmentMode
Color	文字色
LineHeight	行の高さ
MaskPattern
HorizontalAutoSize	横幅に応じてサイズを自動調整する
VerticalAutoSize	縦幅に応じてサイズを自動調整する
AutoSizeMin	サイズ自動調整の下限
AutoSizeMax	サイズ自動調整の上限
CaretPosition	現在キャレット（入力カーソル）が置かれている位置
SelectionStart	文字選択がされている場合、選択が開始された位置
CaretColor	キャレットの色
SelectionColor	文字選択の色

TiledRawImage

Interaction

Button

Slotの要素をボタンにする。
ImageやOutlinedArcと同じSlotにつけて使用する。
ボタンを押した情報はLogiXのButtonEventノードでも取得できる。

BaseColor	ボタンの基本色
ColorDrive	色をドライブする対象
TintColorMode	色を変更する方法
NormalColor	通常時の色
HighlightColor	レーザーを当てたときの色
PressColor	押し下げ中の色
DisabledColor	ButtonコンポーネントのEnabledがFalseになっているときの色
IsPressed	押されているときTrueになる
IsHovering	レーザーが当たっているときTrueになる
HoverVibrate	レーザーが当たったときのバイブレーションの長さ
PressVibrate	押されたときのバイブレーションの長さ
ClearFocusOnPress
PassThroughHorizontalMovement
PassThroughVerticalMovement
RequireInitialPress
PressPoint	押されたときの座標
Pressed
Released
HoverEnter
HoverLeave

Checkbox

Expander

ReferenceRadio<T>

ScrollRect

Slider

ValueRadio<T>

値を選択できるラジオボタンを作成する。
複数設置し、TargetValueが同じものを参照している各ValueRadioが一組のラジオボタンとして扱われる。

CheckVisual	選択されているときに表示する画像（ValueRadioの子SlotにImageを入れ、そのEnabledをここに設定する）
OptionValue	選択されたときにTargetValueの参照先に設定する値
TargetValue	値を設定する対象

Layout

ArcLayout

OutlinedArc用のレイアウトコンポーネント。
ArcLayoutをつけたSlotの子SlotにOutlinedArcを付けて使用する。

Arc	Arcの角度
Offset	Arc開始点の角度
Separation	OutlinedArc同士の間隔
CenterAtSeparation	Separationの中心をArc開始点にする
ProportionalSize
ItemDirection	アイテムの並び順（時計回り/反時計回り）

ArcSegmentLayout

AspectRatioFitter

ContentSizeFitter

GridLayout

子の要素を格子状に並べる。

PaddingTop/Right/Bottom/Left	上下左右の余白
CellSize	各要素のサイズ
Spacing	要素同士の余白
HorizontalAlign	横の位置揃え
VerticalAlign	縦の位置揃え

HorizontalLayout

子の要素を横に並べる。

PaddingTop/Right/Bottom/Left	上下左右の余白
Spacing	要素同士の余白
HorizontalAlign	横の位置揃え
VerticalAlign	縦の位置揃え
ForceExpandWidth	子の要素の横幅を強制的に親に合わせる
ForceExpandHeight	子の要素の縦幅を強制的に親に合わせる

IgnoreLayout

LayoutElement

VerticalLayout

子の要素を縦に並べる。

PaddingTop/Right/Bottom/Left	上下左右の余白
Spacing	要素同士の余白
HorizontalAlign	横の位置揃え
VerticalAlign	縦の位置揃え
ForceExpandWidth	子の要素の横幅を強制的に親に合わせる
ForceExpandHeight	子の要素の縦幅を強制的に親に合わせる

Utility

RectSlotDriver

UIX要素の位置をSlotのTransformに反映させる。
LogiXからUIX要素の座標を取得したいときに便利。