ドキュメント



JavaFX Scene Builder: ユーザーズ・ガイド

7 ドキュメント・パネルの使用

この章では、JavaFX Scene Builderツールのドキュメント・パネルについて説明します。

図7-1に示すように、ドキュメント・パネルはツールのウィンドウの左側下にあります。「階層」およびコントローラ・セクションで構成されます。メイン・メニューから「表示」を選択してドキュメントの非表示を選択するとドキュメント・パネルを非表示にでき、「左側パネルの非表示」を選択すると「ライブラリ」パネルとともにドキュメント・パネルを非表示にできます。

図7-1 ドキュメント・パネル

レイヤー・パネルが開いているイメージ
「図7-1 ドキュメント・パネル」の説明

「階層」セクション

「階層」セクションには、FXMLレイアウト(「コンテンツ」パネルに表示されない要素を含む)を構成するすべてのGUI要素が表示されます。「階層」パネルを使用すると、特定のGUI要素(親ノードかリーフ・ノードかに関係なく)にフォーカスを置くことができます。要素を特定した後、「コンテンツ」パネルまたは「インスペクタ」パネルを使用して、特定の要素とそのプロパティに対して重点的に作業を行うことができます。GUI要素が「階層」パネルで特定されると、FXMLレイアウトのルートから特定のGUI要素へのパスがパスおよび選択バーに表示されます。選択したGUIオブジェクトは、「階層」パネルおよび「コンテンツ」パネルで強調表示されます。

GUI要素を「ライブラリ」パネルから「階層」パネル内の目的の場所にドラッグすることによって、新しいGUI要素をFXMLレイアウトに追加することもできます。これは、Tooltip、ContextMenuなどのポップアップ・コントロールを追加する場合に特に役立ちます。たとえば、TooltipをButton要素を追加するには、Tooltipコントロールを「ライブラリ」パネルから「階層」パネル内の目的のButton要素にドラッグします。TooltipはそのButton要素の子になります。

レイアウト内のGUI要素の位置は、「階層」パネル内のコンテナの内外にGUI要素をドラッグして変更できます。「階層」パネルで複数の要素を一度に選択して、1つの場所にドラッグ・アンド・ドロップできます。

「階層」パネルは、グラフィック・プロパティがあるGUI要素にグラフィック要素をAPIごとに追加する場合にも役立ちます。たとえば、グラフィック要素は、GridPane要素ではなくButton要素に追加できます。「階層」パネルを使用して、Button要素に円グラフィック要素を追加するには、次の手順を実行します。

  1. 「ライブラリ」パネルから、「階層」パネル内の目的のボタン・レイヤーにCircle要素をドラッグします。

  2. マウス・カーソルをリリースせずに、少しの間ボタン・レイヤー上にカーソルを置くと、Circleのために新しいサブレイヤーが作成されます。

  3. マウス・カーソルをリリースすると、円が「コンテンツ」パネル内に表示され、デフォルトの半径サイズが100に設定されます。

  4. 「インスペクタ」パネルの「レイアウト」セクションで円の半径サイズを6に縮小すると、ボタン内に円が適切に収まります。
    どの時点でも、1つのButton要素に追加できるグラフィック要素は1つのみです。新しいグラフィックを追加するには、最初に既存のグラフィックを削除する必要があります。要素がコンテナの場合は、任意の数のグラフィック要素を含めることができます。

図7-2に示すように、「コンテンツ」パネル内の要素、または「階層」パネル内の特定の要素レイヤーを右クリックすると、コンテキスト・メニューが表示され、選択されている要素で使用できるコマンドが表示されます。これらのコマンドは、メニュー・バーから使用可能なコマンドのサブセットです。「階層」パネルにリストされているGUI要素の行の右側をクリックすると、インライン・プロパティ・エディタをアクティブ化できます。

図7-2 コマンドのドロップダウン・リストが表示された「階層」パネル

図7-2の説明が続きます
「図7-2 コマンドのドロップダウン・リストが表示された「階層」パネル」の説明

図7-3の右上隅にある円で囲まれたドロップダウン矢印をクリックし、階層に表示を選択すると、「情報」fx:idまたは「ノードID」を選択して、「階層」パネルにリストされた各要素の横に表示できます。デフォルトの表示モードは「情報」で、要素の関連情報が表示されます。または、要素にテキスト・プロパティがある場合は、テキスト・プロパティ値が表示されます。fx:id表示モードでは、アプリケーション・コントローラ・クラスで使用される各要素のfx:idプロパティの値が表示されます。「ノードID」を選択すると、「階層」パネルには各要素の選択バーで使用されるのと同じノード名が表示されます。

図7-3 ドキュメント・パネルの階層に表示メニュー

図7-3の説明が続きます
「図7-3 ドキュメント・パネルの階層に表示メニュー」の説明

コントローラ・セクション

図7-4に示すように、コントローラ・セクションでは、FXMLドキュメントで使用するコントローラ・クラスを管理できます。コントローラ・クラスによって、FXMLレイアウト内のオブジェクトの動作を処理するロジックが提供されます。「コントローラ・クラス」テキスト・フィールドに、使用するコントローラ・クラス・ファイルのJavaクラスの完全修飾名を設定します。このファイルは、FXMLファイルが配置されているのと同じフォルダ、サブフォルダまたは親フォルダ内にある必要があります。作業中のFXMLファイルと同じフォルダ内にコントローラ・クラス・ファイルはすでに存在する場合は、図7-4で円で囲まれている下矢印をクリックして、ドロップダウン・リストからコントローラ・クラスを選択できます。JavaFX Scene BuilderとともにNetBeans IDEを使用し、FXMLファイルがNetBeansプロジェクト内に配置されている場合、コントローラ・クラスのJavaファイルは、NetBeansプロジェクトのsrcフォルダ内のJavaパッケージに配置できます。

FXMLドキュメントで使用されるすべてのfx:id値のリストが表形式で表示されます。また、コントローラ・セクションには、事前に定義されたルート要素への参照を作成するfx:root構成チェック・ボックスもあります。<fx:root>要素の詳細は、JavaFX APIドキュメントを参照してください。

図7-4 ドキュメント・パネルのコントローラ・セクション

図7-4の説明が続きます
「図7-4 ドキュメント・パネルのコントローラ・セクション」の説明

ウィンドウを閉じる

目次

JavaFX Scene Builder: ユーザーズ・ガイド

展開 | 縮小