开发者

WPF User Control: Binding to a property of a property

I'm trying to create a WPF user control, basically a text block with little circles at each side to display short numeric values. I created a class (LabelProperties) that encapsulates the settings (text, foreground brush, background brush, visibility) for each circle, then added a property to the user control for the left and right side circles. The control generally works as I'd like, but data binding does not work for the circle text.

I'm new to WPF and I am guessing I'm trying to accomplish this in a way that is not supported by the binding model. I'd greatly appreciate any help.

LabelProperties class

public class LabelProperties : DependencyObject
{
    public static readonly DependencyProperty TextProperty = 
        DependencyProperty.Register("Text", typeof(string), typeof(LabelProperties));
    public string Text
    {
        get { return (string)GetValue(TextProperty); }
        set { SetValue(TextProperty, value); }
    }

    public static readonly DependencyProperty VisibilityProperty = 
        DependencyProperty.Register("Visibility", typeof(Visibility), typeof(LabelProperties));
    public Visibility Visibility
    {
        get { return (Visibility)GetValue(VisibilityProperty); }
        set { SetValue(VisibilityProperty, value); }
    }

    public static readonly DependencyProperty ForegroundProperty = 
        DependencyProperty.Register("Foreground", typeof(Brush), typeof(LabelProperties));
    public Brush Foreground
    {
        get { return (Brush)GetValue(ForegroundProperty); }
        set { SetValue(ForegroundProperty, value); }
    }

    public static readonly DependencyProperty BackgroundProperty = 
        DependencyProperty.Register("Background", typeof(Brush), typeof(LabelProperties));
    public Brush Background
    {
        get { return (Brush)GetValue(BackgroundProperty); }
        set { SetValue(BackgroundProperty, value); }
    }

User control markup

<UserControl x:Class="ControlTest.DisplayBlock"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-c开发者_运维知识库ompatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="106" d:DesignWidth="251"
             x:Name="_userControl">
    <Grid x:Name="_grid" Height="40" >
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="30" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="30" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="26" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <Border Background="{Binding BlockBackground, ElementName=_userControl, Mode=TwoWay}" 
                Grid.ColumnSpan="3" Grid.RowSpan="2" CornerRadius="10" BorderThickness="1" BorderBrush="Black"  Margin="12,0">
        </Border>
        <Ellipse Fill="{Binding Path=LeftCircle.Background, ElementName=_userControl, Mode=TwoWay}" 
                 Visibility="{Binding Path=LeftCircle.Visibility, ElementName=_userControl, Mode=TwoWay}"
                 Stroke="Black" Grid.Column="0" StrokeThickness="2" Margin="2" />
        <TextBlock Foreground="{Binding Path=LeftCircle.Foreground, ElementName=_userControl, Mode=TwoWay}" 
                   Text="{Binding Path=LeftCircle.Text, ElementName=_userControl, Mode=TwoWay}"
                   HorizontalAlignment="Center" VerticalAlignment="Center" FontWeight="Bold" Grid.Column="0" />
        <Ellipse Fill="{Binding Path=RightCircle.Background, ElementName=_userControl, Mode=TwoWay}" 
                 Visibility="{Binding Path=RightCircle.Visibility, ElementName=_userControl, Mode=TwoWay}"
                 Stroke="Black" Grid.Column="2" StrokeThickness="2" Margin="2" />
        <TextBlock Foreground="{Binding Path=RightCircle.Foreground, ElementName=_userControl, Mode=TwoWay}" 
                   Text="{Binding Path=RightCircle.Text, ElementName=_userControl, Mode=TwoWay}"
                   HorizontalAlignment="Center" VerticalAlignment="Center" FontWeight="Bold" Grid.Column="2" />
        <TextBlock Text="{Binding Path=Text, ElementName=_userControl, Mode=TwoWay}" 
                   Grid.Column="1" Grid.Row="0" HorizontalAlignment="Center" VerticalAlignment="Center" Grid.RowSpan="2" FontSize="16" Margin="4" />
    </Grid>
</UserControl>

User control code-behind

public partial class DisplayBlock : UserControl
{
    public DisplayBlock()
    {
        InitializeComponent();
    }

    public static readonly DependencyProperty TextProperty = 
        DependencyProperty.Register("Text", typeof(string), typeof(DisplayBlock));
    public string Text
    {
        get { return (string)GetValue(TextProperty); }
        set { SetValue(TextProperty, value); }
    }

    public static readonly DependencyProperty BlockBackgroundProperty =
        DependencyProperty.Register("BlockBackground", typeof(Brush), typeof(DisplayBlock));
    public Brush BlockBackground
    {
        get { return (Brush)GetValue(BlockBackgroundProperty); }
        set { SetValue(BlockBackgroundProperty, value); }
    }

    public static readonly DependencyProperty LeftCircleProperty =
        DependencyProperty.Register("LeftCircle", typeof(LabelProperties), typeof(DisplayBlock));
    public LabelProperties LeftCircle
    {
        get { return (LabelProperties)GetValue(LeftCircleProperty); }
        set { SetValue(LeftCircleProperty, value); }
    }

    public static readonly DependencyProperty RightCircleProperty =
        DependencyProperty.Register("RightCircle", typeof(LabelProperties), typeof(DisplayBlock));
    public LabelProperties RightCircle
    {
        get { return (LabelProperties)GetValue(RightCircleProperty); }
        set { SetValue(RightCircleProperty, value); }
    }
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜