Android Studio の使い方

前回は Android Studio のインストールと、Hello World! のサンプルを動作させるところまでやりました。今回は Hello Wordld! を雛形として使い、プロジェクトを操作する基本を学びます。

プロジェクトを作る

Android Studio を起動して、[＋Create New Project] から新しいプロジェクトに名前を付けて作成します。インストールのときに作ったサンプルを元に修正しても構いません。その場合は、左側に既存のプロジェクトが表示されていますので選択してください。

Android Studio の画面構成

Android Studio の基本画面はこの様な構成になっています。エディタウインドウでコーディングを行います。

エディタウインドウで actitvity_main.xml のタブを選択するとレイアウトエディタのウインドウになります。

このアプリでは kotlin を使いますので Kotlin Android 拡張プラグインを使うための設定をしておきます。プロジェクトツールウインドウから build.gradle(Module:<プロジェクト名>.app) というファイルを探し出して、冒頭の plugins の記述に１行追加してこのようにします。

plugins {
    id 'com.android.application'
    id 'kotlin-android'
    id 'kotlin-android-extensions'
}

plugins {

id 'com.android.application'

id 'kotlin-android'

id 'kotlin-android-extensions'

}

その後、メニューから [File] > [Sync Project with Gradle Files] を実行して変更を反映してください。

GUIコンポーネントを作る

コンポーネントを追加して新しい機能を作ってみます。まず最初からある Hello World! を消します。レイアウトエディタでクリックして Delete キーを押すか、右クリックで Delete を選択すれば消えます。

TextView を作成

TextView とは文字列を表示するためのコンポーネントです。オートコネクトが有効になっていることをアイコンの形で確認して、Palette ペインから TextView をDesign ペインにドラッグします。配置したコンポーネントを右クリックして [Center] > [Horizontally] を選ぶと左右中央に配置されます。コンポーネントの配置についてはいろいろな属性がありますが、ここでは説明を省略します。

コンポーネントには id 名で管理され、コンポーネントを作成したときに自動的に名前が割り当てられています。Attributes ペインの id という項目にその名前があるので理解しやすい名前に変更しましょう。ここでは greetings とします。確認のメッセージが表示されますので [Refacter] ボタンを押して確定します。すると、Component Tree ペインに id 名が反映されます。

文字列リソースを作成

作成した TextView コンポーネントを選択した状態で Attributes ペインを見ると、その中の [text] という項目にデフォルトで “TextView” という値が入っています。この文字列を直接編集することも可能なのですが、アプリの規模が大きくなったときに表現の一貫性を保つために、文字列リソースを作成しておくのが定石です。

[text] 項目の右横のボタンを押すと Pick a Resource というウインドウが現れます。まだ作ったリソースはないので “＋” ボタンを押して [String Value] を選択し、新しい文字列リソースを作ります。

文字列リソースも id とその値で管理されます。ここではこのように設定します。

Resource name: good_morning
Resource value: おはようございます。

[OK] > [OK] と進むと Design ペインの表示が “おはようございます。” と変化します。もう一度 Attributes ペインを見ると、文字列そのものではなく、作成した文字列リソース good_morning が対応付けられていることがわかります。

ボタンを作る

次はボタンのコンポーネントを追加します。Palette ペインから [Buttons] > [Button] を選んで、Design ペインにドラッグして配置します。ボタンのコンポーネントを右クリックして [Center] > [Horizontally]、および [Center] > [Vertically] を選ぶと上下左右中央に配置されます。Attributes ペインの id はデフォルトで “button” となっているので “afternoon” のようにしておきます。[text] の項目の値はデフォルトで “Button” となっているので、先程と同じように文字列コンポーネントを作成して対応付けます。文字列コンポーネントはこのようにします。

Resource name: afternoon
Resource value: 午後のあいさつ

このようにボタンが配置できたはずです。

ボタンを押したときの動作をプログラミングする

エディタウインドウで MainActivity.kt のタブを選択します。デフォルトで入っているソースコードに、import文を１行、class MainActivity の中に３行を追加します。

package com.example.myapplication

import android.support.v7.app.AppCompatActivity
import android.os.Bundle
import kotlinx.android.synthetic.main.activity_main.*    // 追加

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        afternoon.setOnClickListener {    // 追加
            greetings.text = "こんにちは！"   // 追加 
        }                                 // 追加
    }
}

package com.example.myapplication

import android.support.v7.app.AppCompatActivity

import android.os.Bundle

import kotlinx.android.synthetic.main.activity_main.* // 追加

class MainActivity : AppCompatActivity() {

override fun onCreate(savedInstanceState: Bundle?) {

super.onCreate(savedInstanceState)

setContentView(R.layout.activity_main)

afternoon.setOnClickListener { // 追加

greetings.text = "こんにちは！" // 追加

} // 追加

}

inport文は Kotlin Android 拡張プラグインを使うために必要です。追加した３行でボタンを押したときの動作を記述しています。

前回の記事でやったようにエミュレータを起動して、▶ボタンを押してアプリを起動してください。

このように Android Studio ではコンポーネントを配置して画面をデザインし、Kotlin または Java で動作をプログラミングするのが基本です。画面デザインの方法やプログラミングについては各自で勉強してください。