トップ   新規 一覧 検索 最終更新   ヘルプ   最終更新のRSS

数字の入力 の履歴(No.1)


このページは,古いバージョンのAndroidStudioに沿った説明になっています.
新しいバージョンで動作するか未確認,かつ,未更新の部分もあるので,参考にする場合はそれを踏まえておいてください.

数字の入力

新しいプロジェクトの準備

画面上に入力欄を作って,数字やテキストを入力できるようにします.

 

少し画面がごちゃごちゃしてきたので,新しくProjectを作り直します. プログラムの作り方のところでやったのと同じように,Projectを作成します.Androidのバージョンやactivityの種類も全く同じです.

レイアウト方法

前回のレイアウト方法は,ある一つの基準をもとに相対的に他のパーツの配置を決めていく「RelativeLayout」でした.今回は,水平方向・垂直方向にパーツを配置していく「LinearLayout」を使用します.

 

まず,activity_main.xmlを開きます.左上にある「Hello World!」は使わないので消しておきます.

 

次に,画面左側の Paletteの中に「Layouts」の個所があるので,その中から「LinearLayout(horizontal)」を選択して画面上に配置します. 図1が配置後の様子です.
IDの欄が空白になっていますので「LinearLayout1」と入れておいてください.

 
図1
 

次に,Widgetsの中にあるテキスト(TextView)を配置してください.配置後,Propertiesの欄の

  • IDを「entrance_year」にかえてください.文字の内容はなんでもいいです.
  • textを「入学年」にかえてください.文字の内容はなんでもいいです.
 

これは,入力欄の見出しになります.実際の数字の入力欄は,TextFields(EditText)の中にある Plain Textで作成します.Plain Textを「入学年(TextView)」の近くに配置してください.図2左下の,Component Treeの LinearLayout上に持っていくと配置しやすいです.

 
図2
 

IDは「editText1」,textは「西暦」にしておいてください. これらの配置後に,linearLayoutの layout_heightの欄で「wrap_content」を選択します(先に選択してしまうとややこしくなるので,文字等の配置後に変更します).

 

その他の入力欄を作成します.
入学年の下に,新しくLinearLayoutを配置して,まったく同じように IDに「LinearLayout2」を設定します.layout_heightの欄に「wrap_content」を設定するのは,以下の文字の配置後です.
「入学年」のときと同じように,「今日の日付」というPlain Textを配置してください.IDは好きな文字列でOKです.ここでは「today」というIDにしておきます.

 

最後に,ボタンを二つ配置します.一つは「今日の日付」の横に配置してください.このボタンのIDを「date」とします.
もう一つは,画面の下側に配置します.IDは「button」とします.

 

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

 
図3
 

計算ボタンの下に,もう一つtextViewを配置して,計算結果を表示する場所を用意します.IDは「result」とします.

入力した数字の取得

EditText欄に入力されたテキストは,下記の方法で取得できます.

       // 入力欄の内容をIDから取得
       EditText editText1 = (EditText)findViewById(R.id.editText1);
       // 取得した内容を文字列として認識
       String str1 = editText1.getText().toString();
       // 入力されたのは数字なので,数字になおす
       int entranceYear = Integer.parseInt(str1);
 

ボタンを押して計算

「計算」ボタンを押すと,2017年から入学年の個所に入力した数字を引いた数を出力するようにします.

 

まず,「計算」ボタンを選択して,PropertiesのonClick欄に「button_click」と直接入力します.
次に,MainActivity.javaに,ボタンが押されたときの動作の内容を追記します.
「public class MainActivity extends AppCompatActivity { 」の中に,下記の内容を追記してください.

   static int thisYear = 2017;
   
   // 計算ボタンがクリックされたときの動作
   public void button_click(View view){
       // 入力欄の内容をIDから取得
       EditText editText1 = (EditText)findViewById(R.id.editText1);
   
       // 取得した内容を文字列として認識
       String str1 = editText1.getText().toString();
       // 入力されたのは数字なので,数字になおす
       int entranceYear = Integer.parseInt(str1);
       // 現在の西暦は2017年なので,入学してから何年経つかを引き算で計算する
       int calc = thisYear - entranceYear;
   
       // 計算結果を出力
       TextView textView1 = (TextView)findViewById(R.id.result);
       String str3 = String.valueOf(calc);
       textView1.setText("入学してから"+str3+"年です");
   }
 

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

日付設定ダイアログを使ってみる

直接文字で入力するほかに,ダイアログから選択させる方法もあります.
少し長いですが,以下の内容を追記します.

   public static class DatePickerFragment extends DialogFragment implements
           DatePickerDialog.OnDateSetListener {
   
       @Override
       public Dialog onCreateDialog(Bundle savedInstanceState) {
           Calendar calendar = Calendar.getInstance();
           int year = calendar.get(Calendar.YEAR);
           int month = calendar.get(Calendar.MONTH);
           int dayOfMonth = calendar.get(Calendar.DAY_OF_MONTH);
   
           DatePickerDialog datePickerDialog = new DatePickerDialog(getActivity(),this, year, month, dayOfMonth);
   
           return datePickerDialog;
       }
   
       public void onDateSet(DatePicker view, int year, int month, int day) {
           //日付が選択されたときの処理
           thisYear = year;
       }
   }
   
   public void onDateButtonTapped(View view) {
       DialogFragment picker = new DatePickerFragment();
       picker.show(getFragmentManager(), "datePicker");
       TextView textView1 = (TextView)findViewById(result);
       textView1.setText("ボタンが押されました");
   }

次に,activity_main.xmlの画面で,「タップで入力」としていたボタンを選択し,PropertiesのonClick欄に「onDateButtonTapped」を直接入力します.

これでボタンの設定は終了です.
実行して,動作内容を確認してみてください.