竜太のテクニカルメモ

物理やへっぽこなゲーム作りについて易しく解説するよ

ユニティちゃんライセンス

このブログはユニティちゃんライセンス条項の元に提供されています

C#でダンジョンRPGを作ってみる(2)~フォームエディタでメインウィンドウを作ろう!~

さて,今回からやっとC#でのコーディングに移るわけですが,その前にC#の開発環境を構築しなければなりません. これは案外簡単でマイクロソフトから出ているvisual studioと呼ばれるIDE(統合開発環境)をインストールするだけです.やり方は次を参照:

qiita.com

インストールが終わったら早速Visual Studioを立ち上げます. 新しいプロジェクトの作成を選択します. Windowsフォームアプリケーション(.NET Framework)を選択して次へをクリックします:

f:id:lagrangian:20210115073839p:plain
ダンジョンゲーム制作(2)1

次の画面ではプロジェクト名を例えばDungeonExplorerなどとします. このとき自動でソリューション名も同じ名前が入ります.またフレームワーク.NET Framework 4.8を選んでください(新しいものなら多少バージョンが違っていても恐らく大丈夫です).

f:id:lagrangian:20210115074715p:plain
ダンジョンゲーム制作(2)2

作成をクリックすると次の画面になります:

f:id:lagrangian:20210115075331p:plain
ダンジョンゲーム制作(2)3

画面に表れているのはこれから作成するメインウィンドウになります.ここでボタンやラベルなどを配置して外観を作ってゆきます.こうしてビジュアル的に作っていったものがコードとしてForm1.Designer.csに保存されて利用できるようになります.

しかし今回はコードを一本化したいのでまず最初に左のソリューションエクスプローラーからProgram.csをクリックしメインのコードを書き換えます.

f:id:lagrangian:20210115080952p:plain
ダンジョンゲーム制作(2)4

ここでエディタ画面の7行目から23行目までを次のように書き換えます:

class DungeonGame : Form
{
    public static void Main()
    {
        Application.Run(new DungeonGame());
    }

    public DungeonGame()
    {

    }
}

こうして開始ボタンをクリックすると,

f:id:lagrangian:20210115090056p:plain
ダンジョンゲーム制作(2)5

↑のようなアプリケーションウィンドウが立ち上がりました! ・・・ただ,これだけだと先ほど見えていたForm1と外観が違いますね. そこでこれからこのアプリケーションウィンドウの中身のボタンやラベルを作成していきたいと思います. アプリケーションウィンドウを閉じて,左側のソリューションエクスプローラーからForm1.csをクリックします. 画面にForm1ウィンドウが立ち上がるのでウィンドウ内で右クリックしてプロパティを選択します:

f:id:lagrangian:20210115092159p:plain
ダンジョンゲーム制作(2)6

プロパティでTextをダンジョンエクスプローラーとして確定すると,プレビューされているForm1のタイトルバーの表示がダンジョンエクスプローラーに変わります. さて,今回のゲームで使用する画像はタイトル画面も含めて全て600×600ピクセルにしたいのですが,あいにくフォームエディタからはフォームのクライアント領域を正確に決定する指定はプロパティとして用意されていません.細かいとこまでビシッっと決めたい方は

johobase.com

を参考にしてください.ここでは大雑把にプロパティでSizeのところの+マークをクリックして,Widthを610,Heightを630にします. 次のような表示になっていればOKです:

f:id:lagrangian:20210115093103p:plain
ダンジョンゲーム制作(2)7

今度はスタートボタンを配置してみましょう. [表示]→[ツールボックス]を選択すると,コントロールと呼ばれるボタン類を配置するためのウィンドウが立ち上がりますので,その中から[コモンコントロール]→[button]を選択します:

f:id:lagrangian:20210115094202p:plain
ダンジョンゲーム制作(2)8

ボタンをフォームの真ん中あたりに配置します.button1が配置されますのでbutton1をクリックしてからプロパティでTextを「ゲームを始める」に変えます. またボタンの四隅を引っ張って大きさを調節したり位置を微調整します.完成するとこんな感じです:

f:id:lagrangian:20210115094955p:plain
ダンジョンゲーム制作(2)9

これで取りあえずタイトル画面のベースはできました.あとは画像とBGMを指定したり,ボタンイベントを設定すればよいですね. そこでまず,[ファイル]→[Form1.csの保存]をして,ソリューションエクスプローラーからForm1.Designer.csをクリックして,このフォームのソースコードを表示します:

するとエディタ画面に「Windows フォーム デザイナーで生成されたコード」という行が見えると思いますので,折りたたまれている24行から58行あたりの以下の部分をクリップボードにコピーします:

        #region Windows フォーム デザイナーで生成されたコード

        /// <summary>
        /// デザイナー サポートに必要なメソッドです。このメソッドの内容を
        /// コード エディターで変更しないでください。
        /// </summary>
        private void InitializeComponent()
        {
            this.button1 = new System.Windows.Forms.Button();
            this.SuspendLayout();
            // 
            // button1
            // 
            this.button1.Location = new System.Drawing.Point(226, 261);
            this.button1.Name = "button1";
            this.button1.Size = new System.Drawing.Size(125, 53);
            this.button1.TabIndex = 0;
            this.button1.Text = "ゲームを始める";
            this.button1.UseVisualStyleBackColor = true;
            // 
            // Form1
            // 
            this.AutoScaleDimensions = new System.Drawing.SizeF(6F, 12F);
            this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
            this.ClientSize = new System.Drawing.Size(594, 591);
            this.Controls.Add(this.button1);
            this.Name = "Form1";
            this.Text = "ダンジョンエクスプローラー";
            this.ResumeLayout(false);

        }

        #endregion

        private System.Windows.Forms.Button button1;
    }

これをProgram.csの一番下あたりに貼ります:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using System.Windows.Forms;

class DungeonGame : Form
{
    public static void Main()
    {
        Application.Run(new DungeonGame());
    }

    public DungeonGame()
    {

    }
    #region Windows フォーム デザイナーで生成されたコード

    /// <summary>
    /// デザイナー サポートに必要なメソッドです。このメソッドの内容を
    /// コード エディターで変更しないでください。
    /// </summary>
    private void InitializeComponent()
    {
        this.button1 = new System.Windows.Forms.Button();
        this.SuspendLayout();
        // 
        // button1
        // 
        this.button1.Location = new System.Drawing.Point(226, 261);
        this.button1.Name = "button1";
        this.button1.Size = new System.Drawing.Size(125, 53);
        this.button1.TabIndex = 0;
        this.button1.Text = "ゲームを始める";
        this.button1.UseVisualStyleBackColor = true;
        // 
        // Form1
        // 
        this.AutoScaleDimensions = new System.Drawing.SizeF(6F, 12F);
        this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
        this.ClientSize = new System.Drawing.Size(594, 591);
        this.Controls.Add(this.button1);
        this.Name = "Form1";
        this.Text = "ダンジョンエクスプローラー";
        this.ResumeLayout(false);

    }

    #endregion

    private System.Windows.Forms.Button button1;
}

ここで「#region Windows フォーム デザイナーで生成されたコード」と「#endregion」の行は今回は余計な行なので削除してください. また,開きカッコ「{」・閉じカッコ「}」の位置や数が正しいかどうか確認してください.もし間違っていると正常に動作しなくなるのですが,恐らく赤い色などで修正してね!という注意の色がついているはずです.さて先ほどフォームエディタで作成したフォームはまだどこからも呼び出されていません. このフォームを使用するにはInitializeComponent()メソッドを実行する必要があります.そこでInitializeComponent();をpublic DungeonGame()の中にコピペして最後にセミコロンをつけましょう. 実行するとこうなります:

f:id:lagrangian:20210115102059p:plain
ダンジョンゲーム制作(2)10

おめでとう!フォームエディタって作成したフォームが立ち上がりました.最後に今回のコードを全部まとめて張っておきますね:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using System.Windows.Forms;

class DungeonGame : Form
{
    public static void Main()
    {
        Application.Run(new DungeonGame());
    }

    public DungeonGame()
    {
        InitializeComponent();
    }

    /// <summary>
    /// デザイナー サポートに必要なメソッドです。このメソッドの内容を
    /// コード エディターで変更しないでください。
    /// </summary>
    private void InitializeComponent()
    {
        this.button1 = new System.Windows.Forms.Button();
        this.SuspendLayout();
        // 
        // button1
        // 
        this.button1.Location = new System.Drawing.Point(226, 261);
        this.button1.Name = "button1";
        this.button1.Size = new System.Drawing.Size(125, 53);
        this.button1.TabIndex = 0;
        this.button1.Text = "ゲームを始める";
        this.button1.UseVisualStyleBackColor = true;
        // 
        // Form1
        // 
        this.AutoScaleDimensions = new System.Drawing.SizeF(6F, 12F);
        this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
        this.ClientSize = new System.Drawing.Size(594, 591);
        this.Controls.Add(this.button1);
        this.Name = "Form1";
        this.Text = "ダンジョンエクスプローラー";
        this.ResumeLayout(false);

    }

    private System.Windows.Forms.Button button1;
}

次回はウィンドウアプリケーションで特に重要なイベント処理について書きます.


ゲーム制作ランキング

にほんブログ村 ゲームブログ ゲーム制作へ
にほんブログ村