cの別のクラスからのwpfのテキストボックスからのデータバインディング

Question

新しいWPFでは、単純なテキストボックスバインディングを実装しようとしています。これを実行するにはいくつかの助けが必要です。

XAML

<Window x:Class="WPFModel.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:src="clr-namespace:WPFModel" 
    DataContext="{Binding RelativeSource={RelativeSource Self}}" 
    mc:Ignorable="d" 
    Title="MainWindow" Height="350" Width="525"> 

    <Window.Resources> 
     <src:Test x:Key="myDataSource" TextBoxName="Text Init" /> 
    </Window.Resources> 

<Grid> 
    <TextBox x:Name="S1" Text = "{Binding Source={StaticResource myDataSource}, Path=TextBoxName, UpdateSourceTrigger= PropertyChanged, Mode = TwoWay}" HorizontalAlignment="Left" Height="50" Margin="160,165,0,0" VerticalAlignment="Top" Width="185"/> 
</Grid> 

メインウィンドウ

namespace WPFModel 
{ 
    public partial class MainWindow : Window 
    { 
     Test tb = new Test(); 

     public MainWindow() 
     { 
      InitializeComponent(); 
      this.DataContext = this; 
      tb.Drawtext(); 
     } 
    } 
} 

コードビハインド

Answer 1

あなたが代わりにあなたがTestオブジェクトのインスタンスに設定されなければならないときには、それ自体にウィンドウのDataContextのを設定している：

this.DataContext = tb; 

その後、プロパティにテキストボックスのバインディングを設定することができます

... Text="{Binding TextBoxName, UpdateSourceTrigger= PropertyChanged, Mode = TwoWay}" ... 

Answer 2

DataContextを複数回設定しています。ウィンドウの属性のXAMLマークアップ（DataContext="{Binding RelativeSource={RelativeSource Self}}"）と、ウィンドウのコードビハインドコンストラクタ（this.DataContext = this;）に再度挿入します。どちらの場合も、DataContextをTestのインスタンスに設定していません。

Testという2つのインスタンスも作成しました。リソースとしてXAMLマークアップ（<src:Test x:Key="myDataSource" TextBoxName="Text Init" />）とコードビハインド（Test tb = new Test();）で再度マークアップします。次に、テキストボックスをリソースインスタンスTestにバインドします。コードビハインドインスタンスでDrawText()を呼び出しているため、ウィンドウ内のテキストボックスは決して更新されません。

代わりに、あなたのウィンドウのDataContextとしてTestのインスタンスが必要です。理想的には、MVVMのコードビハインドファイル（メインウィンドウと呼んでいた）のコード量を最小限に抑えたいので、これを実行する最善の方法は以下の例のようになります。また、OnClickハンドラの代わりにコマンドを使用して、View Modelでアクションを呼び出すこともできます。あなたはRelayCommandに精通していない場合、それの簡単な実装here

XAMLをチェックアウト

<Window x:Class="WPFModel.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:src="clr-namespace:WPFModel" 
    mc:Ignorable="d" 
    Title="MainWindow" Height="350" Width="525"> 
    <Window.DataContext> 
     <src:Test /> 
    </Window.DataContext> 
    <StackPanel> 
     <TextBox x:Name="S1" Text = "{Binding TextBoxName}" HorizontalAlignment="Left" Height="50" Margin="160,165,0,0" VerticalAlignment="Top" Width="185"/> 
     <Button Content="Click Me!" Command={Binding DrawTextCommand} /> 
    </StackPanel> 
</Window> 

ビューモデル

namespace WPFModel 
{ 
    public class Test : INotifyPropertyChanged 
    { 
     public ICommand DrawTextCommand { get; private set; } 

     public event PropertyChangedEventHandler PropertyChanged; 

     private string value1; 
     public string TextBoxName 
     { 
      get { return value1; } 
      set 
      { 
       value1 = value; 
       RaisePropertyChanged("TextBoxName"); 
      } 
     } 

     public Test() 
     { 
      this.DrawTextCommand = new RelayCommand(DrawText); 
     } 

     protected void RaisePropertyChanged(string propertyName) 
     { 
      var handler = PropertyChanged; 
      if (handler != null) 
      { 
       handler(this, new PropertyChangedEventArgs(propertyName)); 
      } 
     } 

     public void Drawtext() 
     { 
      TextBoxName = "Textbox text"; 
     } 
    } 
} 

メインウィンドウのコードビハインド

namespace WPFModel 
{ 
    public partial class MainWindow : Window 
    { 
     public MainWindow() 
     { 
      InitializeComponent(); 
     } 
    } 
}