SyntaxHighlighter

2010年9月27日月曜日

Android解説 layout その3

Android layout 

Layout(レイアウト)

今まで、作成した項目は縦に並んでいますが、これはデフォルト設定がそうなっているためです。横に並べるためには、以下の手順で行います。

レイアウトタブのレイアウトからLinearLayoutを黒い画面にドラッグします。










「名前」の項目を横に並べて見ましょう。
main.xmlを開くとタグができていますので、下記ソースを参考にして、TextViewEditTextをはさむように修正してください。
<LinearLayout android:id="@+id/LinearLayout01"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content">
       <TextView android:text="名前:"
                     android:id="@+id/label_name"
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content">
       TextView>
       <EditText android:text="名前を入力してください。"
                     android:id="@+id/text_name"
                     android:layout_width="fill_parent"> ←変更
                     android:layout_height="wrap_content">
       EditText>
LinearLayout>
このソースに下記1行を追加します。また「LinearLayout01」も修正します。
<LinearLayout android:id="@+id/layout_name"
              android:orientation="horizontal" ←追加
android:layout_width="wrap_content"
              android:layout_height="wrap_content"

ソース解説
まず、今まで無視してきましたが、タグを作成すると、必ず生成されている2行についてです。
android:layout_width          横の長さ。
android:layout_height         縦の長さ。
を表しています。指定する値としては直接「数値」とすることもできます。
ほかに下記の指定方法があります。
fill_parent           横幅いっぱい。 (古い表現でmatch_parent
wrap_content          内容の長さに合わせる。

ちなみに、android:layout_width = “wrap_content”の状態で android:text="名前を入力してください。"android:text=""とすると表示されるテキストボックスは1文字分の大きさになります。横幅を画面いっぱいにするためにはandroid:layout_width = “fill_parent ”にします。

ほかにもテーブルレイアウトとかいろいろな設定があります。これらについてはまた機会をみて解説したいと思います。下図に実行結果を示します。
今回は性別のところも修正していますので、その部分のソースも参考にしてください。

     性別の部分のレイアウトです。結構長いソースになってしまいました。
<RadioGroup android:id="@+id/rg_sex"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content" 
       android:orientation="horizontal">   ←横に並べる指定を追加
       <TextView android:text="性別:"     ←タイトル追加
              android:id="@+id/label_sex"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content">
       TextView>
       <RadioButton android:text="男性"
              android:id="@+id/rb_man"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content">
       RadioButton>
       <RadioButton android:text="女性"
              android:id="@+id/rb_woman"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content">
       RadioButton>
RadioGroup>


次回はいよいよ(やっと?)入力内容を受け取るプログラムになります。

注意として「EditText>」のように"<"と"/"がソース上なくなっています。
このソースをコピー貼り付けして実行するとエラーとなります。
適宜"<"と"/"を追加してください。

0 件のコメント:

コメントを投稿