コラム
TOP >  コラム >  コラム詳細

Androidアプリのツボ  第2回 : テキスト表示とレイアウト
Qbookをご覧の皆様こんにちは。

「Hello World」も無事に表示できましたので、今回は様々な位置に様々なテキストを表示してみます。



■様々なテキストの表示



前回と同様に、プロジェクトを作成します。

テキストビューの確認ですので、プロジェクト名は「TextViewSample」としておきます。

「Graphical Layout」を利用することで簡単に画面にTextViewを配置するこができます。

XMLからも指定できますが、今回は、GUIから設定します。

オブジェクトを配置するには、パレットの「Form Widgets」から「TextView」をマウスでドラッグアンドドロップするだけでOKです。

「TextView」のサイズは選択しているオブジェクトの青い枠のサイズをマウスで変更するか、プロパティで変更できます。

また、プロパティで文字サイズや、文字の配置、スタイルなども設定できます。

よく使う配置の設定や、色、サイズなどを指定するプロパティについては、図1に整理しました。


著者:金谷 伸二
1989年にソフトウェア業界に入り業務系のシステム設計や構築に携わり、2002年 に有限会社ケーズシステムを設立。 Webシステム、データベース、組込ソフト、iPhone・アンドロイドアプリケー ションなどを手掛け安定した製品を世の中に提供することを目標に開発者として 新たな発見と失敗を繰り返しています。 苦しみは笑いながら乗り越えるタイプ。趣味は、自転車。
1. text
 表示テキストを設定します。

2. textsize
 テキストサイズをピクセルで指定します。20ピクセルの場合、20px

3. background
 背景色を16進で指定します。(例. 白色:#ffffff、赤色:#ff0000)

4. textColor
 テキストの色を16進で指定します。

5. gravity
 文字の配置を指定します。TextView内での配置の指定を行います。

6. layout_marginTop
 ViewのTopからのマージンをピクセル(非密度依存)で指定します。
(例. 10ピクセルの場合:10dipまたは10dp)

7. layout_marginBottom
 ViewのTopからのマージンをピクセル(非密度依存)で指定します。

8. layout_width
 Viewの幅を直接ピクセルで指定するか、画面サイズや、文字列長に合わせることもできます。
 - full_parent 親のLinearLayoutの幅と同じ
 - mach_parent 親のLinearLayoutの幅と同じ
 - warp_content textの文字列長に合わせる
 - 200ピクセルの場合:200pxまたは200dp

9. layout_height
 Viewの高さを直接ピクセルで指定するか、画面サイズや、文字列長に合わせることもできます。
 ※layout_widthの設定と同じ内容

10. layout_gravity
 文字の配置を指定します。ここでの指定は、レイアウトの位置指定を行います。

11. layout_width
 TextViewの表示幅を設定します。
図1 プロパティの説明図


では、実際に配置してみます。

コーディングしなくても、プロパティの設定はGUIで設定した値がそのままXMLに記述されます。

Graphical Layoutをmain.xmlに切り替えてみて下さい。

図2のような画面に切り替わり、XMLが表示されます。

図2 main.xmlの画面


定義内容を少し見ていきましょう。

先頭の赤い left と表示している部分のプロパティにbackground="#ff800000" と表示されています。

これが背景色を赤色にしている設定です。

gravity="left" は文字を左寄せで表示するという意味です。

以降の表示設定も確認していくと、位置や背景色の設定は理解していただけると思います。

では、これを実機で確認してみましょう。

ここまでの範囲で、各機種に差が出てくるのは画面サイズでの差だけです。

それ以外に差があった場合は、何かの不具合を作り込んでしまっています。

問題が無いかどうかを確認します。

画面サイズの異なる2機種で表示してみます。

図3 Mediasの縦画面(左)、EVO WiMAX ISW11HTの縦画面(右)


ご覧のとおり、表示の差異が出ます。

その他の差異は見当たりませんね。

画面レイアウトの設計は、特定企業向けシステムなど使用対象機種を限定する場合はピッタリのサイズ設計が可能ですが、対象機種が絞れない場合は、現時点で発表されている最小サイズと最大サイズは考慮する必要が出てきますね。

アンドロイドアプリの開発で設計者が頭を悩ませるひとつです。

基本的にはスクロールを行うことを前提に設計します。

そのほか、実機は縦向き、横向きでも使いますよね。

特にソフトキーボードでは、 入力方法が楽な方向に持ち替えます。

ではこのアプリを横向きで実行した場合、どうなるでしょうか?


1| 2

>

>>



第1回 第3回


連載一覧

1| 2| 3

>

>>