WPF 超入門 〜番外編「エッセンシャル WPF その壱 」
お待たせしました。チョー久々の WPF ネタです。
先日やっと「エッセンシャル WPF」を入手でき、いま読み進めている最中ですが、WPF の開発スタッフが、WPF の概要につきかなり突っ込んで解説してるなかなか面白い本です。
エッセンシャルWPF:Windows Presentation Foundation (Programmer's SELECTION)
- 作者: Chris Anderson,星睦
- 出版社/メーカー: 翔泳社
- 発売日: 2007/10/31
- メディア: 大型本
- 購入: 6人 クリック: 128回
- この商品を含むブログ (32件) を見る
本書はチュートリアルでなく、WPF の概念や構造・設計思想を公開してるので、.NET に関してある程度理解があり WPF も齧ったことある人なら読むのにさほど苦労しないでしょうが、初心者がいきなり読むにはかなりきついのも事実です。ましてサンプルコードが挙げられていても、初心者では試しづらいコードが沢山あります。
そこで今回は、初めて WPF に触れる人が「エッセンシャル WPF」を理解できるよう、サンプルコードを実行するためのポイントを簡単に纏めてみました。最初は第一章「はじめに」から「新しい GUI としての WPF」のサンプルの実行の仕方。続いて「WPF ツアー」をハンズオンで実行出来るよう、二回に分けて記事を書きたいと思います。
User32 を使った画面の表示方法
一番最初は 「User32 を利用する場合の Hello World プログラム」 です。C のプログラムですが、たまにはネイティブもいいものです。これを動かせたら面白いと思いませんか? VB ユーザーや C# エンジニアの中には、このコードが何か判らない、もしくはどうやって実行するか判らないという人もいそうです。そこで後学のために、画像を交えながら紹介したいと思います。
以下、まず エッセンシャル WPF 2頁 のコードを実行したところです。
標準的な Window です。まず WPF と従来の User32 を使った画面の違いを説明する前に、User32(Win32API)を使った画面の表示方法、次に .NET による Form の表示、最後は WPF の画面表示と順を追って過去の歴史をおさらいしているワケです。ではまず「User32 を使った画面の表示方法」です。
まず Visual Studio を起動し、「スタートページ」の「新しいプロジェクト」をクリックします。
左側テンプレートから(普段 VC++ を使ってなければ「他の言語」→)「Visual C++」→「空のプロジェクト」を選択し、プロジェクト名を「sample01」として、OKボタンをクリックしてください。なおテンプレートを選択する際、「空の CLR プロジェクト」 を誤って選択しないよう注意してください。
プロジェクトが生成されたら、ソースファイルを追加します。「ソリューションエクスプローラー」でプロジェクトを選択、右クリックでショートカットを出し、「追加」→「新しい項目」をクリックします。
「C++ ファイル」を選択します。名前は「sample01.cpp」として下さい。最後に「追加」をクリックします。
エッセンシャル WPF 2頁から始まる C のコードを、先程追加したソースファイルに記述します。これはコピペするより、極力自分で書くことをお勧めします。
#include <Windows.h> LRESULT CALLBACK WndProc(HWND hwnd, UINT msg, WPARAM wparam, LPARAM lparam); INT WINAPI WinMain (HINSTANCE hInstance, HINSTANCE hPrevInstance, LPSTR cmdLine, int cmdshow) { MSG msg; HWND hwnd; WNDCLASSEX wndclass = { 0 }; wndclass.cbSize = sizeof(WNDCLASSEX); wndclass.style = CS_HREDRAW | CS_VREDRAW; wndclass.lpfnWndProc = WndProc; wndclass.hIcon = LoadIcon(NULL, IDI_APPLICATION); wndclass.hCursor = LoadCursor(NULL, IDC_ARROW); wndclass.hbrBackground = (HBRUSH)GetStockObject(WHITE_BRUSH); wndclass.lpszClassName = TEXT("Window1"); wndclass.hInstance = hInstance; wndclass.hIconSm = LoadIcon(NULL, IDI_APPLICATION); RegisterClassEx(&wndclass); hwnd = CreateWindow( TEXT("Window1"), TEXT("Hello World"), WS_OVERLAPPEDWINDOW, CW_USEDEFAULT, 0, CW_USEDEFAULT, 0, NULL, NULL, hInstance, NULL); if (!hwnd) return 0; ShowWindow(hwnd, SW_SHOWNORMAL); UpdateWindow(hwnd); while( GetMessage(&msg, NULL, 0, 0 ) ){ TranslateMessage(&msg); DispatchMessage(&msg); } } LRESULT CALLBACK WndProc (HWND hwnd, UINT msg, WPARAM wparam, LPARAM lparam) { switch(msg) { case WM_DESTROY: PostQuitMessage(WM_QUIT); break; default: return DefWindowProc(hwnd, msg, wparam, lparam); } return 0; }
コードを書き終えたら、F5キーを押して実行します。以下、実行画面です。
System.Windows.Forms.Form による画面の表示方法
お次は System.Windows.Forms.Form による画面表示です。まず C# の空のプロジェクトを用意しましょう。「Visual C#」→「Windows」と展開すると「空のプロジェクト」があるので選択します。プロジェクトは sample02 といたします。
お次は参照の追加です。「ソリューションエクスプローラ」で「参照設定」を選択し右クリックでショートカットを展開、「参照の追加」をクリックします。
「参照の追加」ダイアログが表示したら、「.NET」タブで「System.Windows.Forms」を選択し「OK」ボタンをクリックします。
次はクラスの追加です。「ソリューションエクスプローラ」で「プロジェクト」を選択、右クリックでショートカットを展開し、「追加」→「クラス」をクリックしてください。
「名前」を sample02.cs にして「追加」ボタンをクリックします。
以下「ソリューションエクスプローラ」ですが、参照設定に System.Windows.Forms が追加され、プロジェクトに sample02.cs が追加されたのが判ると思います。
コードを「エッセンシャル WPF 3頁」のサンプルコードで書き直します。
using System; using System.Windows.Forms; class Program { [STAThread] static void Main() { Form f = new Form(); f.Text = "Hello World"; Application.Run(f); } }
次に「プロジェクト」の「プロパティ」を表示します。「アプリケーション」タブを選択し、以下の図のように「出力の種類」と「スタートアッププロジェクト」を変更してください。
コードを書き終えたら、F5キーを押して実行します。以下、実行画面です。
WPF による画面表示
さて最後が WPF です。先程の sample02 プロジェクトをそのまま応用しましょう。まずプロジェクトの参照設定を変更します。System.Windows.Forms を削除し、新たに PresentationCore・PresentationFramework・System.Xaml・WindowsBase の 4つの参照を設定します。
コードを「エッセンシャル WPF 4頁」のサンプルコードで書き直します。
using System; using System.Windows; class Program { [STAThread] static void Main() { Window f = new Window(); f.Title = "Hello World"; new Application().Run(f); } }
コードを書き終えたら、F5キーを押して実行します。以下、実行画面です。
お次は「WPF ツアー」です。