コンポーネントとイベントリスナーを使う (4/6)

実行すると、Labelの下にTextBoxが表示されるようになります。また、どちらもセンタリングされ画面の中央に表示されます。HTMLLayoutにより、表示が調整されているのがわかるでしょう。

このHTMLLayoutは、コンポーネントの位置揃え（左揃え・中央揃え・右揃え）と改行を行いながらレイアウトを作成していくレイアウトマネージャです。このレイアウトマネージャを利用するためには、インスタンスを作成し、それをPanelにレイアウトマネージャとして競っていてやります。

HTMLLayout layout = new HTMLLayout();
this.setLayoutManager(layout);

MainPanelのコンストラクタでは、このようにしていますね。これにより、HTMLLayoutが使えるようになります。後は、HTMLLayoutのメソッドを使って、レイアウトの設定をしながらコンポーネントを組み込んでいくだけです。

HTMLLayoutのレイアウト機能は、大きく整理すると２つあります。１つは「位置揃え」の指定（左揃え・中央揃え・右揃えのいずれか）です。これは、「begin」というメソッドを使って位置揃えを開始し、それからコンポーネントを組み込み、最後に「end」メソッドを実行します。すると、beginからendまでの間にaddで組み込んだコンポーネントが、指定した位置揃えで表示されるようになります。

もう１つは「改行」の指定です。これは非常に簡単で、「br」というメソッドを呼び出すだけです。すると、その後にaddするコンポーネントは、brの前のコンポーネントの次の行に表示されるようになります。

layout.begin(HTMLLayout.CENTER);
this.add(label);
layout.br();
this.add(text);
layout.end();

ここでの処理を見てみると、まずbeginで位置揃えを開始しています。引数には「HTMLLayout.CENTER」というものが指定されていますね。これは中央揃えを示す値です。同様に、左揃え・右揃えを示す値（LEFT、RIGHT）もHTMLLayoutにクラスフィールドとして用意されています。

addでLabelを組み込んだ後、brを実行し、更にTextBoxをaddしています。こうすることで、Labelの後、改行してTextBoxが表示されるようになります。そしてコンポーネントの組み込みが終わったところで、endを呼び出して位置揃えの指定を完了します。

この「begin」と「end」は、HTMLの開始タグと終了タグを想像するとわかりやすいでしょう。つまり、中央揃えなら、beginで<center>を追加し、その後addで必要なタグを書き出して、最後にendで</center>タグを追加する――というようにイメージすると、その働きがよく理解できるでしょう。

(by. SYODA-Tuyano.)

※リストが表示されない場合

AddBlockなどの広告ブロックツールがONになっているとリストなどが表示されない場合があります。これらのツールをOFFにしてみてください。

HTMLLayout layout = new HTMLLayout();
this.setLayoutManager(layout);
layout.begin(HTMLLayout.CENTER);
this.add(label);
layout.br();
this.add(text);
layout.end();