silverlight - 将 Silverlight UserControl 自定义属性绑定(bind)到其元素

Question

我正在尝试在 Silverlight 2.0 中制作一个简单的填字游戏。我正在开发一个 UserControl-ish 组件，它代表拼图中的一个正方形。我在将 UserControl 的属性与其元素绑定(bind)时遇到问题。我终于(有点)让它工作了(可能对某些人有帮助——我花了几个小时)，但想让它更“优雅”。

我想象它应该有一个内容隔间和一个标签(在右上角)，可以选择包含它的编号。内容控件可能是 TextBox，而标签控件可能是 TextBlock。所以我用这个基本结构创建了一个 UserControl(值在这个阶段是硬编码的):

    <UserControl x:Class="XWord.Square"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    FontSize="30" 
    Width="100" Height="100">
        <Grid x:Name="LayoutRoot" Background="White">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>

            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>

            <TextBlock x:Name="Label" Grid.Row="0" Grid.Column="1" 
                Text="7"/>
            <TextBox x:Name="Content" Grid.Row="1" Grid.Column="0"  
                Text="A"
                BorderThickness="0" />

        </Grid>
    </UserControl>

我还在 Square 类中创建了 DependencyProperties，如下所示:

     public static readonly DependencyProperty LabelTextProperty;
     public static readonly DependencyProperty ContentCharacterProperty;

     // ...(static constructor with property registration, .NET properties
     // omitted for brevity)...

现在我想弄清楚如何将 Label 和 Content 元素绑定(bind)到这两个属性。我这样做(在代码隐藏文件中):

     Label.SetBinding( TextBlock.TextProperty, new Binding { Source = this, Path = new PropertyPath( "LabelText" ), Mode = BindingMode.OneWay } );
     Content.SetBinding( TextBox.TextProperty, new Binding { Source = this, Path = new PropertyPath( "ContentCharacter" ), Mode = BindingMode.TwoWay } );

在 XAML 中这样做会更优雅。有谁知道这是怎么做到的？

Answer 1

首先，使用 {RelativeSource Self} 在 UserControl 上设置 DataContext:

<UserControl x:Class="XWord.Square"  
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"   
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"  
FontSize="30"   
Width="100" Height="100" 
DataContext="{Binding RelativeSource={RelativeSource Self}}">

现在您可以将各个元素绑定(bind)到用户控件的属性:

<TextBlock x:Name="Label" Grid.Row="0" Grid.Column="1" 
Text="{Binding LabelText}"/>  
<TextBox x:Name="Content" Grid.Row="1" Grid.Column="0" 
Text="{Binding ContentCharacter}" BorderThickness="0" />

对于 SL 2.0，您需要在 UserControl 的 Loaded 事件处理程序上设置 DataContext。

private void UserControl_Loaded( object sender, RoutedEventArgs e ) {
    LayoutRoot.DataContext = this;
}