りさーちゃーのひよこ: C++/CLI フォームアプリとOpenGLの連携（フォーム新規作成とサンプル）

#はじめに
私自身がど素人なので、頭の回転が遅い自分が理解できるように進めていきます。 
フォームアプリ作成時は.Netが自動でコードを生成してくれるようなのだが、手順ごとの差分に注目して、何をしたときにどういうコードが作られるのかを、非常に簡単なコードを作りながら確認しようと思います。

#作りたいもの
ボタンを押したときに表示される文字列が変わるようなアプリを作ってみます。とってもつまらないですが、これができればあとは応用なので何とでもなるでしょう。 
最終的にはOpenGLとの連携にもって行きたいです。

#C++/CLR フォームアプリ新規作成
フレームワークはC++/CLIにします。C++なら少しは慣れているし、今まで作ったコードもまんま流用できます。C#も興味は持っています。職場でセミナを申し込んだので、それを糧に何か作りたくなったらまたメモを残します。

##1. C++/CLR フォームアプリケーションを新規作成する。
VC2012の解説は次のサイトが秀逸です。ここを参考にフォームの追加まで行います。 
<a href="http://y-okamoto-psy1949.la.coocan.jp/booksetc/introvcpp/vs2012FormApp/" target="_blank" title="">岡本安晴の 心理学C++プログラミングなど - 簡単なVisual C++ フォーム アプリケーション プログラミング</a> 
ありがとうございます。え、手抜き？め、めんどくさいとかありませんよ、たぶん。

##2. 新規作成時のMyForm.h[デザイン]を確認する。
新規作成時のフォームはまっさらです。MyForm.hを選択するとフォームのデザインが見られます。 
ここでボタン等のビジュアルコントロールのデザインができます。 
<a class="detailOn" href="http://blog-imgs-86.fc2.com/m/o/r/morimoridiary254/blog_import_568b66914d501.png" id="i12971987794"><img alt="空フォーム" src="http://blog-imgs-86.fc2.com/m/o/r/morimoridiary254/blog_import_568b66914d501.png" id="1402710838424" ratio="1.45" style="border: none; height: 241.3793103448276px; width: 350px;" /></a> 
この画面をデザイナと呼ぶようです。私は次のような名前をつけました。 
<ul>
<li>プロジェクト名：InitialForm1</li>
<li>フォーム名：MyForm</li>
</ul>
プロジェクト名はミスりましたが、気にしないことにします。

##3. 新規作成時のMyForm.h のコードを確認する。
<table bgcolor="#FFFCCC" border="0" cellpadding="0" style="width: 420px;"><tbody>
<tr><td>#pragma once namespace InitialForm1 { 　　using namespace System; 　　using namespace System::ComponentModel; 　　using namespace System::Collections; 　　using namespace System::Windows::Forms; 　　using namespace System::Data; 　　using namespace System::Drawing; 　　/// 　　/// MyForm の概要 　　/// 　　public ref class MyForm : public System::Windows::Forms::Form 　　{ 　　public: 　　　　MyForm(void) 　　　　{ 　　　　　　InitializeComponent(); 　　　　　　// 　　　　　　//TODO: ここにコンストラクター コードを追加します 　　　　　　// 　　　　} 　　protected: 　　　　/// 　　　　/// 使用中のリソースをすべてクリーンアップします。 　　　　/// 　　　　~MyForm() 　　　　{ 　　　　　　if (components) 　　　　　　{ 　　　　　　　　delete components 　　　　　　} 　　　　} 　　private: 　　　　/// 　　　　/// 必要なデザイナー変数です。 　　　　///  　　　　System::ComponentModel::Container ^components; #pragma region Windows Form Designer generated code 　　　　/// 　　　　/// デザイナー サポートに必要なメソッドです。このメソッドの内容を 　　　　/// コード エディターで変更しないでください。 　　　　/// 　　　　void InitializeComponent(void) 　　　　{ 　　　　　　this->components = gcnew System::ComponentModel::Container(); 　　　　　　this->Size = System::Drawing::Size(300,300); 　　　　　　this->Text = L"MyForm"; 　　　　　　this->Padding = System::Windows::Forms::Padding(0); 　　　　　　this->AutoScaleMode = System::Windows::Forms::AutoScaleMode::Font; 　　　　} #pragma endregion 　　}; }</td></tr>
</tbody></table>
フォームのコントロールを形成する処理が自動で追加されるのですね。

##4. フォームにボタンを追加したときのMyForm.h のコードを確認する。
超絶適当にボタンを追加してみます。 
「表示　→　ツールボックス」を選択するとコントロール一覧が出てくるので、Buttonを選択します。フォーム上でボタンを配置したい矩形領域をマウスで選択します。 
コードを見たいときはMyForm.hを展開し、{} InitialForm1(プロジェクト名)を展開し、MyFormを選択する必要があります。 
<img alt="ボタン追加" src="http://blog-imgs-86.fc2.com/m/o/r/morimoridiary254/blog_import_568b66947e8cf.png" id="1402701999376" ratio="1.445360824742268" style="border: none; height: 242.1540656205421px; margin: 0px 5px; width: 350px;" /> 
以下コードの確認です。赤太字部分が差分です。差分に注目するため、差分位置関係がわかる範疇で省略しています。 
<table bgcolor="#FFFCCC" border="0" cellpadding="0" style="width: 420px;"><tbody>
<tr><td>#pragma once namespace InitialForm1 { 　　// 省略 public ref class MyForm : public System::Windows::Forms::Form 　　{ 　　public: 　　　　MyForm(void) 　　　　// 省略 　　protected: 　　　　~MyForm() 　　　　// 省略 　　　　private: System::Windows::Forms::Button^  button1; 　　　　protected: 　　　　// 省略 #pragma region Windows Form Designer generated code 　　　　void InitializeComponent(void) 　　　　{ 　　　　　　this->button1 = (gcnew System::Windows::Forms::Button()); 　　　　　　this->SuspendLayout(); 　　　　　　// 　　　　　　// button1 　　　　　　// 　　　　　　this->button1->Location = System::Drawing::Point(209, 197); 　　　　　　this->button1->Name = L"button1"; 　　　　　　this->button1->Size = System::Drawing::Size(63, 27); 　　　　　　this->button1->TabIndex = 0; 　　　　　　this->button1->Text = L"button1"; 　　　　　　this->button1->UseVisualStyleBackColor = true; 　　　　　　// 　　　　　　// MyForm 　　　　　　this->AutoScaleDimensions = System::Drawing::SizeF(6, 12); 　　　　　　this->AutoScaleMode = System::Windows::Forms::AutoScaleMode::Font; 　　　　　　this->ClientSize = System::Drawing::Size(292, 273); 　　　　　　this->Controls->Add(this->button1); 　　　　　　this->Name = L"MyForm"; 　　　　　　this->Text = L"MyForm"; 　　　　　　this->ResumeLayout(false); 　　　　} #pragma endregion 　　}; }</td></tr>
</tbody></table>
 
　なるほど、部品となるbutton1の宣言とプロパティの設定が追加されていますね。 
　そしてMyFormのプロパティ設定については、button1コントロールが無い場合とある場合で処理が違います。 
　下記に特に気になった点を個人メモしておきますが、読まなくても問題はないでしょう笑。 
<ol>
<li>componentsの初期化がされない</li>
Buttonコントロールが無い場合にはcomponentsの初期化がされていますが、Buttonがある場合にはそれがありません。 　componentsはその型からコンテナであることが分かります。コンテナとは、オブジェクトの入れ物を指します。データ構造を意識して便利に変数の入れ替えができるパワーアップ版配列というイメージだと思っています。 　ボタンがあるのにコンテナは使わないの？と思ったのですが、どうやらここに入るのはTimerコントロール等の非ビジュアルコンポーネントのようです。非ビジュアルなほうはコンテナにまとめて入れて管理するようです。今はビジュアルコンポーネントであるButtonしか定義されていないので、使う必要が無いみたいです。 　一方、ビジュアルコントロールはコンテナに入れて管理するという考え方ではないようです。 　ですので、Buttonを挿入する前gcnew System::ComponentModel::Container()は単なるおまじないで、別に無くても支障は無いのだと思います。 　※試しにTimerコントロールを追加するときっちり初期化がされているようでした。
<li>Formの設定プロパティが変更されている</li>
追加されているものは見るとなんとなく分かるのですが、this->ClientSize が気になりました。ClientSize はフォームから境界線とタイトルバーを取り除いた領域との事です（<a href="http://blog.ameba.jp/ucs/entry/srventrypreview.do#" style="color: #000066; text-decoration: none;" target="_blank" title="">MSDN － Form::ClientSize プロパティ</a>）。 Buttonの有無で初期化のパラメータが異なる理由は良く分かっていませんが、おそらくまっさらなFormでの初期化は最低限他の要素が依存しない最適（無難）なものに限定しているのだと思います。</ol>

##5. ボタンをダブルクリックした時のコードを確認する。
　上記のコードではボタンを押したときの動作を定義する場所がありませんでした。 
　動作を定義したいコントロールをフォームデザイナ上でダブルクリックするとハンドラが用意されるという噂なので、やってみました。 
<table bgcolor="#FFFCCC" border="0" cellpadding="0" style="width: 420px;"><tbody>
<tr><td>#pragma once namespace InitialForm1 { 　　// 省略 　　public ref class MyForm : public System::Windows::Forms::Form 　　{ 　　public: 　　　　MyForm(void) 　　　　// 省略 　　protected: 　　　　~MyForm() 　　　　// 省略 #pragma region Windows Form Designer generated code 　　　　void InitializeComponent(void) 　　　　{ 　　　　　　// 省略 　　　　　　// 　　　　　　button1 　　　　　　// 　　　　　　this->button1->Click += gcnew System::EventHandler(this, &MyForm::button1_Click);　　　　　　// 省略 　　　　} #pragma endregion 　　private: System::Void button1_Click(System::Object^  sender, System::EventArgs^  e) { 　　　　}; 　　}; }</td></tr>
</tbody></table>
 
最後のほうにイベントハンドラが登場しました。InitializeComponent()内でハンドラを登録しているようです。 
この中に具体的な処理を入れればよいようです。

##6. ボタンを押したときにテキストボックスの文字列が変わるサンプル。
ここまで分かればあとは好き勝手できそうです。 
こんな適当なアプリケーションを作ります。 
・ボタンが２つとテキストボックスが１つ。ボタンを押すとテキストボックス内の表示が切り替わります。 
起動時はテキストボックスに"Initial"と表示されてあります。 
<a class="detailOn" href="http://blog-imgs-86.fc2.com/m/o/r/morimoridiary254/blog_import_568b669235f06.png" id="i12972419662"><img alt="初期" src="http://blog-imgs-86.fc2.com/m/o/r/morimoridiary254/blog_import_568b669235f06.png" id="1402701276923" ratio="2.7777777777777777" style="border: none; height: 108px; width: 300px;" /></a> 
ボタン1を押すと"Button1"と表示されます。 
<a class="detailOn" href="http://blog-imgs-86.fc2.com/m/o/r/morimoridiary254/blog_import_568b6692aff87.png" id="i12972419663"><img alt="ボタン1" src="http://blog-imgs-86.fc2.com/m/o/r/morimoridiary254/blog_import_568b6692aff87.png" id="1402701064755" ratio="2.7777777777777777" style="border: none; height: 108px; width: 300px;" /></a> 
ボタン1を押すと"Button2"と表示されます。 
<a class="detailOn" href="http://blog-imgs-86.fc2.com/m/o/r/morimoridiary254/blog_import_568b669336293.png" id="i12972419661"><img alt="ボタン2" src="http://blog-imgs-86.fc2.com/m/o/r/morimoridiary254/blog_import_568b669336293.png" id="1402701064636" ratio="2.7777777777777777" style="border: none; height: 108px; width: 300px;" /></a> 
これだけです笑。以下、MyForm.h のうち、イベントハンドラのｂコードです。 
 
<table bgcolor="#FFFCCC" border="0" cellpadding="0" style="width: 420px;"><tbody>
<tr><td>#pragma once namespace InitialForm1 { 　　using namespace System; 　　using namespace System::ComponentModel; 　　using namespace System::Collections; 　　using namespace System::Windows::Forms; 　　using namespace System::Data; 　　using namespace System::Drawing; 　　/// <summary> 　　/// MyForm の概要 　　/// </summary> 　　public ref class MyForm : public System::Windows::Forms::Form 　　{ 　　public: 　　　　MyForm(void) 　　　　{ 　　　　　　InitializeComponent(); 　　　　　　// 　　　　　　//TODO: ここにコンストラクター コードを追加します 　　　　　　//　　　　} 　　protected: 　　　　/// <summary> 　　　　/// 使用中のリソースをすべてクリーンアップします。 　　　　/// </summary> 　　　　~MyForm() 　　　　{ 　　　　　　if (components) 　　　　　　{ 　　　　　　　　delete components; 　　　　　　} 　　　　} 　　private: System::Windows::Forms::Button^  button1; 　　private: System::Windows::Forms::Button^  button2; 　　private: System::Windows::Forms::TextBox^  textBox1; 　　private: System::ComponentModel::IContainer^  components; 　　protected: 　　private 　　　　/// <summary> 　　　　/// 必要なデザイナー変数です。 　　　　/// </summary> #pragma region Windows Form Designer generated code 　　　　/// <summary> 　　　　/// デザイナー サポートに必要なメソッドです。このメソッドの内容を 　　　　/// コード エディターで変更しないでください。 　　　　/// </summary>　　　　void InitializeComponent(void) 　　　　{ 　　　　　　this->button1 = (gcnew System::Windows::Forms::Button()); 　　　　　　this->button2 = (gcnew System::Windows::Forms::Button()); 　　　　　　this->textBox1 = (gcnew System::Windows::Forms::TextBox()); 　　　　　　this->SuspendLayout(); 　　　　　　// 　　　　　　// button1 　　　　　　//  　　　　　　this->button1->Location = System::Drawing::Point(203, 12); 　　　　　　this->button1->Name = L"button1"; 　　　　　　this->button1->Size = System::Drawing::Size(63, 27); 　　　　　　this->button1->TabIndex = 0; 　　　　　　this->button1->Text = L"button1"; 　　　　　　this->button1->UseVisualStyleBackColor = true; 　　　　　　this->button1->Click += gcnew System::EventHandler(this, &MyForm::button1_Click); 　　　　　　// 　　　　　　// button2 　　　　　　//  　　　　　　this->button2->Location = System::Drawing::Point(203, 47); 　　　　　　this->button2->Name = L"button2"; 　　　　　　this->button2->Size = System::Drawing::Size(62, 23); 　　　　　　this->button2->TabIndex = 1; 　　　　　　this->button2->Text = L"button2"; 　　　　　　this->button2->UseVisualStyleBackColor = true; 　　　　　　this->button2->Click += gcnew System::EventHandler(this, &MyForm::button2_Click); 　　　　　　// 　　　　　　// textBox1 　　　　　　//  　　　　　　this->textBox1->Location = System::Drawing::Point(26, 12); 　　　　　　this->textBox1->Name = L"textBox1"; 　　　　　　this->textBox1->Size = System::Drawing::Size(124, 19); 　　　　　　this->textBox1->TabIndex = 2; 　　　　　　// 　　　　　　// MyForm 　　　　　　//  　　　　　　this->AutoScaleDimensions = System::Drawing::SizeF(6, 12); 　　　　　　this->AutoScaleMode = System::Windows::Forms::AutoScaleMode::Font; 　　　　　　this->ClientSize = System::Drawing::Size(292, 81); 　　　　　　this->Controls->Add(this->textBox1); 　　　　　　this->Controls->Add(this->button2); 　　　　　　this->Controls->Add(this->button1); 　　　　　　this->Name = L"MyForm"; 　　　　　　this->Text = L"MyForm"; 　　　　　　this->Load += gcnew System::EventHandler(this, &MyForm::MyForm_Load); 　　　　　　this->ResumeLayout(false); 　　　　　　this->PerformLayout(); 　　　　} #pragma endregion 　　private: System::Void  MyForm_Load(System::Object^  sender, System::EventArgs^  e) { 　　　　　　this->textBox1->Text = "Initial"; 　　　　} 　　private: System::Void button1_Click(System::Object^  sender, System::EventArgs^  e) { 　　　　　　this->textBox1->Text = "Button1"; 　　　　} 　　private: System::Void button2_Click(System::Object^  sender, System::EventArgs^  e) { 　　　　　　this->textBox1->Text = "Button2"; 　　　　} 　　}; }</td></tr>
</tbody></table>

りさーちゃーのひよこ

2014年6月13日金曜日

C++/CLI フォームアプリとOpenGLの連携（フォーム新規作成とサンプル）

0 件のコメント:

コメントを投稿