k2-ornata（個人的「やってみたこと」ブログ）

とりあえず前回、以下のページでAndroid Studioをセットアップするところを説明しました。
今回は、一歩進んで、簡単なアプリを開発してみたいと思います。

https://k2-ornata.com/android-app-dev

とはいえ、まったく初めての方は何からやればいいのかわからないとおもますので、自分がやったことを１つずつ説明したいと思います。

ボタンを押すと文字が変わるアプリ

わたしも最初、何から手をつけてよいのかわからず、とりあえず他の人がよく作成している、ボタンを押すと文字が変わるアプリを作成してみることにしました。

今回、開発に必要な画面（ソース）としては、とりあえずアプリのGUIを決めるactivity_main.xlmと、GUIでの操作に応じて動くMainActivity.javaの２つです。

１．とりあえず、GUIを眺めてみる

まずは、activity_main.xlmを見てみます。プロジェクトを立ち上げて画面の上の方を見てみると、「activity_main.xlm」というタブがあると思います。そのタブを選択すると、以下のような画面が表示されます。

２．テキストの属性を設定する

１．でタブを開くと、最初はスマホアプリのGUIの真ん中あたりに、Hello Worldのようなテキストが表示されていると思います。そのテキスト（オブジェクト）をクリックし、右のウィンドウから属性を変えてみましょう。上記の例ではidの属性を以下のように設定しています。

このようにオブジェクトの属性を設定しておくことで、あとで、MainActivity.javaからそのオブジェクトを明示的に指定することができるようになります。

３．ボタンを作成する

次にアプリのGUI上にボタンを新しく配置してみます。下記のウィンドウの真ん中すこし左あたりにパレットがあると思いますので、そこから「Button」をマウスでクリックして、アプリのGUI上にもってきます。

その後で、先ほどのテキストと同様に属性を設定します。まずはid属性を設定し、その後にこのボタンが押された時に動き出す関数を設定します。
具体的な操作としては、右側の属性ウィンドウを下にスクロールしていくと、「onClick」という属性があると思いますので、そこに「changeText」という関数を設定します。

ボタンオブジェクトの設定をまとめると以下の通りです。

４．ボタンを押すとテキストが変わるようにする

ここまででアプリのGUIは作成できたので、あとはMainActivity.javaで先ほどボタンに設定した「changeText」関数を使って動きを設定するだけです。

MainActivity.javaのタブを最初に開いた時は以下のような感じになっていると思いますので、ここから「changeText」関数を定義していきます。

具体的には以下のような感じで記述します。全コードを記載しているので、このままコピー＆ペーストでもいいですが、最初は自分で真似しながら打ってみるといいかと思います。
Android Studioはなかなかかしこくで、コードを打っていると自動的に入力候補を出してくれるので、初心者にはありがたいです。

package com.example.textandbutton;

import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.TextView;


public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }

    public void changeText(View view) {
        TextView message01 = (TextView)findViewById(R.id.message01);
        message01.setText("You pushed button!");
    }
}

public class MainActivity以降がアプリの動作を定義している部分で、それぞれの関数の実行タイミングはだいたい以下のようになると思います。

ちなみに上の方のimport文はコードの作成に必要なライブラリみたいなものを取り込む処理になります。
さらにその上のpackageはこのプログラム自身の名前だと思えばいいかと思います。

５．仮想環境を選択する

コーディングは以上になりますので、あとは実際に動かしてみます。
Android Studioの上のツールバーに緑色の三角ボタンがあると思いますので、それを押せばいいのですが、その前に、スマートフォンの仮想環境を設定しておく必要があります。

うろ覚えですが、上図の赤い四角に囲まれたプルダウンから仮想環境を選択することができます。選択が終わっていると、このように選択した機種が表示されていると思います。

６．動かしてみる

それでは先ほど説明したとおり、緑の三角（再生）ボタンを押してみます。以下のようにスマートフォンの仮想環境が表示され、その中にテキストとボタンが描画されていると思います。

この後、ボタンを押してテキストが”You pushed button!”になれば成功です。もしうまく動かなかった場合は、Android Studioの画面下（たぶんEvent Log）にエラーが表示されていると思いますので、確認してみてください。

どうでしょう？意外と簡単だったのではないでしょうか？