より良いエンジニアを目指して

1日1つ。良くなる!上手くなる!

WPFのXAMLを指定する時には、DesignInstanceを設定する

WPFXAMLでは、ViewModelのプロパティと Viewの紐付けを行うことになります。

課題なのは、C#という静的型付け言語にも関わらず、動的な値の指定になるということです。

なぜか、ViewModelの値が反映されない!

気付いたら、Bindingしているプロパティの名前が、Nameではなく、Nemeだった!

しょうもない話ですが、あり得る話です。

振り返れば、簡単なことですが、気づくまでに30分かかって時間を無駄にしていることもあります。

そういうことをなるべく防ぐのがDesignInstance です。

XAMLに以下のようなコードを記述します。

d:DataContext="{d:DesignInstance local:Person}"

f:id:rimever:20200628072721p:plain
インテリセンスが表示された

こうしておけばミスタイプによる失敗を防ぐことができますし、効率よく実装が進めることができます。

ViewとViewModelは、ほとんど1対1です。

基本、XAMLを宣言するときは、このDesignInstanceを指定しておくべきでしょう。

と、私は思ってます。

サンプルコード

<Window x:Class="WpfApp2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp2"
        d:DataContext="{d:DesignInstance local:Person}"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="40"/>
            <RowDefinition Height="40"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="200"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <TextBlock Grid.Column="0" Grid.Row="0" Text="名前"/>
        <TextBlock Grid.Column="0" Grid.Row="1" Text="企業"/>
        <TextBox Grid.Column="1" Grid.Row="0" Text="{Binding Name}"/>
        <TextBox Grid.Column="1" Grid.Row="1" Text="{Binding CompanyName}"/>
    </Grid>
</Window>
#region

using System.Windows;

#endregion

namespace WpfApp2
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            DataContext = new Person();
        }
    }

    public class Person
    {
        public string Name { get; set; }
        public string CompanyName { get; set; }
    }
}

参考記事