SoManyGoblins
SoManyGoblins

Reputation: 5927

Binding AttachedProperty to object's property

I'm trying to bind the Canvas.Left and Canvas.Top attached properties to my custom X and Y properties, with no success, I'm using the following XAML.

<Style TargetType="{x:Type layout:BankBaseControl}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type layout:BankBaseControl}">
                <ContentPresenter Content="{TemplateBinding Marker}" >
                    <ContentPresenter.ContentTemplate>
                        <DataTemplate>
                            <Ellipse Fill="Red" Width="{Binding Width}"
                                     Height="{Binding Height}"
                                     Canvas.Left="{Binding X, Mode=TwoWay}"
                                     Canvas.Top="{Binding Y, Mode=TwoWay}"/>
                        </DataTemplate>
                    </ContentPresenter.ContentTemplate>
                </ContentPresenter>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

The style is applied correctly (Width and Height binding works properly), but the attached properties don't seem to be looking at the X and Y values. I tried doing this binding from code with:

SetBinding(Canvas.LeftProperty, new Binding("X")
    { Source = Marker,  Mode = BindingMode.TwoWay });

And it worked, but I'd much like to do it from XAML.

EDIT: I also tried changing the bindings in XAML to Canvas.Left="100" Canvas.Top="100", but no luck, the ellipse would still show on coords 0,0.

Upvotes: 2

Views: 129

Answers (1)

CodeNaked
CodeNaked

Reputation: 41403

What you have isn't valid. Your Ellipse is not a child of a Canvas, so the Canvas attached properties are not going to be used. Your Ellipse is a child of the ContentPresenter, which is a child of your BankBaseControl.

You would need to set the attached properties on BankBaseControl, assuming it's hosted in a Canvas panel like so:

<Style TargetType="{x:Type layout:BankBaseControl}">
    <Setter Property="Canvas.Left" Value="{Binding RelativeSource="{RelativeSource Self}, Path=Marker.X, Mode=TwoWay}" />
    <Setter Property="Canvas.Top" Value="{Binding RelativeSource="{RelativeSource Self}, Path=Marker.Y, Mode=TwoWay}" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type layout:BankBaseControl}">
                <ContentPresenter Content="{TemplateBinding Marker}" >
                    <ContentPresenter.ContentTemplate>
                        <DataTemplate>
                            <Ellipse Fill="Red" Width="{Binding Width}" Height="{Binding Height}" />
                        </DataTemplate>
                    </ContentPresenter.ContentTemplate>
                </ContentPresenter>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Upvotes: 1

Related Questions