• 本文
• リロード
• 差分
• バックアップ
• 名前変更
• リファラ
• 新規ページ
• 編集

Babylon.js

Babylon.js/GUI

Top / Babylon.js / GUI

ドキュメント

GUI

• https://doc.babylonjs.com/divingDeeper/gui

The Babylon GUI

• https://doc.babylonjs.com/divingDeeper/gui/gui

Scroll Viewer

XML Loader

Selector

Babylon 3D GUI

• https://doc.babylonjs.com/divingDeeper/gui/gui3D

ツール

• Babylon.js Gui Editor

コンテナ

• BABYLON.GUI.StackPanel

種類

2D

3D

• BABYLON.GUI.GUI3DManager

その他のGUI

CastorGUI

• An alternative 2D GUI
• extension

dat.GUI

HTML

• document.createElement

名前空間

• BABYLON.GUI

描画対象

• BABYLON.GUI.AdvancedDynamicTexture

モード

フルスクリーン

• In this mode, Babylon.GUI will cover the entire screen and will rescale to always adapt to your rendering resolution. It will also intercept clicks (including touches).
• By default the ratio between rendering resolution and texture size is 1. But you can force it to different values with advancedTexture.renderScale. This could be useful if you want crisper texts for instance.
• BABYLON.GUI.AdvancedDynamicTexture.CreateFullscreenUI
• only one fullscreen mode GUI is allowed per scene

バックグラウンド

• The fullscreen mode can be rendered in either the foreground or the background of a scene.
• BABYLON.GUI.AdvancedDynamicTexture.CreateFullscreenUI(foreground:bool)
• isForeground=false

スケーリング

• BABYLON.GUI.AdvancedDynamicTexture.idealWidth

テクスチャモード

• The fullscreen mode is not intended to be used with WebVR as it is a pure 2d rendering. For WebVR scenario you will have to use the texture mode below.
• BABYLON.GUI.AdvancedDynamicTexture.CreateForMesh

メモ

• BABYLON.GUI uses a BABYLON.DynamicTexture to generate a fully functional user interface which is flexible and GPU accelerated.

• Please note, in addition to the Babylon 2D GUI system described below, with Babylon.js v3.3 and higher, you also have a 3D GUI system available to leverage as well. Both systems can be used for different needs for your project.

Babylon.js/コントロール

• BABYLON.GUI.Control

Pure Control

• ボタン、テキストブロックとか

• BABYLON.GUI.Rectangle
• BABYLON.GUI.Button
• BABYLON.GUI.ScrollViewer
• BABYLON.GUI.ToggleButton?
• BABYLON.GUI.Ellipse
• BABYLON.GUI.TextBlock
• BABYLON.GUI.Image
• BABYLON.GUI.Checkbox
• BABYLON.GUI.InputText
• BABYLON.GUI.ColorPicker?
• BABYLON.GUI.Line
• BABYLON.GUI.MultiLine
• BABYLON.GUI.RadioButton
• BABYLON.GUI.BaseSlider
• BABYLON.GUI.DisplayGrid

コンテナ

• BABYLON.GUI.Container
  • BABYLON.GUI.Rectangle
    • BABYLON.GUI.Button
    • BABYLON.GUI.SelectionPanel
    • BABYLON.GUI.ScrollViewer
    • BABYLON.GUI.ToggleButton?

• BABYLON.GUI.StackPanel
• BABYLON.GUI.Grid
• BABYLON.GUI.Ellipse

当たり判定

• BABYLON.GUI.Control.isPointerBlocker

Babylon.js/イベント

• Babylon.js/Observables

デモ

• https://www.babylonjs.com/demos/gui/