初心者のためのゲームプログラミング入門

プログラミングとゲームの杜

初心者のためのプログラミング入門 & ゲームプログラムの作り方入門

Visual C# 2019 入門

22.算数ドリルを作ろう その7

 

今回は [ 算数ドリルを作ろう その6 ] の続きです。

この講座を作っているとき「解答を説明する」というより「解き方を説明する」ように意識しています。
そのため話が長くなってます。

プログラミングって「 物事を噛み砕いてそれを再構築していく作業 」というように思ってたりします。
解答を記憶するよりプロセス(過程や方法など)に慣れてください。

 

 

出題した数をカウントしよう

出題した数をカウントする仕組みを作ります。
ずっと続けているより、決まった問題数を解く方がモチベーションもあがります。

出題数をカウントする

 

出題数をカウントする変数 mondaiCnt と、
出題の最大数を設定する変数 mondaiMax を用意しました。
それから成績を表示するためのメソッド Seiseki を作りました。
まだ成績を表示しませんが、解答欄を入力できないようにして問題をクリアします。

出題数のカウントで(63 行目)
mondaiCnt++;
と書きました。みなさん覚えてますか、次の式と同じ動きをします。
mondaiCnt += 1;

 

 

それでは実行してみましょう。
出題数は5問にしてあるので、それ以降は入力できなくなります。

 

問題を終了すると入力できない

 

 

 

成績を表示しよう

成績を表示するようにします。
カウントした正解数を最後に表示します。
プログラムを変更している場所を間違えないようにしましょう。

正解数をカウントする

 

正解数をカウントする変数 seikaiCnt を用意しました。
開始ボタンが押されたらカウントを初期化し、答え合わせのとき正解ならカウントします。
最後に成績を表示する、といったシンプルな仕組みです。

 

 

それでは実行してみましょう。
正解数が表示されるようになりました。

 

正解数を表示する

 

 

ラジオボタンとグループボックス

問題数や計算タイプを変更する仕組みに、ラジオボタンを使ってみましょう。
タイプをグループ分けするのには、グループボックスを使います。
完成すると次のようになります。
ラジオボタンは、どれか1つだけを選択させるときに使います。

 

ラジオボタンとグループボックスを使う

 

 

それではグループボックスを配置してみましょう。
ツールボックスのコンテナーを開き、GroupBox をフォーム上へ配置します。
配置したら適当にサイズを調整して、2つ目のグループボックスを配置します。
2つ目も適当にサイズを調整しましょう。
全体の調整はあとでします。ここは適当でかまいません。

 

グループボックスを配置

 

 

次はラジオボタンです。
ラジオボタンはコモンコントロールにあります。
RadioButton をグループボックスの中に配置していきます。
グループ1に2つ、グループ2に3つ配置します。

 

ラジオボタンを配置する

 

 

実行してみましょう。
グループボックス内に配置するだけで、すでにラジオボタンとしての機能が働きます。
それぞれのグループで1つだけ選べることを確認してください。

 

ラジオボタンは1つだけ選択できる

 

 

プロパティの変更

グループボックスの Text プロパティを変更すると見出しが変わります。
groupBox1 の Text を「 タイプ 」
groupBox2 の Text を「 問題数 」に変更しましょう。

 

グループボックスのプロパティ変更

 

 

次に、ラジオボタンの Text プロパティも変更しましょう。
「足し算」「引き算」「10問」「20問」「30問」
というように変更します。

 

ラジオボタンのTextプロパティを変更する

 

 

これですべての配置が終わりました。
全体を見ながら、それぞれの配置を変更してください。
マウス操作だけでも綺麗に並べられると思いますが、上手くできないときは
配置プロパティの項目を直接変更してもいいと思います。

 

コントロールの配置を整える

配置やサイズをプロパティで変更する

 

ちなみに上の画像の10問は、プロパティに書き込むとき
10と問の間にスペースを1つ入れてあります。(20問30問も同様に)
フォントのタイプによっても違いますが、スペースを入れた方が綺麗に見える場合があります。

 

 

Checked プロパティ

ここで実行してみます。

ラジオボタンにチェックが付いていない

 

実行直後は、ラジオボタンにチェックが付いてません。(黒い点のこと)
このままでは、どれか選択してもらう必要が出てきます。
それでは不親切なので、足し算と10問をデフォルトでチェックありの状態にします。

 

 

まず、足し算をクリックして Checked プロパティを True に変更します。
次に10問をクリックして同じく変更します。

 

ラジオボタンのcheckedプロパティをTrueにする

 

実行してみます。
足し算と10問にチェックが付きました。

 

ラジオボタン 初めからチェックを付ける