arrow_back

表示の内容を変える

「ここからは、いよいよ電卓アプリを開発していくよ!」
「それ、あたしのセリフ!」
「まぁ、開発っていっても、ハルキはなにもかもが初めてなわけだから基本中の基本から。 アプリを作るにはまずインプットアウトプットを考えなきゃね」
「うーん。さっそくわからなくなってきたよ……」
「早いなぁ……」
「つまり、アプリの利用者(ユーザー)がする操作にどんなものがあって、アプリはどんな内容を返すか。 メッセンジャーアプリで言えば、文字を入力したら、文字を画面に表示する。 送信ボタンを押したらメッセージを送信して結果を画面に表示する」
「送信ボタンをメッセージを送信するって……それって当たり前の事だよね?」
「うふふ。当たり前はね。誰かがきちんとプログラムしてるから当たり前になってるんだよ?」
「やだ杏ちゃん。なんか怖いよ...」

画面に表示する文字を変更する

「画面に文字を出力してみよう。今、アプリを起動すると"Hello World!"って表示されるよね。 その文字をプログラムから書き換えるよ」
TextViewにIDを追加
「まずはProject Viewでapp/src/main/res/layout/activity_main.xmlを開いてね。 ディレクトリが見えないときは左側の三角形をクリックしたら、どんどん階層が開いていくよ」
「あー、あのごちゃごちゃした画面……」
「で、開いたらTextViewの下に android:id="@+id/textview"を追加する」
<?xml version="1.0" encoding="utf-8"?>
<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"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/textview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"/>
</RelativeLayout>
「@(アットマーク)の次に+(プラス)記号を忘れないようにね」
「これは、一体なにをしてるのかな?」
「プログラムからあとで操作できるように、画面の部品にIDを割り当てる作業をしたんだよ」
「名前がtextviewっていうのに意味はあるの?」
「名前そのものに意味はないから、"title"でも"hyouji"でも、わかりやすい名前をつけたらいいよ。 もちろん何でも良いってわけじゃなくて、一定の規則はあるけど……それはいつか説明するかも」

MainActivityからTextViewを取得

「ちゃんと追加できたね。 そしたら今度はProject Viewからapp/src/main/java/.../MainActivityを開いて。 ...の部分は環境によって違うから、気にせずMainActivityを開くと思えば大丈夫だよ!」
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    TextView textView = (TextView) findViewById(R.id.textview);
}
TextViewから始まる一行を追加する。必ずsetContentViewの後に書くんだよ」
R.id.textviewっていうのが、さっきつけたIDだよね」
「そう! だからさっき別の名前にした場合、それに合わせないと駄目だよ。 @+id/titleならR.id.titleね」
使用するクラスのimport
「あれ、杏ちゃん! なんか赤くなったよ!?」
「あ、そっか。TextViewは初めて使うクラスだからimportされてないんだ」
「インポート?」
「上の方にimport ...って表示されてるよね。ちょっとクリックしてみて」
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.Menu;
import android.view.MenuItem;
「こんな感じで、使うクラスはimportとしてあらかじめ書いておく必要があるの。 ここにTextViewがないからエラーになったってわけ。あ、これはAndroidじゃなくてJava言語の規則ね」
「じゃあ、ここにクラスを書けばいいのかな? えっと、B組……っと」
「クラスって言うのはプログラムの部品のことね……」
public class MainActivity extends AppCompatActivity {

}
「ほら。publicの次に"class"って書いてあるでしょ。これがクラス。 Java言語ではクラスの単位でプログラムを書いていくんだよ」
「うーん?」
「ごめん。ハルキにはまだ難しかったね。 今日は一つしかクラスを作らないから、今度またゆっくり教えるよ。 で、importの話に戻るけど、いちいち手で入力しなくても、さっきエラーが出た箇所にカーソルを合わせて Option + Enterを押してみて」
「やったぁ! 赤いのが消えたよ!」
「ね。Android Studioの補完機能が勝手にimportしてくれる。 たまに同じクラス名があって、どちらをimportするのか聞かれるときもあるけど」
「と、思ったらまた赤くなった!」
「どれどれ……ほら(TextView)を忘れてる」
「本当だ。気づかなかったよー」
「こんな時もOption + Enterね。そしたら訂正候補が出てくるから」
「'Cast to ...'を選べば(TextView)を足してくれるよ!」

文字列を設定

「画面の部品を操作できるようになったから、表示する内容を書き換えよう」

    TextView textView = (TextView) findViewById(R.id.textview);
    textView.setText("こんにちは! Android Studio");
}
「表示する文字列の書き換えはtextView.setTextを使うけど、このときに大文字と小文字はきちんと入力して。 TextView.setTextではだめだから」
「んー、ややこしい……」
「ちゃんと"こんにちは! Android Studio"になったね!」
「そう、これがmain_activity.xmlで設定したIDを元にTextViewを取得して、 setTextで文字を変えた結果だよ。じゃあ、次は数値を表示してみよう!」
「数値? それってなにか違うの?」
最終更新日: 2015/09/03