2012年2月25日土曜日

【Forest君用】Hello World その3

「Hello Android!」アプリの画面レイアウトを定義する
xmlファイルを見ていきます。

res/layout内にあるmain.xmlを開くと次の様に表示されます。


見覚えのある画面ですね。
これをみるとこの"main.xml"で画面が設定されていることが良くわかるはずです。

eclipseでは、レイアウトを定義するxmlについては、
デフォルトで"Graphical layout"で表示されます。
これはGUI(グラフィカルユーザインターフェース)を用いて
視覚的、直感的にレイアウトを生成できるようにするためです。
基本的にはこれを使って作成してもいいですが、実体は知っておきましょう。

画面の下のほうに「main.xml」タブがあると思うので、そこをクリックします。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/hello" />

</LinearLayout>

さっきまで見ていた画面はこの文字列で定義されています。
ここについても突き詰めると難しくなりますので、簡単に説明します。

まず2行目の"LinearLayout"。
これはViewという画面を構成する要素を縦、または横に配置していくレイアウトです。
2行目~5行目で"LinearLayout"自身の定義。
12行目で"LinearLayout"の終了を意味します。
つまりそれに囲まれた部分(6行目~11行目)に記載されているのがView要素となります。

7行目がView要素である"TextView"。
読んで字のごとくテキストを扱うViewです。
ここで定義した文字列が画面に表示されます。

大枠はこんなところです。
続いて、それぞれの定義について説明します。

まずは"LinearLayout"ですが、
3行目と4行目で縦、横の幅の設定がされています。
ともに"fill_parent"となっていますので親layoutに合わせるという事です。
(ここでは親となるlayoutがないので、画面をフルで使用します)
5行目でViewを追加する方向を指定します。
"vertical"なら縦、"horizontal"なら横です。

次に"TextView"。
8行目と9行目は縦、横の幅の設定。
(LinearLayoutと一緒ですね)
10行目で画面に表示するテキストを設定します。
ここで疑問に思う方もいるかもしれません。
"Hello World, HelloAndroidActivity!"じゃなくて"@string/hello"が設定されてるよ、と。
これはstrings.xmlの"hello"で定義された文字列を設定することを意味しています。
strings.xmlはres/values内にありますので見てみてください。
ちゃんと定義されています。
<string name="hello">Hello World, HelloAndroidActivity!</string>

勿論、10行目で直接"Hello World, HelloAndroidActivity!"と記述することで
同じ結果が得られますが、こういったハードコーディングは非推奨の為、
xmlファイルで管理されています。
固定文言は極力strings.xmlに記述するようにしましょう。

以上です。
今回の内容の理解を深める為に、暇があったら次のことを試してみるといいかもしれません。

  1. TextView(7行目~10行目)をコピーして、11行目に張り付け
  2. 上記1.を行ったうえで、LinearLayoutの "vertical"⇒"horizontal"へ変更

次回はTextViewを動的に設定する方法でもしてみようかな~

0 件のコメント:

コメントを投稿