C#のフォームアプリ開発を覚えた人はWPFに挑戦してみましょう。
正式名称はWindows Presentation Foundation。
WPFで調べてみると相変わらず否定的な記事が出ますね。
僕は良いと思うんですけどね。
ま、使い込んでみないとその良さはわかりません。
今回も元気よく行きましょう。
WPF入門
プロジェクトの作成方法はフォームと特にかわりません。違和感ないと思います。
問題はWPF特有の作法ですね。MVVMの流れは慣れが必要です。
ではプロジェクトの作成方法から。
プロジェクトの作成
新しいプロジェクトの作成
C# → Windowsmi → デスクトップ → WPFアプリケーション → 次へ
実はWPFアプリ(.MET Framework)というのもあります。
こっちは古いものですので、状況に応じて使い分けましょう。
適当なプロジェクト名をつけ次へ。
ターゲットフレームワークを選択し次へ
何か出来上がりました。これでOKです。
MVVM入門(WPF特有の作法)
やってはいけないこと
やってはいけないことが一つあります。
コードビハインドのコードを書くこと。
これだけは絶対死守してください。
このルールを破った時点であなたのWPFアプリはゴミになります。
コードビハインドとはこれのことです。
Window名.xaml.cs
やってはいけない理由はみんながそうしてるからです。
詳細は省きます。
真面目な解説ページがいくらでもありますが、
宗教の教えか何かと思って受け入れた方がよいでしょう。
コードビハインドに処理を書いたら信者にめちゃくちゃ怒られます。
フォルダ作成
フォルダを作成します。
Views,ViewModels,Modelsのフォルダです。
僕はCommonフォルダも用意します。
- Viewsフォルダ:Viewファイルを置きます
- ViewModelsフォルダ:ViewModelファイルを置きます
- Modelsフォルダ:Modelファイルを置きます
- Commonフォルダ:アクションやビヘイビア,共通の定義,Utilityクラスなど置きます
※MVVMの考え方についてはご自身で調べてください。
腐るほど転がってますのでここでは説明しません。
ViewModelファイルを作成します。
Viewとの関係がわかりやすい名前をつけます。
今回はMainWindowのViewModelなのでMainWindowVM。
追加。
自動で出来上がったものはそのまま使えません。
以下のコードを書き足します。
using using System.ComponentModel;
public class MainWindowVM : INotifyPropertyChanged
{
#region INotifyPropertyChanged
public event PropertyChangedEventHandler PropertyChanged;
private void NotifyPropertyChanged(String info)
{
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(info));
}
}
#endregion
}
こんな感じ。面倒くさいですね。わかります。
Blendを開く
Blendを開きます
ツリーのxamlファイル上で右クリック → Blendでデザイン
カッコいいのが立ち上がりました。
昔は有料で別のパッケージを買わないといけませんでした。
今は無料でついてくるのでお得です。
ビヘイビアパッケージのインストール
ビヘイビアを選択して、’Behaviors’Nugetパッケージのインストールを選択します。
いっぱい出てきました。
一度ビルドしておきます。
プロジェクトの変更が保存されます。
ViewModelのバインド
Windowを選択します
DataContext新規
バインドするViewModelを選択(今回はMainWindowVM)を選択
関数の呼び出し
ビヘイビアー → CallMethodAction → コントロール上(今回はボタン)にドロップ
Ctrl+S等でファイルを保存。
Visual Studioに戻ります。
Blendの変更が反映されています。
対象のViewModel(今回はMainWindowVM)に移動し、処理を追加します。
xamlに戻ってボタンを選択します。
こんな感じで書きます。
重要なのは
MethodName="ButtonClick" TargetObject="{Binding}"
<Button x:Name="button" Content="Button" HorizontalAlignment="Left" Margin="315,143,0,0" VerticalAlignment="Top">
<b:Interaction.Triggers>
<b:EventTrigger EventName="Click">
<b:CallMethodAction MethodName="ButtonClick" TargetObject="{Binding}"/>
</b:EventTrigger>
</b:Interaction.Triggers>
</Button>
実行してみます。
ボタンを押してみます。ほらできた。
変数のバインド
ViewModelにこんな感じで書きます。
string _SampleText = string.Empty;
public string SampleText
{
get
{
return _SampleText;
}
set
{
if (_SampleText == null || !_SampleText.Equals(value))
{
_SampleText = value;
NotifyPropertyChanged("SampleText");
}
}
}
TextBoxを置いておきます。
一度ビルドもしくはリビルドをしておきます。
TextBox選択 → ■ → データバインディングの作成
対象の変数を選択してOK
ボタンを押した時の処理を修正
/// <summary>
/// ボタンを押した場合の処理
/// </summary>
public void ButtonClick()
{
MessageBox.Show(this.SampleText);
}
実行(F5)してTextBoxに適当な値を入力しボタンを押すとこんな感じ。
WPFお助けツール
WPFCodeCreator
余談ですが、WPFの敷居を下げるためちょっとしたお助けツールを作成中です。
ご興味があれば使ってみてください。
とりあえず変数書く際の面倒くささは軽減できます。
https://github.com/zeikomi552/WPFCodeCreator
WPFCodeCreator画面イメージ。
WPFで作成してますし特に難しいことはしていません。
勉強がてらソースコードを見て頂くのも良いかもしれません。
まとめ
こんな感じでお作法がクソ面倒くさいです。
フォームアプリならボタンカチカチってやった瞬間出来上がるのにWPFはこの手数の多さ。
入門の敷居は高いのに、WPFの良さに気付けるまでかなりの時間を要します。
しかしできる事がフォームに比べて多く未来の自分に拡張性や可能性を残してあげられる。
しかもアンチが多くて自分の希少性が高まります。
習得価値は十分にあります。頑張ってみてください。
WPF速攻入門
おわり
コメントを残す