トップ   編集 差分 履歴 添付 複製 名前変更 リロード   新規 一覧 検索 最終更新   ヘルプ   最終更新のRSS

数字の入力 の変更点

Top/数字の入力

#author("2024-06-06T16:52:58+09:00","","")
#author("2024-06-06T16:53:46+09:00","","")
** 数字の入力 [#ve4275ab]
*** 入力欄の準備 [#s9b3606f]

画面上に入力欄を作って,数字やテキストを入力できるようにします.~
まず,Widgetsの中にあるテキスト(TextView)を配置してください.配置後,Propertiesの欄の
- IDを「entrance_year」にかえてください.文字の内容はなんでもいいです.
- textを「入学年」にかえてください.文字の内容はなんでもいいです.
-- strings.xmlに,たとえば「<string name="entrance_text">入学年</string>」と追記するような形で.

これは,入力欄の見出しになります.実際の数字の入力欄は,Palette欄のTextの中にある Plain Text(EditText)で作成します.Plain Textを「入学年(TextView)」の近くに配置してください.図1では「こんばんは」と「こんにちは」の間に見出しと入力欄を配置しています.

#BR
#ref(http://www.wakayama-u.ac.jp/~itou/SISeminar/img/5-1.png,600x400)
CENTER:図1
#BR

EditTextのIDは「year_text」,textは「西暦」にしておいてください.~
配置場所は自由にしてもらっていいです.~

ボタンは「[[ボタンの追加]]」のところで作ったものを再利用します.~
ボタンのIDは「press_button」です.

#BR

ボタン類の配置を完了したイメージが図2です.

#BR
#ref(http://www.wakayama-u.ac.jp/~itou/SISeminar/img/5-2.png,600x400)
CENTER:図2
#BR

*** 入力した数字の取得 [#tcbd1d90]

EditText欄に入力されたテキストは,下記の方法で取得できます.~
下記の内容を&color(red){MainActivity.java};ファイルの「onClick」の中に追記します.~
他のページで試しに書いていたテキスト書き換えや画像入れ替えに関連する記述は,一番上の「TextView2」を取得する行以外はコメントアウトしてください.

     // 入力欄の内容をIDから取得
        EditText editText1 = (EditText) findViewById(R.id.year_text);
     // 取得した内容を文字列として認識
        String str1 = editText1.getText().toString();
     // 入力されたのは数字なので,数字になおす
        int entranceYear = Integer.parseInt(str1);
     // 現在の西暦は2024年なので,入学してから何年経つかを引き算で計算する
        int thisYear = 2024;
        int calc = thisYear - entranceYear;

*** ボタンを押して計算 [#e188c321]

画面上部の「押しボタン」を押すと,2024年から入学年の個所に入力した数字を引いた数を出力するようにします.~

#BR

&color(red){MainActivity.java};に,ボタンが押されたときの動作の内容を追記します.~
上記の引き算の記述のあとに,さらに以下の内容を足してください.~
全部合わせると,図3のような感じになっているはずです.~

       // 計算結果を出力
          String str2 = String.valueOf(calc);
          textView2.setText("入学してから"+str2+"年です");

#BR
#ref(http://www.wakayama-u.ac.jp/~itou/SISeminar/img/5-3.png,600x400)
CENTER:図3
#BR

ここまでで,エミュレータを動かしてみてください.~
図4のように,エミュレータ内で数字が入力できるようになっているので,何か数字を入れて,上のボタンを押してください.~
すると,入力内容を使って計算された結果が,赤い文字の箇所に表示されます(図5).

#BR
#ref(http://www.wakayama-u.ac.jp/~itou/SISeminar/img/5-4.png,600x400)
CENTER:図4
#BR

#BR
#ref(http://www.wakayama-u.ac.jp/~itou/SISeminar/img/5-5.png,600x400)
CENTER:図4
CENTER:図5
#BR

数字を取得して,計算に使う方法は以上です.~
数字の入力欄を2つ作ることで,簡単な計算アプリが作れます.~

[[一週目の作業]]に戻る