コンポーネントの配置

第 4 章ユーザーインタフェースの設計

4.1 高レベルUIコンポーネントによるプログラミング

4.1.4 コンポーネントの配置

開発者は、コンポーネントの配置をレイアウトマネージャに任せるか、レイアウトマネージャを無効にして Component クラスの setLocation()メソッドでコンポーネントごとに配置位置を指定するかを選択することができます。

レイアウトマネージャは Panel に設定して使用します。 Panel にレイアウトマネージャを設定するには、Panel.setLayoutManager()メソッドを使用します。

ｉアプリ実行環境で用意されているレイアウトマネージャには、Panel を生成した初期状態で設定されているデフォルトレイアウトマネージャと、 HTML 風の指定方法によりレイアウトを行うための HTML レイアウトマネージャの 2 つがあります。

デフォルトレイアウトマネージャの基本レイアウト方針は、シンプルなフローレイアウトです。パ

ネルに追加されたコンポーネントは画面の左から右に向けて順次横並びに配置されていき、画面の

横幅で収まりきらなくなった時点で次のコンポーネント配置が可能な位置（1 段下の列）へと配置されます。

また HTML レイアウトマネージャでは、コンポーネントを Panel に追加していく過程で改行（BR タグに相当）、段落（P タグに相当）、アライメント（CENTER や DIV タグなどに相当）を指定することで、開発者がより明示的にレイアウトを指示することができます。

どのメーカーの携帯電話にも適用できる汎用的なｉアプリを作成するためには、コンポーネントのレイアウト構成をシンプルに保つことを推奨します。なお、配置可能なコンポーネントの数は、メモリ使用状況や各機種固有の制限などの影響を受けます。

注意事項：

● LayoutManagerインタフェースはメーカーがレイアウトマネージャを実装するために用意されているものであり、開発者が本インタフェースを利用して独自のレイアウトマネージャを作成することはできません。

PanelオブジェクトのsetLayoutManager()メソッドを呼び出すことで、そのPanelが使用するレイアウトマネージャを変更することができます。

● レイアウトマネージャを無効にするには、Panelオブジェクトに対して、パラメータにnullを指定して setLayoutManager()メソッドを呼び出します。レイアウトマネージャを無効にした場合、アプリケーションプログラムは各コンポーネントのsetLocation()メソッドを使用して、コンポーネント毎にそれを配置する位置を指定します。なお、レイアウトマネージャを無効にした場合、機種によってはスクロール機能に制限が発生します。

● 1つのHTMLレイアウトマネージャオブジェクトは、2つ以上のPanelに同時に設定することはできません。

1つのｉアプリの中にHTMLレイアウトを適用したいPanelが複数ある場合には、それぞれのPanelに対し別々のHTMLレイアウトマネージャオブジェクトを割り当てるようにしてください。

● HTMLレイアウトマネージャは、setLayoutManager()メソッドでPanelに設定される度に初期状態（アライメントが左寄せで改行、段落指定のない状態）に戻ります。

次のコードは、 HTML レイアウトマネージャを使用してコンポーネントの配置を行う例を示したものです。

例: HTML レイアウトマネージャによるコンポーネントの配置

import com.nttdocomo.ui.*;

public class HTMLLayoutDemo extends UIDemoPanel {

Label label1, label2, label3, label4;

HTMLLayout lm;

HTMLLayoutDemo() {

label1 = new Label("Label 1");

label2 = new Label("Label 2");

label3 = new Label("CENTER");

label4 = new Label("RIGHT");

// HTMLレイアウトマネージャを生成し、Panelに設定する。

lm = new HTMLLayout();

setLayoutManager(lm);

// レイアウトを指定しつつPanelにLabelを追加する。

add(label1);

//以降のコンポーネントは次行に配置する（BRタグ相当）。

lm.br();

add(label2);

// 以降のコンポーネントは次行に配置する（BRタグ相当）。

lm.br();

// begin()から対応するend()までの間に追加されたコンポーネントを

// 中央寄せで表示する。

lm.begin(HTMLLayout.CENTER);

add(label3);

lm.end();

// begin()から対応するend()までの間に追加されたコンポーネントを

// 右寄せで表示する。

lm.begin(HTMLLayout.RIGHT);

add(label4);

lm.end();

} }

また次のコードは、レイアウトマネージャを無効化して、アプリケーションプログラムが独自にコンポーネントの配置を行う例を示したものです。

例: setLocation()によるコンポーネントの配置

import com.nttdocomo.ui.*;

public class NullLayoutDemo extends UIDemoPanel { Button button1, button2;

Button offScreen;

TextBox text;

Label title, button1Label, button2Label;

NullLayoutDemo() {

// ここですべてのコンポーネントを使用する。

title = new Label("Null Layout ");

button1 = new Button("Button1");

button2 = new Button("Button2");

button1Label = new Label("ONE:");

button2Label = new Label("TWO:");

text = new TextBox("A simple sentence in a textbox", 40, 2, TextBox.DISPLAY_ANY);

* 画面外に配置するコンポーネントの例としてこのボタンを作成する。

offScreen = new Button("This button is never seen");

* ここでレイアウトマネージャにnullを設定する。したがって、個々のコンポー

* ネントの場所を設定する必要がある。注: 物理的な画面の座標外に配置される

* コンポーネントは全く表示されない。nullレイアウトにより、スクロールは無効に

* される場合がある。

setLayoutManager(null);

/* 注: この場合でも、コンポーネントを追加する順序には意味がある。コンポーネントは、

* この順序に従ってフォーカスを与えられる。

add(title);

add(button1Label);

add(button1);

add(button2Label);

add(button2);

add(text);

// このコンポーネントも追加する。

add(offScreen);

* ここで、各コンポーネントの場所を設定する必要がある。つまり、パネルのレイアウト

* を独自に指定する。コンポーネントのサイズは自動的に設定することも、setSizeを * 直接呼び出してサイズを指定することもできる。

title.setLocation(12, 0);

button1Label.setLocation(10, 18);

button1.setLocation(45, 18);

button2Label.setLocation(10, 40);

button2.setLocation(45, 40);

text.setLocation(2, 60);

* 注: このボタンは画面外に配置される。したがって、表示もされないし、フォーカスを

* 得ることもない。

offScreen.setLocation(1000, 1000);

} }

【DoJa-2.0】

HTMLレイアウトマネージャ（HTMLLayoutクラス）はDoJa-2.0プロファイルにて新設されました。

ドキュメント内 iアプリコンテンツ開発ガイド for Doja-5.x/5.x LE ～詳細編～ (ページ 74-77)

第 4 章 ユーザーインタフェースの設計