Android開発の第一歩！「Hello World」を作成する方法をなるべく簡単に（応用編）

@chusuke311です。

さて、前の記事の続き。「HelloWorld」を作成する方法をなるべく簡単に（応用編）です。

前回までで「Hello World」と表示するアプリを作成することはできましたが、なぜ「Hello World」と表示されるのか、仕組みを解説していきたいと思います。

ソースコードを見てみる

前回できあがったアプリのソースコードを見てみましょう。

Eclipseを起動しましょう。

左側にフォルダの階層が表示されています。

ここにアプリを構成するすべてのファイルが含まれています。

その中でもアプリ本体を形作っているのが、[HelloWorld]-[src]-[com.example.helloworld]にある「MainActivity.java」というファイルです。

中身を見てみましょう。

package com.example.helloworld;
 
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
 
public class MainActivity extends Activity {
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
 
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.activity_main, menu);
        return true;
    }
 
}

この中で「Hello World」と出力される原因となっているのが、ハイライトしている12行目の

setContentView(R.layout.activity_main);

です。

では、このコードの説明を次で詳しくしてみたいと思います。

setContentViewとは

最初にアプリの構造を理解していきます。

まず、アプリの画面のことを「アクティビティ」と言います。

開発していく上で多用される用語ですのでしっかりと覚えておきましょう。

そしてそのアクティビティ上に「ビュー」と呼ばれる部品、例えばテキストやボタン・画像など、を配置してアプリの画面を形作っていきます。

その「ビュー」の配置に利用するのが、setContentViewなのです。

では、実際の

setContentView(R.layout.activity_main);

について解説していきます。

これは、簡単に言うと「Rというファイルのlayout部分、activity_mainを表示してくれ」ということなのですが、

実際にRというファイル（=HelloWorld\gen\com.example.helloworld\R.java）をみてみると、

    public static final class layout {
        public static final int activity_main=0x7f030000;
    }

となっています。

activity_main=0x7f030000って…？という感じですね。

コレは実は「HelloWorld\res\layout\activity_main.xml」というファイルを指しているのです。

0x7f030000はIDで、activity_main.xmlを指しています。IDは固定では無いので、皆さんの環境では違う文字列であったりするとおもいますが、問題ありません。

そのファイルをEclipseで表示すると、実は一番最初に表示されていた、これなんです。

ビジュアルエディタになっているのですが、その解説はまた今度。

今回はコードを見ていきます。

画面のスクリーンショットの下付近にある「activity_main.xml」をクリックすると、下のようなコードが出てきます。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >
 
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:text="@string/hello_world" />
 
</RelativeLayout>

またまたハイライトしている12行目、

android:text="@string/hello_world"

実は、これが「Hello world!」と表示している根本なんです。

図で解説するとこうなります。

アクティビティからsetContentViewがR.javaのactivity_mainを表示するように要求。
要求を受けたR.javaはactivity_mainであるactivity_main.xmlを参照
R.javaが参照したデータをsetContentViewがアクティビティ上に表示

という流れ作業のような感じです。

分かりにくいかもしれませんが、なんとなくイメージしていただければ…と思います。

これで「Hello world!」の表示の理由の解説は終わりです。

自分で「Hello World」を表示してみる

さて、仕組みは理解したけど、開発をしているという実感が全然わかない！という人も多いと思います。

と、いうことで今回は自分の手で「Hello World」と表示する方法を紹介したいと思います。

早速始めましょう。

では、MainActivity.javaを開いてください。

まずは上で解説してきた「Hello world!」と表示される原因となっている

setContentView(R.layout.activity_main);

を削除します。

そして、その消した部分に

		TextView _newtext = new TextView(this);

		_newtext.setText("HelloWorld!!!");

		setContentView(_newtext);

を貼り付けます。

そして、上の方にある

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;

の部分に

import android.widget.TextView;

を追加します。

そうすると、結局、

package com.example.helloworld;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.widget.TextView;

public class MainActivity extends Activity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		TextView _newtext = new TextView(this);

		_newtext.setText("HelloWorld!!!");

		setContentView(_newtext);
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.activity_main, menu);
		return true;
	}

}

という感じのソースコードになります。（ハイライト部分＝追加分）

保存して仮想デバイスで起動してみましょう。

※起動方法は、（基本編）を参照。