回答編集履歴

一部補足。（WinFormsのノリで～のところ）

2016/08/25 16:11

投稿

flied_onion

スコア2604

test CHANGED Viewed

@@ -500,7 +500,7 @@
-簡単な例では、MainWindow.xamlにもうひとつボタンを配置して、クリックイベントを作ります（ここではWinFormsのノリで作っていいです。配置してダブルクリックするとか、イベントプロパティから作るとか）
+簡単な例では、MainWindow.xamlにもうひとつボタンを配置して、クリックイベントを作ります（ここでは動きを知りたいだけなのでWinFormsのノリで作っていいです。配置してダブルクリックするとか、イベントプロパティから作るとか）
 で、以下の様なコードを書いてみます。

「MyButtonにMyButtonをBindingして…の謎」以降

2016/08/25 16:11

投稿

flied_onion

スコア2604

test CHANGED Viewed

@@ -202,6 +202,336 @@
 名前は`OrigButton`とします。
+Buttonと名付けたものの、デフォルトではUserControlを継承してますのでButtonになってません。
-…ちょっとここまでで投稿します。またあとで続き書きます。
+まずはButtonを継承してButtonにしてあげましょう。
+Xamlとコードビハインド両方の修正が必要です。
+OrigButton.xaml
+```xaml
+<Button x:Class="tt45592.OrigButton"
+```
+（タグをUserControlからButtonに。タグを閉じる方は自動的にかわっている(`</Button>`になってる)はずなので割愛）
+OrigButton.xaml.cs
+```c#
+public partial class OrigButton : Button {
+```
+同様にUserControlからButtonに。
+（こっちは継承情報消してもXamlにあれば良かったと思うけど、一応書き換える方向で）
+テキストブロックを置くためにXamlを編集します。今回はGridのまま。
+OrigButton.xaml
+```xaml
+<Grid>
+    <TextBlock Text="{Binding SourceText}"></TextBlock>
+</Grid>
+```
+Bindingが現れました。じゃぁC#側でDataContextを追加...**しません**。
+そのままMainWindow.xamlにこのコントロールを追加してあげます。
+```xaml
+<StackPanel>
+    <TextBox Text="{Binding SourceText, Mode=TwoWay}"></TextBox>
+    <TextBox Text="{Binding SourceText, Mode=OneWay}"></TextBox>
+    <TextBox Text="{Binding SourceText, Mode=TwoWay}"></TextBox>
+    <local:OrigButton></local:OrigButton>
+</StackPanel>
+```
+質問にあった `DataContext=`もありません。
+やたら細いボタンが追加されたら、実行します。
+※ 突然 `local:`というのが出てきました。これはMainWindowのxamlの方で、`xmlns:local="clr-namespace:tt45592"`と定義されているものです。このプロジェクトの名前空間の別名と思っておいてください。
+※ 無理やりC#風に書くなら `using local = tt45592`(名前空間の別名)からの、`local.OrigButton`といった感じです。
+実行してみると、OrigButtonのDataContextに対して何もしていないのに`Hello, Binding`と表示されました。
+![Hello, Binding on the OrigButton](cb61ab730f92166f00cea3c77fac4892.png)
+自分のDataContextになくとも、親のコンテナのDataContextにあるのでそれが利用されています。
+※ ここから少し駆け足気味になります。
+ところで、現実問題、どれもこれも同じプロパティをバインドすることは、まぁありませんね。
+ボタンにはボタンのためのプロパティが欲しくなりました。
+MyClassに新しいプロパティを追加してあげましょう。
+MyClass.cs
+```c#
+public class MyClass {
+    public string SourceText { get; set; }
+    public string ButtonText { get; set; }
+```
+このままじゃButtonTextは空なので、MainWindowのmyClassを作っているところでこれの値もセットします。
+MainWindow.xaml.cs
+```c#
+// MainWindowコンストラクタの中
+    var myClass = new MyClass();
+    myClass.SourceText = "Hello, Binding";
+    myClass.ButtonText = "OrigButton!";    // ここ
+    DataContext = myClass;
+```
+バインド対象も変えないといけませんね
+OrigButton.xaml
+```xaml
+<Grid>
+    <TextBlock Text="{Binding ButtonText}"></TextBlock>
+</Grid>
+```
+実行して変わったのが確認できたと思います。
+MyClassのプロパティ、このまま増えるとどれがボタン用でどれが他の用途かわかりませんね。
+OrigButton用にクラスを作ってあげて、それ（のインスタンス）をMyClassに持たせてあげましょう。
+MyClass.cs
+```c#
+public class MyClass {
+    public string SourceText { get; set; }
+    public MyClass() {
+        MyButton = new MyButton();
+    }
+    public MyButton MyButton { get; } // あえてですがこの名前かぶりに注意。あとgetterのみ。
+}
+public class MyButton {
+    public string ButtonText { get; set; }
+}
+```
+MainWindow.xaml.csのコンストラクタも修正しないといけません。
+```c#
+// MainWindowコンストラクタの中
+    myClass.SourceText = "Hello, Binding";
+    myClass.MyButton.ButtonText = "OrigButton!";  // これ
+    DataContext = myClass;
+```
+Bindingはどうなるでしょうか。
+このように指定します。上のコンストラクタでも同じようにアクセスしてますよね。
+OrigButton.xaml
+```xaml
+<Grid>
+    <TextBlock Text="{Binding MyButton.ButtonText}"></TextBlock>
+</Grid>
+```
+実行して、変化がない（しかし構成を変えることができた）ことを確認します。
+ところで、OrigButtonにしてみれば、「MyButton.ButtonText」よりも「ButtonText」の方が良かったりします。
+なぜなら、DataContextの構成が MyButtonプロパティ(クラスじゃないんです）を持っていることまで知らないといけないためです。
+欲しいのはButtonTextを持っているなにかだけが使える方がシンプルなわけで、MyButtonというのを間に挟んでいるのは（DataContextに指定した）クラスの都合に過ぎず、OrigButtonは知らなくても良いわけです。
+（知ってなきゃいけない実装にしたいときはそうすればいいですが、今回は欲しいのはButtonTextだけです）
+で、それに対する対策の一つとして、MainWindowの方で、OrigButtonのDataContextを設定してあげるという手があります。
+それがこれです。
+MainWindow.xaml
+```xaml
+<!-- 省略 -->
+    <local:OrigButton DataContext="{Binding MyButton}"></local:OrigButton>
+</StackPanel>
+```
+これで、OrigButtonのDataContextには（MainWindowのDataContextのおさがりではなく）ここで指定したMyButton（MainWindowのDataContextのMyButtonプロパティ）がバインドされます。OrigButtonも併せて修正してみましょう。
+OrigButton.xaml
+```xaml
+<Grid>
+    <TextBlock Text="{Binding ButtonText}"></TextBlock>
+</Grid>
+```
+そして、質問のxamlの様になりました。
+後半大分駆け足ですが、これが基本です。
+なお、これだけだと、ただのクラスをBindしているにすぎません（ViewModelと呼ぶには役割がはっきりしていない）。Modelの役割、ViewModelの役割を他資料で参照してみてください。
+---
+最後にINotifyPropertyChangedについて簡単に。
+TwoWayバインディングしたTextBoxはテキストを書き換えたら、プロパティも書き換わるし、それを参照している他のTextBoxも書き換わりました。では変更の通知がなぜ必要なのかという疑問がでるかもしれません。
+簡単な例では、MainWindow.xamlにもうひとつボタンを配置して、クリックイベントを作ります（ここではWinFormsのノリで作っていいです。配置してダブルクリックするとか、イベントプロパティから作るとか）
+で、以下の様なコードを書いてみます。
+```c#
+private void Button_Click(object sender, RoutedEventArgs e) {
+    MessageBox.Show(((MyClass)DataContext).SourceText);
+    ((MyClass)DataContext).MyButton.ButtonText = "Greeting!!";
+}
+```
+1行目はSourceTextも変わったことを確認できるようにしているだけです。
+2行目で、ButtonTextを書き換えています。しかし、OrigButtonのテキストは変わりません。
+こういう場合もあります。そしてこのような場合、OrigButtonのBindingの方で、「何がおきたら元ネタ（Source）が変わったとするか」設定してあげます。そこで「プロパティが変わったと報告が来たらSourceは更新されたトリガとする」という設定をしておいてあげて、
+DataContext（この場合は、ButtonTextを持つMyButtonクラス）には、INotifiProertyChangedの実装を通じて、「(MyButton) ＜ｘｘプロパティ変わったよ！」と通知する機能を追加してあげます。
+これが組み合わさって、OrigButtonはプロパティが変わったときSourceの更新を行う事ができるようになります。
+以上。長くなりましたが、他の資料を読む上での助けになれば。幸いです。
+わかりにくかったらごめんなさい。

記述ちょっと修正

2016/08/25 16:02

投稿

flied_onion

スコア2604

test CHANGED Viewed

@@ -40,9 +40,9 @@
 です。
-バインディングはデータソース(DataContext)であるクラスの情報をコントロール（とは限らないが）に提供する事です。
+バインディングはデータソース(DataContext)であるクラス(インスタンス)の情報をコントロール等に提供する事です。
-DataGridViewのDataSourceにDataTableをセットすると、DataGridViewにその表が表示されます。
+WinFormsでたとえるなら、DataGridViewのDataSourceにDataTableをセットすると、DataGridViewにその表が表示されます。
 OneWayとTwoWayは、この例では DataTableを変更するとDataGridViewのセル表示も変わるが、セルをいじってもDataTableの内容が変わらないような状態がOneWay。どっちをいじっても双方とも変わるのがTwoWayです。