プレゼンテーション¶

ノードツリー¶

ノードツリーは、コンテンツの構造とその画面上でのレイアウトを定義します。

ノードツリーは、コンテンツを表示するノード（例: Image ノード）とロジックを実装するノード（例: Button 2D ノード）から構成されています。同じノードツリーは2Dおよび3Dノードをサポートし、それらを接続する手段を提供します。

ノードツリー内のノード間の関係は非常に重要であり、いくつかの Kanzi コア技術がどのように機能するかを定義します。レンダリング順序、レイアウト、プロパティとリソースの継承、および入力とメッセージの伝播はすべて、ノードツリー内の親ノードと子ノードの関係に依存しています。

Kanzi は、ノードツリーの一部（例えば、プレハブ）をモジュール化して再利用するためのツールを提供します。

Kanzi で利用可能なノード¶

コンテンツコントロール (Content control) ノード¶

Image。

ビットマップ画像を表示するには、Image ノードを使用します。

Image ノードを使用するを参照してください。

Model。

Kanzi アプリケーションにインポートされたメッシュを表示するには、Model ノードを使用します。

インポートされたメッシュを使用するを参照してください。

Nine Patch Image。

Nine Patch Image ノードを使用して、Nine Patch Image コンテンツのサイズに応じて拡縮するスケーラブルなボタン背景を作成します。

Nine Patch Image ノードを使用するを参照してください。

Page。

Page ノードを使用して、アプリケーションのユーザーインターフェースの構造を作成し、Page Host ノードを使用して、Page Host ノードの下で Page ノード間のナビゲーション要求と遷移を管理します。例えば、Kanzi アプリケーションで異なる部分のユーザーインターフェースを作成するために、Page および Page Host ノードを使用できます。例えば、Page Host ノード Home、Media、Navigation、または Settings スクリーンなど、それぞれが独自の Page および Page Host ノードの階層を持っています。

Page ノードと Page Host ノードを使用するを参照してください。

Text Block 3D と Text Block 2D。

アプリケーションにテキストを表示するには、Text Block ノードを使用します。

Text Block ノードを使用するを参照してください。

Viewport 3D と Viewport 2D。

Kanzi がコンテンツを投影するレンダーターゲットサーフェスのサイズを設定するには、Viewport ノードを使用します。

Viewport ノードを参照してください。

インタラクティブコントロール (Interactivity control) ノード¶

../_images/interactivity-control-nodes.png

Button 3D と Button 2D。

Button ノードを使用して、クリック、タップ、またはキーボードのキーを押すことによるインタラクティブな操作を作成します。

Button ノードを使用するを参照してください。

Scroll View 3D と Scroll View 2D。

ユーザー入力や物理ベースのアニメーションからスクロールメッセージを生成する領域を定義するには、Scroll View ノードを使用します。

Scroll View ノードを使用するを参照してください。

Slider 3D と Slider 2D。

最小値と最大値の範囲内で、視覚的なインジケーターを使用してユーザーが数値を変更できるようにするには、Slider ノードを使用します。

Slider ノードを使用するを参照してください。

Text Box 3D と Text Box 2D。

アプリケーションに一行テキスト入力を追加するには、Text Box ノードを使用します。

Text Box ノードを使用するを参照してください。

Toggle Button 3D と Toggle Button 2D。

複数のトグル状態を持つことができるボタンを使ったインタラクティブな操作を作成するには、Toggle Button ノードを使用します。

Toggle Button ノードを使用するを参照してください。

Toggle Button Group 3D と Toggle Button Group 2D。

ユーザーに相互に排他的な複数の選択肢の中から1つだけを選択させるようにするには、Toggle Button Group ノードを使用します。

Toggle Button Group ノードを使用するを参照してください。

レイアウトコントロール (Layout control) ノード¶

Content Layout 3D と Content Layout 2D

Content Layout ノードを使用して、UIコントロール内のコンテンツを単一のアイテムとして表示します。

Content Layout ノードを使用するを参照してください。

Dock Layout 3D と Dock Layout 2D

Dock Layout ノードは、Dock Layout ノードの内枠に沿って互いに相対的な配置を行います。

Dock Layout ノードを使用するを参照してください。

Empty Node 3D と Empty Node 2D

ノードをグループ化するには、Empty Node ノードを使用します。

Empty Node ノードを使用するを参照してください。

Flow Layout 3D と Flow Layout 2D

Flow Layout ノードを使用して、ノードを一列に配置します。行のスペースがなくなると、Flow Layout ノードはその子ノードを新しい行に配置します。

Flow Layout ノードを使用するを参照してください。

Grid Layout 3D と Grid Layout 2D

ノードを格子状に配置するには、Grid Layout ノードを使用します。

Grid Layout ノードを使用するを参照してください。

Stack Layout 3D と Stack Layout 2D

選択した軸方向にノードを並べて配置するには、Stack Layout ノードを使用します。

Stack Layout ノードを使用するを参照してください。

Trajectory Layout 3D と Trajectory Layout 2D

設定された軌跡に沿ってアイテムを配置するには、Trajectory Layout ノードを使用します。

Trajectory Layout ノードを使用するを参照してください。

コンテナコントロールノード¶

Grid List Box 3D と Grid List Box 2D

格子状に配置され、スクロール可能なアイテムのリストを作成するには、Grid List Box ノードを使用します。

Grid List Box ノードを使用するを参照してください。

Trajectory List Box 3D。

3D空間で軌跡に沿って配置されたスクロール可能なアイテムのリストを作成するには、Trajectory List Box 3D ノードを使用します。

Trajectory List Box 3D ノードを使用するを参照してください。

ステージ (Stage) ノード¶

Camera。

Use the Camera node to show the content of a Scene in Kanzi Studio Preview and in your Kanzi application.

Camera ノードを使用するを参照してください。

Instantiator。

Instantiator ノードがターゲットとする 3D ノードまたは 3D ノードツリーの見た目だけを複製するには、Instantiator ノードを使用します。

Instantiator ノードを使用するを参照してください。

Level of Detail。

Use the Level of Detail node when you want to show different appearances of the same object, or different object, based on the viewing distance of the Level of Detail node.

Level of Detail ノードを使用するを参照してください。

Light ノード。

Kanzi アプリケーションの Scene 内にライトを作成するには、ライト (Light) ノードを使用します。

Kanzi には、次のライトノードタイプがあります。

Directional Light は一方向にのみ光を放ち、太陽光のモデリングに適しています。
Point Light は特定の場所からすべての方向 (360 度) に均一に光を放射します。
Spot Light は、特定の位置から特定の方向に、円錐形状の光を放射します。

ライトノードを使用するを参照してください。

Scene。

Kanzi アプリケーションに 3D コンテンツを表示するには、Scene ノードを使用します。

Scene ノードを使用するを参照してください。

クラス階層構造¶

基本クラスは Node です。2Dノードの基本クラスは Node2D で、2Dノードを子ノードとして追加することができます。Node3D は3Dノードに対して同様に機能します。Node クラスは子ノードを接続する手段を持っていないため、Node2D、Node3D、および派生クラスがどのタイプのノードを子ノードとして受け入れるかを定義できます。例えば、Viewport 2D は Node2D クラスから派生しているため、2D子ノードを受け入れますが、Scene タイプの子ノードも1つ受け入れます。このようにして、Kanzi は2Dおよび3Dノードを異種のツリーに配置することができます。

木をイテレーションする場合は Visitor または Abstract Child API を使用します。

ビジターAPIについては、Node::visit または Node::visitDescendants を参照してください。
抽象チャイルドAPIについては、Node::getAbstractChildCountOverride、Node::findAbstractChild、Node::addAbstractChildOverride、および Node::removeAbstractChildOverride を参照してください。

各ノードは親ノードにアクセスできます。親ポインタのタイプは Node です。なぜなら、親のタイプは2Dまたは3Dのいずれかである可能性があるからです。