レイアウト1 ( rowLayout )
レイアウトとは
ウインドウを作って部品(ボタンなど)を配置(レイアウト)してゆく場合にはレイアウトコマンドが必要です。
これまでは columnLayout によって縦 1 列に部品を並べていきましたが、
それ以外の配置をする場合には、そのためのレイアウトコマンドを使用します。
レイアウトの種類
レイアウトコマンドには以下のような種類があります。
- columnLayout
- 部品を縦 1 列に並べるレイアウト
- rowLayout
- 部品を横 1 列に並べるレイアウト
- rowColumnLayout
- 部品を縦・横に並べるレイアウト
- formLayout
- 部品を絶対的・相対的な位置指定で並べるレイアウト
- frameLayout
- 部品に枠(フレーム)をつけて表示するレイアウト
- gridLayout
- 部品を同じ大きさのセルに入れて表示するレイアウト
- menuBarLayout
- 部品にメニューバーをつけて表示するレイアウト
- paneLayout
- 子どもの部品を様々な方向で分割して表示するレイアウト
- scrollLayout
- スクロール付で部品を表示するレイアウト
- shelfLayout
- シェルフレイアウト
- shelfTabLayout
- シェルフタブレイアウト
- tabLayout
- タブレイアウト
サンプルプログラムと図は
Layoutの一覧
を参照してください。
複数のレイアウト
いままでは columnLayout のような単純なレイアウトだけでしたが、
ひとつのレイアウトだけではできないような複雑なレイアウトを実現するためには
どうしたら良いでしょうか。
実はレイアウトは入れ子にすることができるので、
いくらでも複雑なレイアウトを作ることができるようになっています。
ただその場合には、どこまでがレイアウトの範囲なのかを決めなければなりません。
ウインドウ上の部品は必ずある 1 つのレイアウトの範囲内にある必要があるからです。
そのためのコマンドとして setParent ..; を使用して、
どこまでが特定のレイアウトの範囲なのかを決めてゆきます。
複数のレイアウトの例
レイアウトによってボタンを縦・横に並べる GUI を作ってみましょう。
ここではウインドウの部品を横に並べるために rowLayout を使用してみます。
なお、このスクリプトはレイアウトの練習なので各ボタンを押しても何も実行しません。
- 以下の MEL スクリプトを layout1.mel という名前で作ります。
window -title "layout1";
columnLayout;
button -label "A";
rowLayout -numberOfColumns 2 -columnWidth2 20 20;
button -label "B";
button -label "C";
setParent ..;
button -label "D";
rowLayout -numberOfColumns 3 -columnWidth3 20 20 20;
button -label "E";
button -label "F";
button -label "G";
setParent ..;
showWindow;
- スクリプト エディタ の によって layout1.mel を読み込みます。
- 以下のようなウインドウが表示されます。
スクリプトの解説
-
window -title "layout1";
- layout1 というタイトルのついたウインドウを作ります。
-
columnLayout;
- このコマンドによって、これ以降に作られる部品は縦に並んでゆきます。
-
button -label "A";
- A というラベルのついたボタンを作ります。
-
rowLayout -numberOfColumns 2 -columnWidth2 20 20;
このコマンドにより、これ以後作られる部品は横 1 列に並んでゆきます。
各フラグの意味は以下の通りです。
- -numberOfColumn 2
- 横に何個の部品を並べるかを指定します。
- -columnWidth2 20 20
- 各部品を並べる間隔の指定です。(2 個の場合)
この場合、B・C ボタンがそれぞれ 20 ピクセル幅の範囲にレイアウトされます。
3 個の部品を並べる場合には代わりに
-columnWidth3
を使用します。
-
button -label "B";
- B というラベルのついたボタンを作ります。
-
button -label "C";
- C というラベルのついたボタンを作ります。
rowLayout コマンドの有効範囲なので B ボタンの横に並びます。
-
setParent ..;
- rowLayout の有効範囲の終りです。
これ以後は columnLayout が有効になるので、これ以降は部品が縦に並びます。
-
button -label "D";
- D というラベルのついたボタン作ります。
ここは columnLayout の有効範囲なのでボタンは縦に並びます。
-
rowLayout -numberOfColumns 3 -columnWidth3 20 20 20;
- このコマンドにより、これ以後作られた部品は横 1 列に並んでゆきます。
- -numberOfColumn 3
- 横に何個の部品を並べるかを指定します。
- -columnWidth3 20 20 20
- 各部品を並べる間隔の指定です。(3 個の場合)
この場合、E・F・G ボタンがそれぞれ 20 ピクセル幅の範囲にレイアウトされます。
-
button -label "E";
- E というラベルのついたボタンを作ります。
-
button -label "F";
- F というラベルのついたボタンを作ります。
rowLayout コマンドの有効範囲なので E ボタンの横に並びます。
-
button -label "G";
- G というラベルのついたボタン作ります。
rowLayout コマンドの有効範囲なので F ボタンの横に並びます。
-
setParent ..;
- rowLayout の有効範囲の終りです。
これ以後は columnLayout が有効なので、部品は縦に並びます。
-
showWindow;
- ウインドウを表示します。
練習
- layout1.mel を参考にして layout2.mel を作り、以下のようにボタンが並ぶようなレイアウトにしてください。
- 前回の GUI による項目の選択(ラジオボタン) の makePrimitive1.mel を参考にして layout3.mel を作り、以下のようなレイアウトに変更してください。
まとめ
- 複雑なレイアウトを実現したい場合は、 複数のレイアウトを組み合わせます。
- rowLayout は部品を横に並べるレイアウトコマンドです。
columnLayout コマンドと組み合わせることによって、
部品を縦・横に並べてゆくことができます。
- あるレイアウトの有効範囲を決めるためには setParent コマンドを使用します。
参考
Prev | Next
Home | Contents
Mail