androidでベーシックなコントローラ配置を学ぶ

今回の教科書

すいすい進んでいいね。おすすめできる

ラベルを表示

layout/activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#A1A9BA"
    android:orientation="vertical">

    <TextView
        android:id="@+id/tvLabel"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:layout_marginTop="5dp"
        android:text="@string/tv_msg"/>

</LinearLayout>

確認

EditTextを追加

layout/activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#A1A9BA"
    android:orientation="vertical">

    <TextView
        android:id="@+id/tvLabel"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:layout_marginTop="5dp"
        android:text="@string/tv_msg"/>

+   <EditText
+       android:id="@+id/etInput"
+       android:layout_width="match_parent"
+       android:layout_height="wrap_content"
+       android:layout_marginBottom="25dp"
+       android:layout_marginTop="5dp"
+       android:inputType="text" />

</LinearLayout>

確認

下に出てきた入力UIはもともとandroidが用意してくれているもの

ボタンを追加

layout/activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#A1A9BA"
    android:orientation="vertical">

    <TextView
        android:id="@+id/tvLabel"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:layout_marginTop="5dp"
        android:text="@string/tv_msg"/>

    <EditText
        android:id="@+id/etInput"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="25dp"
        android:layout_marginTop="5dp"
        android:inputType="text" />

+   <Button
+       android:id="@+id/btSave"
+       android:layout_width="wrap_content"
+       android:layout_height="wrap_content"
+       android:text="@string/bt_save"/>

</LinearLayout>

確認

リニアレイアウトを入れ子にする

layout/activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#A1A9BA"
    android:orientation="vertical">

    <TextView
        android:id="@+id/tvLabel"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:layout_marginTop="5dp"
        android:text="@string/tv_msg"/>

    <EditText
        android:id="@+id/etInput"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="25dp"
        android:layout_marginTop="5dp"
        android:inputType="text" />

+   <LinearLayout
+       android:layout_width="match_parent"
+       android:layout_height="wrap_content"
+       android:orientation="horizontal">
+       <CheckBox
+           android:id="@+id/cbDrink"
+           android:layout_width="wrap_content"
+           android:layout_height="wrap_content"
+           android:layout_marginEnd="25dp"
+           android:text="@string/cb_drink"/>
+       <CheckBox
+           android:id="@+id/cbFood"
+           android:layout_width="wrap_content"
+           android:layout_height="wrap_content"
+           android:text="@string/cb_food"/>
+   </LinearLayout>

    <Button
        android:id="@+id/btSave"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/bt_save"/>

</LinearLayout>

確認

ラジオボタンを追加

layout/activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#A1A9BA"
    android:orientation="vertical">

    <TextView
        android:id="@+id/tvLabel"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:layout_marginTop="5dp"
        android:text="@string/tv_msg"/>

    <EditText
        android:id="@+id/etInput"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="25dp"
        android:layout_marginTop="5dp"
        android:inputType="text" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <CheckBox
            android:id="@+id/cbDrink"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="25dp"
            android:text="@string/cb_drink"/>
        <CheckBox
            android:id="@+id/cbFood"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/cb_food"/>
    </LinearLayout>

+   <RadioGroup
+       android:layout_width="match_parent"
+       android:layout_height="wrap_content"
+       android:layout_marginBottom="10dp"
+       android:layout_marginTop="10dp"
+       android:orientation="horizontal"
+       android:paddingBottom="10dp"
+       android:paddingTop="10dp">
+       <RadioButton
+           android:id="@+id/rbMale"
+           android:layout_width="wrap_content"
+           android:layout_height="wrap_content"
+           android:layout_marginLeft="25dp"
+           android:layout_marginRight="25dp"
+           android:text="@string/rb_male" />
+       <RadioButton
+           android:id="@+id/rbFemale"
+           android:layout_width="wrap_content"
+           android:layout_height="wrap_content"
+           android:text="@string/rb_female" />
+   </RadioGroup>

    <Button
        android:id="@+id/btSave"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/bt_save"/>

</LinearLayout>

確認

まぁなんかVisualStudio的な感じよね

選択ボックスを追加

values/strings.xml

<resources>
    <string name="app_name">HelloAndroid</string>
    <string name="tv_msg">お名前を入力してください</string>
    <string name="bt_save">保存</string>
    <string name="cb_drink">ドリンク</string>
    <string name="cb_food">フード</string>
    <string name="rb_male">男</string>
    <string name="rb_female">女</string>
+   <string-array name="sp_curryList">
+       <item>ドライカレー</item>
+       <item>カツカレー</item>
+       <item>ビーフカレー</item>
+       <item>チキンカレー</item>
+       <item>シーフードカレー</item>
+       <item>キーマカレー</item>
+       <item>グリーンカレー</item>
+   </string-array>
</resources>

layout/activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#A1A9BA"
    android:orientation="vertical">

    <TextView
        android:id="@+id/tvLabel"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:layout_marginTop="5dp"
        android:text="@string/tv_msg"/>

    <EditText
        android:id="@+id/etInput"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="25dp"
        android:layout_marginTop="5dp"
        android:inputType="text" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <CheckBox
            android:id="@+id/cbDrink"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="25dp"
            android:text="@string/cb_drink"/>
        <CheckBox
            android:id="@+id/cbFood"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/cb_food"/>
    </LinearLayout>

    <RadioGroup
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:layout_marginTop="10dp"
        android:orientation="horizontal"
        android:paddingBottom="10dp"
        android:paddingTop="10dp">
        <RadioButton
            android:id="@+id/rbMale"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="25dp"
            android:layout_marginRight="25dp"
            android:text="@string/rb_male" />
        <RadioButton
            android:id="@+id/rbFemale"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/rb_female" />
    </RadioGroup>

+   <Spinner
+       android:id="@+id/spCurryList"
+       android:layout_width="match_parent"
+       android:layout_height="wrap_content"
+       android:entries="@array/sp_curryList"
+       android:paddingBottom="5dp"
+       android:paddingTop="5dp" />

    <Button
        android:id="@+id/btSave"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/bt_save"/>

</LinearLayout>

確認

リストを追加

values/strings.xml

<resources>
    <string name="app_name">HelloAndroid</string>
    <string name="tv_msg">お名前を入力してください</string>
    <string name="bt_save">保存</string>
    <string name="cb_drink">ドリンク</string>
    <string name="cb_food">フード</string>
    <string name="rb_male">男</string>
    <string name="rb_female">女</string>
    <string-array name="sp_curryList">
        <item>ドライカレー</item>
        <item>カツカレー</item>
        <item>ビーフカレー</item>
        <item>チキンカレー</item>
        <item>シーフードカレー</item>
        <item>キーマカレー</item>
        <item>グリーンカレー</item>
    </string-array>
+   <string-array name="lv_cocktailList">
+       <item>ホワイト・レディー</item>
+       <item>バラライカ</item>
+       <item>XYZ</item>
+       <item>ニューヨーク</item>
+       <item>マンハッタン</item>
+       <item>ミシシッピミュール</item>
+       <item>マイタイ</item>
+       <item>マティーニ</item>
+   </string-array>
</resources>

layout/activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#A1A9BA"
    android:orientation="vertical">

    <TextView
        android:id="@+id/tvLabel"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:layout_marginTop="5dp"
        android:text="@string/tv_msg"/>

    <EditText
        android:id="@+id/etInput"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="25dp"
        android:layout_marginTop="5dp"
        android:inputType="text" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <CheckBox
            android:id="@+id/cbDrink"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="25dp"
            android:text="@string/cb_drink"/>
        <CheckBox
            android:id="@+id/cbFood"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/cb_food"/>
    </LinearLayout>

    <RadioGroup
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:layout_marginTop="10dp"
        android:orientation="horizontal"
        android:paddingBottom="10dp"
        android:paddingTop="10dp">
        <RadioButton
            android:id="@+id/rbMale"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="25dp"
            android:layout_marginRight="25dp"
            android:text="@string/rb_male" />
        <RadioButton
            android:id="@+id/rbFemale"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/rb_female" />
    </RadioGroup>

    <Spinner
        android:id="@+id/spCurryList"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:entries="@array/sp_curryList"
        android:paddingBottom="5dp"
        android:paddingTop="5dp" />

    <Button
        android:id="@+id/btSave"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/bt_save"/>

+   <ListView
+       android:layout_width="match_parent"
+       android:layout_height="0dp"
+       android:layout_weight="1"
+       android:background="#ffffff"
+       android:entries="@array/lv_cocktailList" />

</LinearLayout>

確認