Comments
Description
Transcript
第1章
第1章 初めてのプログラミング 本章では、カウントアップというボタンを押すと表示されている値が1ずつ増加 し、カウントダウンというボタンを押すと表示されている値が1ずつ減少する簡単 な 機 能 の プ ロ グ ラ ム を 作 り 、 こ れ を 通 し て Vi sua l B a si c .NE T に よ る プ ロ グ ラ ム 開 発 の概要を学んでいきます。 1.1 起 動 とプロジェクトの新 規 作 成 V i s u a l S t ud i o. N E T の 起 動 と プ ロ ジ ェ ク ト の 新 規 作 成 の 方 法 を V i s u a l S t u d i o. N E T Ve r s i o n 2 0 0 3 で 説 明 し ま す 。 な お 、 バ ー ジ ョ ン が 異 な る 場 合 は 、 操 作 方 法 が 若 干 違 いますので、本節の起動とプロジェクトの新規作成の部分については、それぞれの バージョンのマニュアルまたはヘルプをお読みください。 ①[スタート]ボタンをクリックします。 ②[すべてのプログラム]をポイントします。 ③ [ M i c ro s o f t V i s ua l S t u d i o. N E T 2 0 0 3 ] を ポ イ ン ト し ま す 。 ④ [ M i c ro s o f t V i s ua l S t u d i o. N E T 2 0 0 3 ] を ク リ ッ ク し ま す 。 ①クリック ②ポイント ③ポイント 1 ④クリック V i s u a l S t ud i o. N E T が 起 動 し 、 以 下 の よ う な ス タ ー ト ペ ー ジ が 表 示 さ れ ま す 。 プログラム開発環境の設定を行ないます。 ⑤スタートページ上部の[マイ プロフィール]タブをクリックします。 ⑥ [ プ ロ フ ィ ー ル ] ボ ッ ク ス の 横 の 三 角 を ク リ ッ ク し 、 表 示 さ れ た 一 覧 で [ V i s ua l B a si c 開 発 者 ] を ク リ ッ ク し 選 択 し ま す 。 ⑤クリック ⑥クリック [ Vi s u al B a si c 開 発 者 ]を 選 択 2 プ ロ ジ ェ ク ト を 作 成 し ま す 。 プ ロ ジ ェ ク ト と は 、 Vi s u al B a si c . NET に お け る プ ロ グラム開発の単位です。1つのプロジェクトで1つのアプリケーションプログラム を作成します。 ⑦スタートページ上部の[プロジェクト]タブをクリックします。 ⑧[新しいプロジェクト]をクリックします。 ⑦クリック ⑧クリック 下のような[新しいプロジェクト]ダイアログボックスが表示されます。 3 プロジェクトの種類、名前、保存場所などを指定します。 ⑨ プ ロ ジ ェ ク ト の 種 類 の 中 で 、[ V i s ua l B a s i c プ ロ ジ ェ ク ト ] を ク リ ッ ク し ま す 。 ⑩ テ ン プ レ ー ト 中 の [ Windows ア プ リ ケ ー シ ョ ン ] を ク リ ッ ク し ま す 。 ⑪[ プ ロ ジ ェ ク ト 名 ]ボ ッ ク ス に プ ロ ジ ェ ク ト 名 を 入 力 し ま す 。こ こ で は 、 「例題1」 と い う 名 前 に し た い と 思 い ま す の で 、「 例 題 1 」 と 入 力 し て 下 さ い さ い 。 ⑫ [ O K] を ク リ ッ ク し ま す 。 ⑨クリック ⑪プロジェクト名の入力 ⑩クリック ⑫クリック 保存場所を指定した い場合はクリック プロジェクトの作成場所を指定したい場合は、作成場所のフォルダ名を直接入力 してもいいのですが、 [ 参 照 ]ボ タ ン を ク リ ッ ク す る と 、保 存 場 所 指 定 の ダ イ ア ロ グ ボックスが表示されますのでクリックにより指定することができます。今回のよう にプロジェクトの作成場所を指定しない場合は、作成場所の初期値であるマイドキ ュ メ ン ト 内 の 「 Vi s ua l St ud io Pro j e c t s」 と い う 名 前 の フ ォ ル ダ に プ ロ ジ ェ ク ト が 作 成されます。 4 1.2 プログラム作 成 V i s u a l B a si c . N E T で の プ ロ グ ラ ム 開 発 は 、 次 の 3 つ の ス テ ッ プ で 行 な い ま す 。 Ⅰ.コントロールの配置 コントロールとは、プログラムを作り上げるために用意されている色々な部品で す。プログラム開発の第1ステップでは、ツールボックスからコントロールを選択 して、フォームに配置していきます。この操作で、フォームに配置されたコントロ ールをオブジェクトといいます。 Ⅱ.プロパティの変更 オブジェクト(フォームに配置された部品)には、様々な性質があります。色、 大きさ、位置、表示されている文字などがそうです。この性質のことをプロパティ といいます。プログラム開発の第2ステップでは、オブジェクトのプロパティを変 更します。プロパティの変更は、プロパティウィンドウで行ないます。 Ⅲ.プログラムコードの入力 オブジェクトに刺激(イベント)が発生した場合に実行されるプログラムコード を、イベントプロシージャといいます。プログラム開発の第3ステップでは、1個 以上のオブジェクトに対してイベントプロシージャを記述します。プログラムコー ドの入力は、コードウィンドウで行ないます。 ツールボックス フォーム プロパティウィンドウ 5 (1)コントロールの配置 ① ツ ー ル ボ ッ ク ス の B u tt o n コ ン ト ロ ー ル を ク リ ッ ク し ま す 。 ①クリック ② フ ォ ー ム 上 の B utt o n を 配 置 し た い 場 所 で ク リ ッ ク し ま す 。 こ の Butt o n は 最 初 に 配 置 し た B u tt o n な の で B u tt o n1 と い う オ ブ ジ ェ ク ト 名 が 付 け ら れ ま す 。配 置 し た オブジェクトの場所は、ドラッグ(マウスの左ボタンを押した状態で移動)によ り変更できます。また、オブジェクトの大きさは、ハンドル(配置したオブジェ クトの周りに表示されている8個の四角)をドラッグすることにより変更できま す。 ②クリック 6 ③ ツ ー ル ボ ッ ク ス の Label コ ン ト ロ ー ル を ク リ ッ ク し ま す 。 ③クリック ④ フ ォ ー ム 上 の L a b e l を 配 置 し た い 場 所 で ク リ ッ ク し ま す 。 こ の La b el は 最 初 に 配 置 し た Labe l な の で La b el 1 と い う オ ブ ジ ェ ク ト 名 が 付 け ら れ ま す 。 ④クリック 7 (2)プロパティの変更 ① フ ォ ー ム 上 の B utt o n 1 を ク リ ッ ク し て 選 択 し ま す 。 プ ロ パ テ ィ ウ ィ ン ド ウ に 、 選 択したオブジェクトのプロパティ名と設定値が表示されます。 ② B u tt o n 1 の Tex t プ ロ パ テ ィ の 初 期 値 は 「 B utton1 」 に な っ て い ま す 。 こ れ を 「 カ ウ ン ト ア ッ プ 」に 変 更 し て く だ さ い 。Tex t プ ロ パ テ ィ を 変 更 し た こ と で 、B u t t o n 1 と う オ ブ ジ ェ ク ト に 表 示 さ れ る 文 字 は「 B ut t o n 1 」か ら「 カ ウ ン ト ア ッ プ 」に 変 わ ります。 ①クリック ② Te x t プ ロ パ テ ィ の 変 更 ③ フ ォ ー ム 上 の Labe l 1 を ク リ ッ ク し て 選 択 し ま す 。 ④ L a b el 1 の Tex t プ ロ パ テ ィ を 「 0」 に 変 更 し て く だ さ い 。 ③クリック ④ Te x t プ ロ パ テ ィ の 変 更 8 (3)プログラムコードの入力 ① フ ォ ー ム 上 の B u tt o n 1 を ダ ブ ル ク リ ッ ク し ま す 。 ①ダブルクリック 中央にコードウィンドウが表示されます。コードウィンドウには、現在のフォー ム に 関 す る プ ロ グ ラ ム コ ー ド が 既 に 入 力 さ れ て い ま す 。 ま た 、 Butt o n 1 を ダ ブ ル ク リ ッ ク し た こ と に よ り 、次 の よ う な プ ロ グ ラ ム コ ー ド が 自 動 的 に 作 成 さ れ て い ま す 。 P r i v a t e S u b B u t to n 1 _ C l i c k (…省 略 … ) H a n d l e s B u t t o n 1 . C l i c k End Sub 9 ②プログラムコードの記述 P r i v a t e S ub B u t t o n 1_ C l i c k と E n d S u b の 間 に 下 の よ う に 網 掛 け の 行 を 入 力 し て く ださい。 P r i v a t e S u b B u t to n 1 _ C l i c k (…省 略 … ) H a n d l e s B u t t o n 1 . C l i c k L a b el 1 . T e x t = V al ( L ab e l 1 . T e x t ) + 1 End Sub 自 動 生 成 さ れ た 1 行 目 の 後 ろ の 部 分 が 、 H a n d l e s B u t t o n 1. C l i c k に な っ て い る こ と を 確 認 し て く だ さ い 。 こ れ は 、 B utt on 1 を Cl ic k( ク リ ッ ク ) し た と い う 刺 激 ( イ ベ ン ト ) に よ っ て P ri va t e S u b か ら E nd S u b ま で の 間 に 記 述 し た プ ロ グ ラ ム コ ー ド が 実行されることを表しています。 記 述 し た プ ロ グ ラ ム コ ー ド 中 の L a b el 1 . T e x t と い う の は 、L a v e l 1 の T e x t プ ロ パ テ ィの値を表します。このように、あるオブジェクトのプロパティの値を指定する場 合、オブジェクト名の後ろにドットを打ちプロパティ名を記述します。 Va l と い う の は 文 字 列 を 数 値 に 変 換 す る 関 数 で す 。 ま た 、「 =」 は 等 し い と い う 意 味ではなく、右辺の値を左辺に代入するという動作を表します。 こ の プ ロ グ ラ ム は 、 B utt o n 1 を ク リ ッ ク す る と 、 Lavel 1 の T e x t プ ロ パ テ ィ の 値 に 1 を 加 え て 、 そ れ を 新 た な La v e l 1 の Te x t プ ロ パ テ ィ の 値 に し な さ い と い う こ と を 表 し て い ま す 。 こ れ に よ り 、 B u t to n 1 を ク リ ッ ク す る 度 に L a b e l 1 に 表 示 さ れ て い る 値が1ずつ増加します。 ②プログラムコードの記述 10 先 ほ ど は 、 フ ォ ー ム 上 の B u tt o n 1 を ダ ブ ル ク リ ッ ク す る こ と に よ り プ ロ グ ラ ム コ ードを入力する画面(コードウィンドウ)に自動的に切り替わりました。フォーム を 設 計 す る た め の 画 面( フ ォ ー ム デ ザ イ ナ )に 戻 る に は 、For m 1 . v b [ デザ イ ン] と い う タ ブ を ク リ ッ ク し ま す 。ま た 、Fo r m 1 . vb と い う タ ブ を ク リ ッ ク す る と 再 び コ ー ド ウ ィンドウに切り替ります。 フォームデザイナーの画面 クリック コードウィンドウの画面 クリック 11 (4)実行 ①ツールバーの開始ボタンをクリックします。 ①クリック 下のようなウィンドウが表示されます。 プログラムにエラーがある場合 下のようなウィンドウが表示されるの で 、[ い い え ] の ボ タ ン を ク リ ッ ク の 後 、 プログラムを修正します。 ②カウントアップのボタンをクリックして動作を確認してください。 ③右上の閉じるボタンをクリックするとプログラムが終了します。 ③クリック ②クリック 12 (5)保存と終了 ①作成したプロジェクトを保存するには、メニューバーの[ファイル]をクリック して表示されたプルダウンメニュー内の[すべてを保存]をクリックします。保 存場所とファイル名は、プロジェクトを作成したときに付けているので、ここで は入力する必要はありません。 ①クリック ② Visual Basic.NET の 終 了 は 、 メ ニ ュ ー バ ー の [ フ ァ イ ル ] を ク リ ッ ク し て 表 示 さ れたプルダウンメニュー内の[終了]をクリックします。 ②クリック 13 1.3 プロジェクトの呼 出 と修 正 前節で作成したプログラムは、ボタンを押すとカウントアップする機能のプログ ラムでした。ここでは、ボタンをもう1つ追加してカウントダウンの機能を付け加 えてみましょう。 (1)プロジェクトを開く V i s u a l B a si c . N E T を 起 動 後 に 表 示 さ れ る ス タ ー ト ペ ー ジ の 画 面 に 、 開 き た い プ ロ ジェクトの名前が表示されていれば、クリックするだけでそのプロジェクトを開く ことができす。しかし、今回は一般的な方法でプロジェクトを開いてみましょう。 ① V i s u a l B a s i c . N E T を 起 動 し た 後 、メ ニ ュ ー バ ー の[ フ ァ イ ル ]を ク リ ッ ク し ま す 。 ①クリック ここに表示されている 場合は、クリックする だけで開くことができ ます。 ② 表 示 さ れ る プ ル ダ ウ ン メ ニ ュ ー 内 の[ ソ リ ュ ー シ ョ ン を 開 く ]を ク リ ッ ク し ま す 。 ②クリック 14 ③プロジェクトの作成時に指定した場所にプロジェクト名と同じ「例題1」という 名前のフォルダがありますのでダブルクリックします。 ③クリック ④ 例 題 1 の フ ォ ル ダ の 中 身 が 表 示 さ れ ま す の で 、 そ の 中 の 「 例 題 1 .sln」 と い う フ ァイルをダブルクリックしてください。 ④ダブルクリック 15 (2)コントロールの追加とプロパティの設定 ① B u tt o n 1( カ ウ ン ト ア ッ プ と 表 示 さ れ て い る ボ タ ン )を ド ラ ッ グ し て 左 に 移 動 し ま す。 ① ド ラ ッ グ( 左 に 移 動 ) ② ツ ー ル ボ ッ ク ス の B u tt o n コ ン ト ロ ー ル を ク リ ッ ク し ま す 。 ②クリック 16 ③ フ ォ ー ム 上 の B utt o n を 配 置 し た い 場 所 で ク リ ッ ク し ま す 。 配 置 し た B u tt on は 2 番 目 に 配 置 し た Button な の で 、 Button2 と い う オ ブ ジ ェ ク ト 名 が 付 け ら れ ま す 。 ③クリック ④ B u tt o n 2 の Tex t プ ロ パ テ ィ の 初 期 値 は 「 B u tt on 2」 に な っ て い ま す 。 こ れ を 、「 カ ウントダウン」に変更してください。 ⑤ B u tto n2 に 「 カ ウ ン ト ダ ウ ン 」 と い う 文 字 が 全 て 表 示 で き な い 場 合 は 、 ド ラ ッ グ によりボタンの大きさを変更してください。 ⑤ ド ラ ッ グ( B utt o n2 を 大 き く す る ) ④ Te x t プ ロ パ テ ィ の 変 更 17 (3)プログラムコードの入力 ① フ ォ ー ム 上 の B u tt o n 2 を ダ ブ ル ク リ ッ ク し ま す 。 ①ダブルクリック コ ー ド ウ ィ ン ド ウ に 切 り 替 り ま す 。 ま た 、 B ut t o n 2 を ダ ブ ル ク リ ッ ク し た こ と に より、次のようなプログラムコードが自動的に作成されています。 P r i v a t e S u b B u t to n 2 _ C l i c k (…省 略 … ) H a n d l e s B u t t o n 2 . C l i c k End Sub 18 ②プログラムコードの記述 P r i va t e S u b B ut t o n 2_ C l i c k と E n d S u b の 間 に 下 の よ う に 網 掛 け の 行 を 入 力 し て く ださい。 P r i v a t e S u b B u t to n 2 _ C l i c k (…省 略 … ) H a n d l e s B u t t o n 2 . C l i c k L a b el 1 . T e x t = V al ( L ab e l 1 . T e x t ) – 1 End Sub 今 回 自 動 生 成 さ れ た プ ロ グ ラ ム コ ー ド の 1 行 目 の 後 ろ の 部 分 が 、 Ha ndl e s B u t t o n 2 . C l i c k に な っ て い る こ と を 確 認 し て く だ さ い 。 こ れ は 、 B ut t o n 2 を C l i ck( ク リ ッ ク ) し た と い う 刺 激 ( イ ベ ン ト ) に よ っ て P ri va t e S u b か ら E n d S u b ま で の 間 に記述したプログラムコードが実行されることを表しています。 こ の プ ロ グ ラ ム は 、B u tt o n 2 を ク リ ッ ク す る と 、L a v el 1 の T e x t プ ロ パ テ ィ の 値 か ら 1 を 減 じ て 、 そ れ を 新 た な La v e l 1 の T ex t プ ロ パ テ ィ の 値 に し な さ い と い う こ と を 表 し て い ま す 。 こ れ に よ り 、 B utt o n2 を ク リ ッ ク す る 度 に L a b e l 1 に 表 示 さ れ て い る値が1ずつ減少します。 ②プログラムコードの記述 19 (4)実行 ①ツールバーの開始ボタンをクリックします。 ①クリック 下のようなウィンドウが表示されます。 ②カウントアップとカウントダウンのボタンをクリックして動作を確認してくださ い。 ③右上の閉じるボタンをクリックするとプログラムが終了します。 ③クリック ②クリック 20 (5)保存と終了 ①メニューバーの[ファイル]をクリックして表示されたプルダウンメニュー内の [すべてを保存]をクリックし、修正したプログラムを上書き保存します。 ①クリック ②メニューバーの[ファイル]をクリックして表示されたプルダウンメニュー内の [ 終 了 ] を ク リ ッ ク し 、 Vi s ua l B a si c . NE T を 終 了 し ま す 。 ②クリック 後は、私の著書 ゼ ロ か ら 始 め る Vi sua l B a s i c .NE T 入 門 の第 2 章から読んでください。 21 基礎からゲーム作成まで