14.event-handling

Transcription

1 14. Event-Handling イベント処理 (Event Handling) 今回は Windows の Form アプリケーションで 様々なイベント を表示する時のプログラムです 題材として 以下のプログラムを使います 何のプログラムか? 見ての通りです 全く同じプログラムで 先頭 の数行を変更するだけでサイズや通路の広さを変えることができます 試してみてください なお 縦 と 横 のサイズは一致させています マウスやキーの操作を Event として処理するプログラムを導入します かなり駆け足ですが Windows や Android, iphone/ipad などのプログラムを書く上で基本となる要素を これでほとんどす べて学習したことになります 今回のプログラムでは プログラムの主要なパーツは ファイルで提供します 関数群は提供されたファイルからコピーして下さい Form アプリケーションなので 画面設計は各自が行う必要がありますが 部品となる関数はダウンロードして使えます 1

2 13.Sorting-Algorithm ですが Event 処理などのプログラムの骨格となる部分は 各自が 生成してください まず 教材の先頭部分です 定数を設定しま す const int MAZE_SIZE = 31; const int BLOCK_SIZE = 10; const int SPACE = 0; const int WALL = 1; const int ENTRANCE = 2; const int EXIT = 3; const int I_AM_HERE = 4; MAZE_SIZE は 迷路のサイズで 必ず奇数で設定してください 理由は 壁 通路 壁 通路と組み合わせていって 最後は壁になるため 迷路を表す行列のサイズが必ず奇数になるためです ブロックサイズは 通路の幅で ピクセル数 で指定します 従って この迷路を実現する には 迷路のゾーンは = 310 で 310 ピクセル以上の大きさに設定 します 各自 適当な数値に変えて試してみ てください 2

3 14. Event-Handling 次に Form に部品を配置してください 今回は 全部で部品数は 5 つです Button mazebutton 迷路の作成 ボタン Label elapsed 経過時間表示用 Label label1 メッセージ表示 PictureBox zone 描画領域 Timer timer1 時間カウント用 また 変数は以下のものを使います int[,] maze; Bitmap bmppicbox; int int current_x, current_y; span_sec, span_min; SolidBrush brushblue; SolidBrush brushyellow; SolidBrush brushgreen; SolidBrush brushwhite; Random rnd; SolidBrush は ペンキ塗りのハケ です 予め 青 黄色 緑 白 を用意しておいて描画に使用します span_sec, span_min には 経過秒 経過分を記録します current_x, current_y は 今現在の X 座標と Y 座標を保存します bmppicbox は Bitmap で zone のグラフィクス領域を予め取 得しておきます 3

4 13.Sorting-Algorithm ここまでの定義画面は 以下のようになります ( 自動生成されているものに 組み込んで下さい ) 4

5 14. Event-Handling これらの変数の コンストラクタ デストラクタも忘れず実行して ください ( 自動生成されたものも含めています ) 次に まず Form1 の属性 KeyPreview を true に設定します これは 迷路を抜ける操作のためにキーボードから読み込んだ char データ をプログラムで読み込めるようにします ( これを忘れると キーに反応しなくなります ) mazebutton ボタンは このボタンが押されると 迷路の作成処理 を実行します make_maze(); という関数を用意してあるので ボタンが押されたら make_maze() をコールするようにプログラムして下さい 5

6 13.Sorting-Algorithm mazebutton ボタンが押された時の処理は 画面上の mazebutton ボタ ンをダブルクリックすることで 関数 の入れ物が自動的に生成されます ここから 今日の新しい内容です 画面に配置した様々な部品には Event が定義されています Form1 に対してイベント属性の定義を表示させてください Click は クリックされた 時に呼び出される関数を定義します DoubleClick は ダブルクリックされた 時の関数 他にも マウスが範囲内に入った時の処理関数など 様々な イベント を定義することができま す Form のデザイン画面上でダブルクリックした時に自動生成される イベントは 1 種類ですが 実際には様々なイベントがあります ここでは KeyPress イベントに対するイベントハンドラを登録し て キー入力を表示させずに制御用に取り込んでみます Form1 のイベントの KeyPress の関数入力部でダブルクリックします そうすると Form1.h には Form1_KeyPress というイベン トハンドラ関数が自動生成されます これはちょうど makemaze ボタンをクリックした時に makemaze ボタンのクリック用イベントハンドラが自動生成され たのとおなじことです 6

7 14. Event-Handling この自動生成されたイベントハンドラから key_proc( ); という関数 をコールしてみましょう 但し ここではキーコードを処理するので e -> KeyChar というパラメータを手渡します key_proc( (int)e->keychar ); mazebutton_click と Form1_KeyPress から 関数コールを呼び出すプログラムを書くと 以下のようになります この段階では make_maze や key_proc にはエラーの赤い波線が出ているはずですが 最後に一気にコピペします. 今は気にしないで下さい さらに 今回は新しく Timer のイベントを定義しました ここでは 時計 を動かすだけのためにタイマーを使っていますが 実際のゲームでは 0.2 秒ごと (1 秒間に 5 コマ ) などの早さでキャラクターの絵を変化させるのに使ったりします ここで タイマー のデザインアイコンをクリックして プロパティを表示させ てみてください Interval という値があります ミリ秒単位でタイマーを起動することができます Enabled のプロパティ値が True になると このタイマーは起動します ここでは 1000 ミリ秒に設定しましょう 7

8 13.Sorting-Algorithm タイマーの値が設定値になった 時 (1000 になった時 ) に 呼び出される関数を イベント定義のペインで設定します Tick の部分をダブルクリックすると Tick のイベントハンドラが自動的に生成されます タイマーが時間になった時の処理は 付属のファイルに含まれていますので それを使ってください 今回は 自動生成された Tick のイベントハンドラでは timer_tick( ); という関数をコールするだけで実装ができます ここまでの イベントハンドラの画面を見ると 次のようになって います 8

9 14. Event-Handling ここで ネットの教材掲示のサイトから program_parts.cpp をダウンロードして 表示させて下さい 以下のようなファイルになります このファイルを すべて選択 コピー して 以下の場所に貼付けます 括弧の対応に気をつけて下さい 自動生成されたメソッドの {} の中に貼付けると おかしなことになります インデントで深さを確認 することが大切になります 報告課題(1) 上記の説明に従い ネット教材サイトからダウンロードした関数も活用して 迷路プログラムを完成させてください 実行時のスクリーンショットを添付してください ここまでで C 評価 (6 点相当 ) とします 迷路内の移動は j( 左 ) k( 右 ) i( 上 ) m( 下 ) のキーです 使いやすいキーに書き換えても構いません 9

10 13.Sorting-Algorithm 報告課題(2) 迷路のサイズを変えて 動作させ 変更点について説明し サイズを変えた迷路のスクリーンショットを添えて報告してください ( ここまでで評価を1 段階上げ 漏れがなければ B 評価とします ) 報告課題(3) 迷路作成から 30 秒が経過すると Time Out で Game Over となるようにプログラムしてください (2 コマ目で正解を提示します ) ここまでの報告で A 評価とします (10 点満点中 8 点 ) 報告課題(4) 迷路作成アルゴリズムの問題です 現在のアルゴリズムは 何も接続されていない柱 を 必ず 壁 に接続するようにプログラムされています 壁 mark 配列には 2 が格納されています これによって 出方が1 通りの迷路 ができるようになります 柱を柱に接続し 外側の壁につながっていない 壁 も生成可能とするには まだ壁に接続されていない柱(mark が 1) を まだ壁に接続されていない柱 と接続させても構わない というアルゴリズムに修正すると 脱出方法 が複数とおりある迷路となります 接続先の mark 配列が 1 であっても 壁を作る ようにアルゴリズムを修正して 出来上がった迷路を比較してください ここまでの報告で S 評価とします (10 点満点中 9 点 ) 報告課題(5) 脱出方法が複数ある迷路で 乱数 によって 障害物 を生成させると どんな画面になるか プログラムに挑戦してみて下さい 障害物は 赤い とします この課題に成績の上限は設けません 例えば 5 秒ごとに 障害物 が 1 個ずつ発生して来て モタモタしている と迷路を脱出できなくなる というプログラミングが可能です す イベントハンドラの生成が 今日のプログラミングの要点ポイントになりま 10