基礎の基礎の基礎を身につけるために、
素直に、GoogleのAndroid Tutorialを実施しました。
環境
- MacBook Pro (Retina 13-inch、Early 2015)
- OS X El Capitan 10.11.6
- Java 1.8.0_73
- Android Studio 1.5.1
実施したこと
プロジェクト新規作成
- Android Studioを実行する
- 「Start a New Android Studio Project」を押下する
- 「New Project」画面で、プロジェクト設定を入力する
- 「次へ」を押下する
- 「Target Android Devices」画面で、対象とするAndroidデバイス情報を入力する
- 「次へ」を押下する
- 「Add an activity to Mobile」画面で、「Empty Activity」を選択する
- 「次へ」を押下する
- 「Customize the Activity」画面では、デフォルト値のまま変更しない
- 「終了」を押下する
- プロジェクトが新規作成される
エミュレータ上で起動
- プロジェクトを開く
- 「ツール」>「Android」>「AVD Manager」を押下する
- 「Create Virtual Device」を押下する
- 「Select Hardware」画面で、「Nexus 6」を選択する
- 「次へ」を押下する
- 「Select Image page」画面で、エミュレータに相応しいOSバージョンを選択する
- 「次へ」を押下する
- 「Android Virtual Device」画面では、デフォルト値のまま変更しない
- 「終了」を押下する
- Android Studioで、「実行」ボタンを押下する
- 「Device Chooser」画面で、「Launch emulator」を選択する
- 「OK」を押下する
- エミュレータ上で、指定したアプリケーションが実行される
シンプルなUIの作成
LinearLayoutの追加
- 「res/layout」ディレクトリより、「activity_main.xml」ファイルを開く
- 「RelativeLayout」タグを全て削除する
- 「LinearLayout」を追加するために、以下を記載する
activity_main.xml
<LinearLayout
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"
android:orientation="horizontal">
</LinearLayout>
TextFieldの追加
- 「EditText」を追加するために、「LinearLayout」タグ内に以下を記載する
- string.xmlに定義していないため、「android:hint」でコンパイルエラーが発生する
activity_main.xml
<EditText
android:id="@+id/edit_message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="@string/edit_message"/>
文字列の追加
- 「res/values」ディレクトリより、「strings.xml」ファイルを開く
- 2つ文字列を追加するために、「resources」タグ内に以下を記載する
strings.xml
<string name="edit_message">Enter a message</string>
<string name="button_send">Send</string>
ボタンの追加
- 「activity_main.xml」ファイルを開く
- ボタンを追加するために、「EditText」タグの後に、以下を記載する
activity_main.xml
<Button
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="@string/button_send" />
TextFieldの修正
- 幅計算のパフォーマンスを向上させるために、「EditText」タグを以下に変更する
activity_main.xml
<EditText
android:id="@+id/edit_message"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height'="wrap_content"
android:hint="@string/edit_message" />
起動確認
- アプリケーションを実行する
Activityの追加
ボタンの動作の追加
- 「activity_main.xml」ファイルを開く
- ボタンが押下された時の動作を定義するため、「Button」タグ内に以下を追記する
- 「onc」くらいでコード補完してくれる
activity_main.xml
android:onClick="sendMessage"
- 「java/com.example.myfirstapp/MainActivity.java」を開く
- 「sendMessage」メソッドを追加する
MainActivity.java
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
/** Called when the user clicks the Send button */
public void sendMessage(View view) {
// Do something in response to button.
}
}
Intentの構築
- 「sendMessage」メソッドに以下を追記する
- 「Intent」や「View」のシンボルでコンパイルエラーが起きている場合、インポート文が足りていない。Option + Enterでインポート文を追加できる
- 「DisplayMessageActivity.class」でコンパイルエラーが発生するが、後ほどすぐ作成する
MainActivity.java
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
/** Called when the user clicks the Send button */
public void sendMessage(View view) {
Intent intent = new Intent(this, DisplayMessageActivity.class);
EditText editText = (EditText)findViewById(R.id.edit_message);
String message = editText.getText().toString();
intent.putExtra(EXTRA_MESSAGE, message);
startActivity(intent);
}
}
二つ目のActivity作成
- 「app」ディレクトリを右クリックし、「新規」>「Activity」>「EmptyActivity」を選択する
- 「Customize Activity」画面で、アクティビティ名に「DisplayMessageActivity.java」を入力する
- 「終了」を押下する
メッセージを表示
- 「DisplayMessageActivity.java」のonCreateメソッドに、以下を記載する
DisplayMessageActivity.java
public class DisplayMessageActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_display_message);
Intent intent = getIntent();
String message = intent.getStringExtra(MainActivity.EXTRA_MESSAGE);
TextView textView = new TextView(this);
textView.setTextSize(40);
textView.setText(message);
ViewGroup layout = (ViewGroup) findViewById(R.id.activity_display_message);
layout.addView(textView);
}
}
起動確認
- アプリケーションを実行する
結果
- Androidの画面部品の定義方法を理解した。
- IntentによるActivity間の情報連携の超基本を理解した。