Question

I have this XML file:

<?xml version="1.0" encoding="utf-8"?>
<Wpf>
  <wpfctrl id="NavBtnTemplate">#FFCFDEFF</wpfctrl>
</Wpf>

and i want to bind Fill property of My Rectangle to value of wpfctrl node with id=”NavBtnTemplate”. How I can achieve this? Actually I have this rectangle inside my custom UserControl’s Control Template. But hope that will not be the problem since I can bind to the properties of elements inside UserControl:
My UserControl (actually is very simple)

<UserControl.Resources>
  <ControlTemplate x:Key="WpfWebSparkNavTemplate" TargetType="{x:Type Button}">
    <Grid x:Name="controlLayout" Height="29.648" Width="84.284">
    <VisualStateManager.VisualStateGroups>
      <VisualStateGroup x:Name="CommonStates">
        <VisualState x:Name="Normal"/>
        <VisualState x:Name="MouseOver"/>
        <VisualState x:Name="Pressed"/>
        <VisualState x:Name="Disabled"/>
      </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
    <Rectangle x:Name="rectangle"***Fill="#FFCFDEFF"*** Margin="0" Height="31">           
    </Rectangle>
  <Label x:Name="buttonCaption" VerticalAlignment = "Center"
     HorizontalAlignment = "Center"
     FontWeight = "Bold" FontSize = "12" Content="{TemplateBinding Content}"/>
  </Grid>
 </ControlTemplate>
</UserControl.Resources>

I did not found Blend wizard to allow me to state such filters on XML

Please help. Thank you.

Answer 1

If I understand correctly, you want to bind the Fill Property of the Rectangle within your UserControl to a property which you set (or bind) when declaring the instance of the UserControl in XAML.

The first thing that you want to do is have a Fill Property on your user control, so create a DependencyProperty in the UserControl’s code behind:

public static readonly DependencyProperty FillProperty = 
    DependencyProperty.Register(
        "Fill", 
        typeof(Brush),
        typeof(UserControl1));

public Brush Fill
{
    get { return (Brush)GetValue(FillProperty); } 
    set { SetValue(FillProperty, value); }
} 

With this in place, you can modify the ControlTemplate so that rectangle Fill property binds to this DependencyProperty (change the WpfApplication1 namespace appropriately):

<Rectangle x:Name="rectangle" Fill="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=WpfApplication1:UserControl1}, Path=Fill}" Margin="0" Height="31"/>

Then you can use your control as follows:

<WpfApplication1:UserControl1 Grid.Row="1" Fill="Red"/>

The next thing to do is to bind the UserControl’s Fill property. You need to create a data source to your XML file, e.g.:

<Window.Resources>
    <XmlDataProvider x:Key="xmlData" Source="XMLFile1.xml"/>
</Window.Resources>

And then bind to the datasource:

    <WpfApplication1:UserControl1 Grid.Row="0">
        <WpfApplication1:UserControl1.Fill>
            <Binding Source="{StaticResource xmlData}"
                     XPath="//wpfctrl[@id='NavBtnTemplate']"/>
        </WpfApplication1:UserControl1.Fill>
    </WpfApplication1:UserControl1>