LoginSignup
34
39

More than 5 years have passed since last update.

【WPF覚書】ViewModelとデータバインディング

Last updated at Posted at 2018-03-19

はじめに

C#、WPFの勉強をしてて覚えたことの覚え書き。
データバインディングがやりたかったけど、初めはなかなか理解できなかったので、自分なりにまとめてみる。

記載しているコードは必要な部分のみの抜粋なのであしからず。

ViewModel

xaml.csファイルのクラスがViewModelだと思ってたのだが、どうやら違うらしい。
別途ViewModelクラスを作る必要がある。

MainViewMode.cs
class MainViewModel
{
    public String BindText { get; set; } = "てきとうな初期値";
}

publicなプロパティがXAMLから参照可能なプロパティとなる。

XAMLと連携するクラス

XAMLと連携するクラスのDataContextプロパティにViewModelのインスタンスを突っ込む。

MainView.xaml.cs
public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();

        this.DataContext = new MainViewModel();
    }
}

こうすると、DataContext(ViewModel)のプロパティがXAMLから参照可能になる。

XAML

XAMLにはどこに何をバインドするか書く。
DataContextを使用すれば、ViewModelに関する記述などは不要。

MainView.xaml
<Grid>
    <Label Content="{Binding BindText}" Margin="0,0,0,0"/>
</Grid>

こう書くとMainView.DataContext.BindTextとバインドされる。

完成

出来上がったものがこちら。ビルドして実行しただけ。
image.png

MainViewModel.BindTextを動的に変更すると、それに合わせてLabelのContentプロパティにも自動的に反映される。

追記

上で書いたように、自動的に反映されるようにするにはもう少し手を加える必要があったので、別途記事を書きました。よければご参照ください。

34
39
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
34
39