Androidアプリ開発講座

この演習では、以下のプロジェクトを使用します。
Eclipseにインポートしてください。

プロジェクト

practice_resource.zip

文字列を設定する定義ファイル（res/values/strings.xml）に、定義を記述します。
点線内の内容を追記してください。

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="hello">Hello World, resource practice</string>
    <string name="app_name">リソース演習</string>
<!-- ↓ここから -->
    <string name="message1">メッセージ１</string>
    <string name="message2">メッセージ２</string>
<!-- ↑ここまで -->
</resources>

次に、レイアウトXMLファイル（res/layout/values.xml）に、定義を記述します。
点線内の内容を追記してください。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent">
<!-- ↓ここから -->
    <TextView
        android:id="@+id/textView1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/message1" />
    <TextView
        android:id="@+id/textView2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/message2" />
<!-- ↑ここまで -->
</LinearLayout>

追記が終わったら実行し、「値」をクリックしてください。正しく表示されましたか？

色を設定する定義ファイル（res/values/colors.xml）に、色の定義を記述します。
点線内の内容を追記してください。

res/valuesというフォルダを右クリックして、「新規」->「Android XMLファイル」を選択し、colors.xmlを作成してください。

項目	内容
プロジェクト	practice_resource
ファイル	colors.xml
What type of resource would you like to create?	値
フォルダ	/res/values

<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- ↓ここから -->
    <color name="bg_gray">#909090</color>
    <color name="bg_red">#FF0000</color>
    <color name="bg_blue">#0000FF</color>
<!-- ↑ここまで -->
</resources>

res/layout/values.xmlファイルを開き、点線の内容を追記してください。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
<!-- ↓ここから -->
  android:background="@color/bg_gray">
<!-- ↑ここまで -->
  <TextView 
    android:id="@+id/textView1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:text="@string/message1"
<!-- ↓ここから -->
    android:background="@color/bg_red" />
<!-- ↑ここまで -->
  <TextView 
    android:id="@+id/textView2"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:text="@string/message2"
<!-- ↓ここから -->
    android:background="@color/bg_blue" />
<!-- ↑ここまで -->
</LinearLayout>

追記が終わったら実行し、「値」をクリックしてください。正しく表示されましたか？

res/valuesフォルダを右クリックして、「新規」->「Android XMLファイル」を選択し、dimens.xmlを作成してください。

項目	内容
プロジェクト	practice_resource
ファイル	dimens.xml
What type of resource would you like to create?	値
フォルダ	/res/values

フォントの大きさを設定する定義ファイル（res/values/dimens.xml）を記述します。
点線内の内容を追記してください。

<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- ↓ここから -->
    <dimen name="font_size_20">20dip</dimen>
<!-- ↑ここまで -->
</resources>

res/layout/values.xmlファイルを開き、点線の内容を追記してください。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:background="@color/bg_white">
  <TextView 
    android:id="@+id/textView1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:text="@string/message1"
    android:background="@color/bg_red" />
  <TextView 
    android:id="@+id/textView2"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:text="@string/message2"
<!-- ↓ここから -->
    android:textSize="@dimen/font_size_20"
<!-- ↑ここまで -->
    android:background="@color/bg_blue" />
</LinearLayout>

追記が終わったら実行し、「値」をクリックしてください。正しく表示されましたか？

ここまでの修正で、以下の様に画面表示されていれば、問題ありません。

res/layoutフォルダを右クリックして、「新規」->「Android XMLファイル」を選択し、image.xmlを作成してください。

項目	内容
プロジェクト	practice_resource
ファイル	image.xml
What type of resource would you like to create?	レイアウト
フォルダ	/res/layout
Select the root element for the XML file	LinearLayout

レイアウト定義ファイル（res/values/image.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:gravity="center">
<!-- ↓ここから -->
    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/android" />
<!-- ↑ここまで -->
</LinearLayout>

追記が終わったら実行し、「画像」をクリックしてください。正しく表示されましたか？

次に、背景色を変更します。
res/values/colors.xml、res/layout/image.xmlに、点線内を追記してください。

res/values/colors.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="bg_gral">#909090</color>
    <color name="bg_red">#FF0000</color>
    <color name="bg_blue">#0000FF</color>
<!-- ↓ここから -->
    <color name="bg_green">#00FF00</color>
<!-- ↑ここまで -->
</resources>

res/layout/image.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:background="@color/bg_green">
<!-- ↑ここまで -->
    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/android" />
</LinearLayout>

追記が終わったら実行し、「画像」をクリックしてください。正しく表示されましたか？

ここまでの修正で、以下の様に画面表示されていれば、問題ありません。