grid ジオメトリマネージャ

grid は親オブジェクト上に格子状にウィジェットを並べるための，ジオメトリマネージャです．工夫次第でpackよりも見栄えの良いレイアウトが可能になります．

■ rowとcolumn

gridのもっとも基本的なオプションです．-row (行)，-column (列)で何行何列目に配置するかを0から数えた整数で指定します．例えば，ボタン$butに対して，

$but -> grid(-row=>1, -column=>2);

は$butを2行3列目に配置します．下の例は，３ｘ４の行列状にボタンを並べます．

#!/usr/bin/perl -w
use Tk;

$mw = MainWindow->new;

for($i=0; $i<3; $i++) {
  for ($j=0; $j<4; $j++) {
     $mw->Button(-text=>"Button$i$j")
       -> grid(-row=>$i,
               -column=>$j
               );
  }
}

MainLoop;
#---
#grid.pl

■ rowspan と columnspan

rowspanとcolumnspanはgridの特定のウィジェットで複数の行または列を使いたい時に用います．例えば，

$but -> grid(-row=>1, -column=>2, -rowspan=>2);

は$butを2行3列目に配置し二行分のスペースを使います．

ここまでのgridオプションを駆使すれば大概のレイアウトは出来てしまいます．しかし，ウィジェット数が多くなってくると，何行目何列目かわけがわからなくなってきます．方眼紙などの紙に，レイアウトの設計図を書いてみるのも良いかもしれません．

Introductionで用いたサンプルdoremi.pl をgrid を使って格好良くしてみましょう．

#!/usr/bin/perl -w

use Tk;

%doremi = (
            "ド",     "ドはドーナツのド",
            "レ",     "レはレモンのレ",
            "ミ",     "ミはみんなのミ",
            "ファ",   "ファはファイトのファ",
            "ソ",     "ソは青い空",
            "ラ",     "ラはラッパのラ",
            "シ",     "シは幸せよ"
            );
@bgcolor = qw/red orange yellow green cyan blue purple/;

$msg = "歌いましょう!! 右のボタンを押してください";

$mw = MainWindow->new;
$mw->title('Do-re-mi');

$mw->Label(-text=>"Perl/Tkラクダのドレミ",
           -relief=> 'ridge',
           -padx => 5,
           -pady => 5,
           -anchor=> 'nw',
           -foreground => 'red')
    ->grid(-row =>0,
           -column =>0,
           -columnspan=>8);

$mw->Button(-text => "終了",
           -command => sub { exit; }
           )
    ->grid(-row=>4,
           -column=> 0,
           -columnspan=>8);

$mw->Label(-image=> $mw->Photo(-file=>'Xcamel.gif'),
           -borderwidth=>3,
           -relief=> 'sunken')
    ->grid(-row=>1,
           -column=> 0,
           -rowspan=>3);

$mw->Label(-textvariable => \$msg,
           -anchor=> 'w',
           -background=> 'white',
           -relief=>'sunken',
           -width => 40
           )
   -> grid(-row=>1,
           -column=>1,
           -columnspan=>7);

$col=1;
foreach $i (qw/ド レ ミ ファ ソ ラ シ/){
   $mw->Button(-text=> $i,
               -width=> 3,
               -background => shift(@bgcolor),
               -command => [ \&Sing_msg, $i ]
              )
   -> grid(-row=>2,
           -column=>$col);
   $col++;
}

MainLoop;

sub Sing_msg {
    my $key = $_[0];
    $msg = "♪ ".$doremi{$key}." ♪";
}

#----
#doremi_grid.pl

■ sticky

gridは，配置するウィジェットの大小にかかわらず，順番に格子状に並べます．従って，例えば，大きいウィジェットの下に来る小さいウィジェットは，必然的に余分な隙間が開いてしまいます．

packでは-fillと-expandを使いましたが，gridではこれらはありません．その代わりに，stickyというオプションを使います．stickyはオプション値として'n', 'e', 'w', 's' (以前のanchorの時の解釈と同じ)の組み合わせを取り，指定された方向に可能な限りウィジェットを引き伸ばします．良く使うのは，

->grid(..., -sticky=>'news');

で，全方向の隙間を詰めます．覚えておきましょう．先ほどのリストにstickyオプションを加えてみましょう．

■ 相対配置

-row, -column で格子点の絶対値を指定する以外に，相対的に配置する方法も用意されています．行ごとに互いの縦横の関係を並べるものです．

$but00->grid($but01,    '-', $but03, -sticky=>'news');
$but10->grid(   '^', $but12,    'x', -sticky=>'news');

- は，左のウィジェットをcolumnspan，^ は，上のウィジェットをrowspan，xは空白です．

■ その他のオプション・メソッド

padx, pady, ipadx, ipady がpackと同じように使用できます．また，gridに関するメソッドがいくつか用意されていますが，ここでは説明しません．詳しくは，Quick Referenceのgridを参照してください．

■ おさらい