Androidアプリケーションの開発 【02:Button アプリ】

2018-12-03

簡単なButtonアプリの作成

ボタンを押したら文字が変わるという簡単なアプリを作ってみます。

Android プロジェクトの作成

Buttonアプリを作るためにプロジェクトを作成します。
Android Studio から一番上の「Start a new Android Studio project」を選択します。
あるいは既にプロジェクトが表示されているのであれば、「ファイル」「新規」「新規プロジェクト…」
を選択して新規プロジェクトを開始できます。

アプリケーションの名前、保存場所などを設定します。

  • アプリケーション名: TestAppButton
  • 会社ドメイン: example.com

テストなのでデフォルト名を使います。但しリリースするときはユニークなものにしないといけません。

  • プロジェクトの場所: アプリプロジェクトを保存する場所

デフォルトのまま、あるいはフォルダ名がアルファベットであればどこにでも作れます(日本語のフォルダ名はダメです)。

…\AndroidStudioProjects\TestAppButton

次へ(N)をクリックします。

ターゲット Android  デバイスの設定

ここでは開発するアプリのターゲットAPIを決めます。下の例では API 28: Android 9.0 (Pie)にしています。
次へ(N)をクリックします。

Mobile にアクティビティを追加する

使いやすい「空のアクティビティー」をセットします。デフォルトで空のアクティビティーが最初に選択されていると思います。
次へ(N)をクリックします。

アクティビティー、レイアウトなどの名前を設定します。
ここはテストなのでデフォルトのままです。

  • アクティビティー名: MainActivity
  • レイアウト名: activity_main

完了(F)をクリックします。

プロジェクトが完成しました。

MainActivity

コードの記述をして行きます。
プロジェクトが作成されると「Project」のTAGで階層が表示されます。
主に MainActivity.javaactivity_main.xml を使います。

Java のコーディングは MainActivity.java にします。
空のアクティビティーを選んだので、ある程度の基本的なコードは既に入っています。

activity_main.xml にはレイアウトを記述します。
やり方として2通りあります。

  • 「デザイン」を使って画面上にUIパーツを配置する方法
  • 「テキスト」で全てコードで書いていく方法

「デザイン」ではレイアウトの配置全体をデザイン的に決めていくには便利です。

「Text」のタブをクリックしてここにコードを書きます。

MainActivity.javaの onCreateメソッドにボタンを設定する記述をします。

ここで、エラーが表示されますが後でコードを正しく追加すれば消えます。
エラーとなっているところにこのようポップアップが出た場合は、「Alt+Enter」を行うと自動的に以下の行が追加されます。

setContentView:
Screenにテキスト、ボタン、画像を表示させる仕組みで SetContentView() は最終的にViewをまとめるところです。
それぞれTextViewなどのViewを何種類かある Layout に設定し、それを SetContentView() に入れます。

findViewById:
これはリソースの(レイアウトファイル)からid が button のものを見つけてくることを意味します。
次に TextView を設定します。このケースではTextViewは事前に onCreate() の前に作成します。
private TextView textView;
onCreate() の中に
textView = findViewById(R.id.textView);
その後に、ボタンが押された事が分かるようにリスナー登録します。

OnClickListener():
リスナー、アプリが起動中に、ユーザーがボタンをタップしたイベント発生を監視します。

ボタンが押された時の動作を決めます。
ボタン押されるとflagが’true’か’false’かを判別して、下記を表示します。
  • trueなら「Hello」
  • falseなら「World」
setText() でTextViewの文字列を設定します。

MainActivity.java

この状態ではまだエラーがありますがレイアウトファイルを設定すれば解消します。

activity_main

activity_main.xmlにレイアウトを設定します。

MainActivity.java では button と textView を呼び出していますのでそれをここに作成します。
デフォルトでは「ConstraintLayout」が設定されています。
ボタンのIDは以下で定義されています。
android:id=”@+id/button”
TextViewも同様です。
android:id=”@+id/text_view”

またTextViewの垂直方向の位置調整で以下のように設定します。
app:layout_constraintVertical_bias=”0.4″
またButtonは
app:layout_constraintVertical_bias=”0.6″

テキストのサイズと色を設定します。
android:textSize="50sp"
android:textColor="#002fff"
Buttonは
android:textSize="40sp"

activity_main.xml

リテラルの修正

コードをよく見るとあちこちにワーニングが出ています。
黄色いバックグラウンドになっているところにマウスを持ってくると、下記のように表示されます。

String literal in setText can not be translated. Use Android resources instead.
と記載されてます。
setTex(“Hello”) のようにHelloという文字列をハードコードで直書きしているリテラルが、
正しく解釈されないのでresourceを使うようにと注意されています。

例えば日本語でハードコーディングすると文字化けやコードが走らない事があり得るのです。

修正は下記の通りです。

textView.setText(R.string.hello);

上記の res\values\strings.xml に
nameが”hello”というkeyに対してHelloというvalueを設定します。
このワーニングはactivity_main.xmlのリテラルにも出ているので合わせて修正します。

strings.xml

それぞれの修正箇所です。
MainActivity.java

activity_main.xml

以上でコードの記述は完成です。

アプリケーションを実行

メニューから「実行(U)」->「実行(U) ‘app’」とするか、
メニュー下の三角のアイコンをクリックして実行するとビルドが始まります。

ビルドが成功すると実行デバイスの選択になります。
エミュレーターを選択し、OKをクリックします。

エミュレータが起動して画面 が表示されます。
「BUTTON」をタッチすると表示が切替ります。