レイアウト1 ( rowLayout )

レイアウトとは

GUIにおいて部品(ボタンなど)を配置(レイアウト)してゆく場合、レイアウトコマンドによって行なう。
これまでは columnLayout によって縦1列に部品を並べていったが、 それ以外の配置をする場合には、そのためのレイアウト(コマンド)を使用する。

レイアウトの種類

レイアウト(コマンド)には以下のような種類がある。

columnLayout
部品を縦1列に並べるレイアウト。
rowLayout
部品を横1列に並べるレイアウト。
rowColumnLayout
部品を縦・横に並べるレイアウト。
formLayout
部品を絶対的・相対的な位置指定で並べるレイアウト。
frameLayout
部品に枠(フレーム)をつけて表示する。
gridLayout
部品を同じ大きさのセルに入れて表示する。
menuBarLayout
部品にメニューバーをつけて表示する。
paneLayout
子どもの部品を様々な方向で分割して表示する。
scrollLayout
スクロール付で部品を表示する。
shelfLayout
シェルフレイアウトを作る。
shelfTabLayout
シェルレイアウトを作る。
tabLayout
タブを作る。

複数のレイアウト

レイアウトの中にレイアウトを入れ子にして実行してゆくこともできる。
そうすることによって複雑な部品の配置を実現できるようになる。
その場合に setParent ..; によってどこまでが特定のレイアウトの範囲なのかを決めてゆく。

複数のレイアウトの例

レイアウトによってボタンを縦・横に並べる GUI を作ってみよう。
GUIの部品を横に並べるためには rowLayout などを使用する。

  1. 以下の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;
  2. Script Editorの File → Source Script によって layout1.mel を読み込む。
  3. 以下のようなウインドウが表示される。
    (各ボタンにはコマンドを割り当てていないので押しても何も実行されない。)
    [layout1.melの実行結果]

スクリプトの解説

window -title "layout1";
layout1 というタイトルのついたウインドウを作る。
columnLayout;
columnLayout によって、これ以降のコマンドは縦に並んでゆく。
これ以後の部品は縦 1 列に並んでゆく。
button -label "A";
A というラベルのついたボタン。
rowLayout -numberOfColumns 2 -columnWidth2 20 20;
rowLayout コマンドにより、これ以後の部品は横 1 列に並んでゆく。
-numberOfColumn
横に何個の部品を並べるかを指定する。
-columnWidth2
各部品を並べる間隔の指定である。(2 個の場合)
button -label "B";
B というラベルのついたボタン。
button -label "C";
C というラベルのついたボタン。
rowLayout コマンドの有効範囲なので B ボタンの横に並ぶ。
setParent ..;
rowLayout の有効範囲の終り。
これ以後は columnLayout が有効なので、部品は縦1列に並ぶ。
button -label "D";
D というラベルのついたボタン。
ここは columnLayout の有効範囲なのでボタンは縦に並ぶ。
rowLayout -numberOfColumns 3 -columnWidth3 20 20 20;
rowLayout コマンドにより、これ以後の部品は横 1 列に並んでゆく。
各部品の間隔を指定するために、部品が3個の場合は -columnWidth3 を使用する。
button -label "E";
E というラベルのついたボタン。
button -label "F";
F というラベルのついたボタン。
rowLayout コマンドの有効範囲なのでEボタンの横に並ぶ。
button -label "G";
G というラベルのついたボタン。
rowLayout コマンドの有効範囲なのでFボタンの横に並ぶ。
setParent ..;
rowLayout の有効範囲の終り。
これ以後は columnLayout が有効なので、部品は縦1列に並ぶ。
showWindow;
ウインドウを表示する。
[layout1.mel のレイアウト構成図]

練習

まとめ

練習課題

参考

Prev
Home | Contents
Mail