2013年01月18日

[C# WPF]Bindingソースの更新を表示に反映する -NotifyPropertyChanged-

前回までは画面で編集したデータがBindingソースに設定される事を確認しました。
今回はBindingソースが更新されたら表示も更新されるようにします。

この為にINotifyPropertyChangedインターフェースを使用します。

サンプルを見ていきます。

xamlコードです。



<Grid>
<Label Height="23" Width="70" Margin="5"
HorizontalAlignment="Left" VerticalAlignment="Top"
Content="{Binding Data.Message}" />
<TextBox Height="23" Width="70" Margin="5,35,0,0"
HorizontalAlignment="Left" VerticalAlignment="Top"
Text="{Binding Data.Message}" />
<Button Height="23" Width="70" Margin="5,70,0,0"
HorizontalAlignment="Left" VerticalAlignment="Top"
Content="Button"/>
</Grid>




LabelとTextBoxとButtonを配置しています。
LabelのContentとTextBoxのTextにMessageプロパティをBindしています。
ButtonはTextBox以外のコントロールにフォーカスを移動する為だけに配置しています。

次にcsコードです。



public partial class MainWindow : Window, INotifyPropertyChanged
{
private string message;
public string Message
{
get { return message; }
set
{
message = value;
OnPropertyChanged("Message");
}
}

public MainWindow()
{
InitializeComponent();

this.DataContext = this;
}

public event PropertyChangedEventHandler PropertyChanged;

private void OnPropertyChanged(string name)
{
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(name));
}
}

}




赤字の部分を見てください。
更新を表示に反映させたいBindingソースを持つクラスに
INotifyPropertyChangedインターフェースを実装します。
INotifyPropertyChangedはSystem.ComponentModel名前空間に属しているので
usingの指定もしてください。
INotifyPropertyChnagedインターフェースは
PropertyChangedEventHandlerイベントオブジェクトを持ちます。
表示に更新を反映したいプロパティの更新のタイミングで
PropertyChangedイベントを発行します。
イベント引数には変更されたプロパティ名を指定します。

では実行してみましょう。
1.jpg

TextBoxを編集してフォーカスをボタンに移動すると
LabelにTextBoxに入力した値が設定されます。

TextBoxを編集して値がBindingソースであるMessageプロパティに設定されると
PropertyChangedイベントを発行します。
このイベントが発行されるとMessageプロパティを
Bindingしているすべてのコントロールが更新されます。

TextBoxの編集した値がBindingソースに設定されるタイミングは
デフォルトではフォーカスが移動したタイミングです。
TextBoxからフォーカスを移動するためにButtonを配置しています。


posted by cw at 15:00| Comment(2) | Binding | このブログの読者になる | 更新情報をチェックする

[C# WPF]Bindingソースの更新タイミングを変える -UpdateSourceTrigger-

前回のサンプルでBindingソースの更新を 表示に反映するサンプルを見ました。
その際、Bindingソースが更新されるタイミングは
TextBoxからフォーカスが外れたタイミングでした。
Bindingソースを更新するタイミングを変えたい場面もあると思います。

Bindingソースの更新タイミングはBindingプロパティの
UpdateSourceTriggerで指定します。

サンプルを見てみましょう。
前回のサンプルのxamlを以下のように変更してください。

<Grid>
    <Label Height="23" Width="70" Margin="5"
           HorizontalAlignment="Left" VerticalAlignment="Top"
           Content="{Binding Message}" />
    <TextBox Height="23" Width="70" Margin="5,35,0,0"
             HorizontalAlignment="Left" VerticalAlignment="Top"
             Text="{Binding Message, UpdateSourceTrigger=PropertyChanged}" />
</Grid>

前回TextBoxからフォーカスを外す為にButtonを配置していましたが
今回は削除してLabelとTextBoxだけ配置しています。
そしてTextBoxのTextプロパティのBindingプロパティUpdateSourceTriggerに
PropertyChangedを指定しています。
これはプロパティ(TextBoxのText)値が更新されたらすぐに
Bindingソースに反映するという指定です。

では実行してみましょう。
1.jpg
TextBoxで文字列を編集すると即座にLabelの内容も更新されます。
TextBoxのTextプロパティが更新される度にBindingソースが更新されているという事です。

このBiningのUpdateSourceTriggerプロパティの
デフォルト値はコントロールによって違います。

UpdateSourceTriggerには以下のような設定があります。
Default 対象のコントロールのデフォルトの値です
Explicit ソースコード上からUpdateSourceメソッドを 呼び出したタイミングでBindingソースを更新します
LostFocus コントロールからフォーカスが離れたタイミングで Bindingソースを更新します
PropertyChanged Bindしたコントロールのプロパティ値が 更新されたタイミングでBindingソースも更新します
posted by cw at 14:30| Comment(0) | Binding | このブログの読者になる | 更新情報をチェックする

[C# WPF]他のコントロールのプロパティをBindする

今回は他のコントロールのプロパティをBindする方法を見ていきます。

サンプルを見てみましょう



<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Slider x:Name="slider" Width="300" Height="23" Margin="5"
HorizontalAlignment="Left" VerticalAlignment="Top"/>
<TextBlock Grid.Column="1" Width="70" Height="23" Margin="5"
HorizontalAlignment="Left" VerticalAlignment="Top"
Text="{Binding Value, ElementName=slider}"/>
</Grid>



今回はxamlの記述のみです。
SliderとTextBlockを配置しています。

赤字部分を見てください。
Sliderの位置の値をTextBlockのTextプロパティにBindしています。
他のコントロールのプロパティをBindする場合は
Binding ElementNameに対象のコントロールの名前を設定します。

では実行して動作を確認してみましょう。
1.jpg

Sliderのバーを動かすとTextBlockに現在位置の値が表示されます。
posted by cw at 14:00| Comment(1) | Binding | このブログの読者になる | 更新情報をチェックする

広告


この広告は60日以上更新がないブログに表示がされております。

以下のいずれかの方法で非表示にすることが可能です。

・記事の投稿、編集をおこなう
・マイブログの【設定】 > 【広告設定】 より、「60日間更新が無い場合」 の 「広告を表示しない」にチェックを入れて保存する。


×

この広告は180日以上新しい記事の投稿がないブログに表示されております。