ああ前回は MainPageのDataContextにクラスのインスタンスをバインドしました。
MainPageのDataContextにバインドをすると、データソースは1つしか使用することができません。
今回は、複数のデータソースをバインドする方法について見ていきます。
まずは Visual Studioを起動して、Silverlightアプリケーションプロジェクトを作成します。
次に、MainPageを以下のようにデザインします。
上記の XAMLコード例を以下に示します。
<Grid x:Name="LayoutRoot" Background="White"> <Grid HorizontalAlignment="Left" Height="59" Margin="10,10,0,0" VerticalAlignment="Top" Width="225" Background="#FFE6F015"> <TextBlock HorizontalAlignment="Left" Margin="10,10,0,0" TextWrapping="Wrap" Text="身長" VerticalAlignment="Top"/> <TextBlock HorizontalAlignment="Left" Margin="67,10,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Text="{Binding Height}"/> <TextBlock HorizontalAlignment="Left" Margin="10,31,0,0" TextWrapping="Wrap" Text="体重" VerticalAlignment="Top"/> <TextBlock HorizontalAlignment="Left" Margin="67,31,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Text="{Binding Weight}"/> </Grid> <Grid HorizontalAlignment="Left" Height="33" Margin="10,90,0,0" VerticalAlignment="Top" Width="225" Background="#FFE6F015"> <TextBlock HorizontalAlignment="Left" Margin="10,10,0,0" TextWrapping="Wrap" Text="性別" VerticalAlignment="Top"/> <TextBlock HorizontalAlignment="Left" Margin="67,10,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Text="{Binding gender}"/> </Grid> </Grid>
今回は上記 MainPageに配置した2つのGridに DataContextを設定します。
DataContextに設定するクラス、HealthとGenderを最初に作成します。
Health.vb
Public Class Health Public Property Height As Double Public Property Weight As Double End Class
Health.cs
public class Health { public double Height { get; set; } public double Weight { get; set; } }
Gender.vb
Public Class Gender Public Property gender As String End Class
Gender.cs
public class Gender { public string gender { get; set; } }
次に、2つのGrid(gridHeath と gridGender)のDataContextを設定します。
これにより、同じMainPage内でも複数のデータソースを取り扱うことが可能となります。
MainPage.xaml.vb の例
Partial Public Class MainPage Inherits UserControl Public Sub New() InitializeComponent() Me.gridHealth.DataContext = New Health() With { .Height = 162.5, .Weight = 60.5 } Me.gridGender.DataContext = New Gender() With { .Gender = "男" } End Sub End Class
MainPage.xaml.cs の例
public partial class MainPage : UserControl { public MainPage() { InitializeComponent(); this.gridHealth.DataContext = new Health { Height = 162.5, Weight = 60.5 }; this.gridGender.DataContext = new Gender { gender = "男" }; } }
以上を入力したら、実行して確認しましょう。
2つのデータソースの値がそれぞれ表示されることが確認できます。
Please follow and like us:
コメント