CODEWITHSUNDEEP
silverlightwindows-phone-7
Viacheslav Smityukh
Viacheslav Smityukh

Reputation: 5833

How to bind a control's property to a property of the control's element?

I need a digit control to my windows phone app.

I try to create a custom control but I can't bind a property of the control to the control's element.

I had added a dependency property to the control

public static readonly DependencyProperty LineThicknessProperty =
            DependencyProperty.Register("LineThickness", typeof (double), typeof (DigitControl), new PropertyMetadata(default(double)));

[DefaultValue(10D)]
public double LineThickness
{
    get { return (double) GetValue(LineThicknessProperty); }
    set { SetValue(LineThicknessProperty, value); }
}

And have tried to bind it to the control's element

<UserControl x:Class="Library.DigitControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    d:DesignHeight="480" d:DesignWidth="480">

    <Grid x:Name="LayoutRoot">
    <Rectangle Margin="0" StrokeThickness="0" Width="{Binding LineThickness, RelativeSource={RelativeSource Self}}" Fill="#FFFF5454" RadiusX="5" RadiusY="5"/>
    </Grid>
</UserControl>

But it doesn't work. Is where a way to bind that property to the element's property?

Upvotes: 1

Views: 90

Answers (2)

Peter Hansen
Peter Hansen

Reputation: 8907

What you have done wont work because RelativeSource={RelativeSource Self} sets the source to the target object, which is the Rectangle in your case.

And since rectangle doesn't have a LineThickness property, the binding fails.

To get the right binding you can do several things.

The preferable approach would probably be to set this.DataContext = this; in your UserControl contructor, and then simply set the binding as Width="{Binding LineThickness}" in your XAML.

Or you could target the closest element of type UserControl and find the property on that one, if you don't feel like setting the Datacontext:

Width="{Binding LineThickness, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=UserControl}}"

Update
You can also simply give the UserControl a name, and reference it with the ElementName property in the binding:

<UserControl x:Name="uc1" ... </UserControl>

Width="{Binding LineThickness, ElementName=uc1}"

Upvotes: 0

weston
weston

Reputation: 54781

Do it in the code behind.

Set a name:

<Rectangle x:Name="theRect" Margin="0" StrokeThickness="0" Fill="#FFFF5454" RadiusX="5" RadiusY="5"/>

Then in code behind:

theRect.SetBinding(Rectangle.WidthProperty, new Binding("LineThickness"){Source = this});

Not at PC with Visual Studio, so applogies if it's not 100% compileable! But gives you the general idea.

Upvotes: 1

Related Questions