Road to JavaFX 01 / Paneについて学ぶ(1)
Road to JavaFX!
JavaFXに関連する話題が思っていたよりも好評で、 友人からの反響が良かったので(不)定期連載を始めることにしました。
Road to JavaFX (JavaFXへの道) ということで、今回からJavaFX関係について 少しずつ掘り下げて行こう、という内容です。
前回の入門記事を踏まえての内容となりますので、「JavaFXについてまだ使ったことがない」、「その辺のチュートリアルはやってみたけど、FXMLとか良く分からなかった」という方はこちらの記事を読んでいただけると幸いです。
本連載では極力Java初心者の方でもわかるような記法を用いるように心がけますが、 途中で恐らくラムダ式などの話が出てくると思います。その際は別途解説記事を用意しますのでご安心ください。
Paneによるレイアウトの定義
JavaFXではPane(ペイン)というものがあり、これを配置・中に要素(ノード)を入れることによって縦並び・横並びといった画面上のレイアウトを定義することができます。
絶対座標で直接指定するのではなくレイアウトとして定義することによって、画面サイズが拡大・縮小されたとしても表示が自動的にいい感じになってくれます。
HBox / VBox
HBox (Horizontal Box) とVBox (Vertical Box) は最もシンプルな形のPaneです。HBoxは子ノードを水平(横方向)に並べていき、VBoxは子ノードを垂直(縦方向)に並べていきます。それだけです。
HBox
HBoxを使ったサンプルコードと実行結果は以下の通りです。
22行目の部分で作ったボタンをHBoxの子ノードとして取っています。addAllメソッドを使うことによって複数個のノードを一気に子ノードにしています。
HBoxの横に並らべる順は、HBoxに子ノードとして渡した順番に並んでいく形になっています。今回はb1,b2,b3の順で入れているので以上のような実行結果になっています。
VBox
VBoxを使ったサンプルコードと実行結果は以下の通りです。
HBoxとプログラムはほとんど同じです。変わっているのはHをVにしたぐらいです。
FlowPane
FlowPaneは子ノードを画面の端まで並べていき、端まで行ったら折り返して再度子ノードを同じように並べていき…というレイアウトです。
デフォルトでは横方向に並べていき、端までいくと次の段から並べていく形ですが、縦方向に並べていき、端まで行くと次の列から並べていくという挙動に変更することも可能です。
サンプルプログラムと実行結果を見てます。
適宜ウィンドウサイズを拡大・縮小して確認してみると良いです。
HBox同様横方向に並べていくか・VBox同様縦方向に並べていくかの指定については、25,26行目がちょうどそのプログラムに当たります。コンストラクタにどっち並べにするかの情報を渡しています。
子ノードの指定のやり方に関してはHBox / VBoxと同様なので特に問題はないと思います。
BorderPane
BorderPaneは上・下・左・右および中央のそれぞれにノードを配置することのできるPaneです。…といっても分かりにくいので、とりあえず前述のJavaのドキュメントの方にどんな感じのレイアウトになるかの画像がありますのでそちらを見ることをお勧めします。
サンプルプログラムと実行結果を見てみます。
BorderPaneではただ子ノードを持つだけでなく、どこに配置するかを定義しなければならないのでsetTop, setBottom, setLeft…といったメソッドを使って配置を決めると同時に子ノードを渡します。
まとめ
今回は4つのPaneについて見てきました。本当はまだまだあるのですが、記事が長くなってきてしまったので次回紹介したいと思います。
ではでは。
