WPFでは、データバインディングを用いることでxamlだけで図形のプロパティを変えたりすることが出来る。以下は、データバインディングの例である。
MainWindow.xaml
<Window x:Class="WpfBindingLesson.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="240" Width="240">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="24" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="60" />
</Grid.ColumnDefinitions>
<Canvas
Grid.Row="0"
Grid.ColumnSpan="2">
<!-- 図形 -->
<Polygon
Points="60,0 120,120 0,120">
<Polygon.Fill>
<SolidColorBrush Color="Red" />
</Polygon.Fill>
<Polygon.RenderTransform>
<RotateTransform
CenterX="60"
CenterY="90"
Angle="{Binding ElementName=slider1, Path=Value}" />
</Polygon.RenderTransform>
</Polygon>
</Canvas>
<Slider
Grid.Row="1"
Name="slider1"
HorizontalAlignment="Stretch"
VerticalAlignment="Top" Maximum="359" />
<Label
Grid.Row="1"
Grid.Column="1"
Content="{Binding ElementName=slider1, Path=Value}"
Name="label1"
HorizontalAlignment="Left"
VerticalAlignment="Stretch" />
</Grid>
</Window>
このxamlを実行すると以下のように表示される。
 |
 |
スライダーを動かすと、図形が回転すると同時に右にスライダーの値が表示される。
ここまでで、xaml以外のコードは一切書いていないのだが、バインディングを使うことで、ある値の発生源からの変化を直接別のプロパティに反映させることが出来る。
それをしているのが28行目と40行目にある
{Binding ElementName=slider1, Path=Value}
という記述である。
28行目では、図形の回転角度のデータ元をスライダーの値に設定している。
また40行目では、ラベルのテキストのデータ元をスライダーの値に設定している。
バインディングの様子を図示すると以下のようになる。
WPFのプログラミングは、コントロールの～Changedイベントハンドラを実装する、というやり方ではなく、可能な限りデータバインディングを使っていくことになるだろう。
ピンバック: 【WPF】データバインディングの基本 その(2) – ザワプロ！