Binding Image Source with Templatebinding in XAML.

Question

Dear All,

I am creating a Template for a button.
in that i am putting which i want to be bound with Tag property of the Button.

For that, i am writing Image path in Tag property of Button. and binding Image source with TemplateBinding as follows.

Resource :
<ControlTemplate x:Key="btnImageTemplate" TargetType="Button"/>
<Grid>
<Image Source="{TemplateBinding Tag}"/>
</Grid>
</ControlTemplate>

<Button Template="{StaticResource btnImageTemplate}" Tag="Images/star.png"/>


But this is not giving any result.
Please, tell me how can i achive the same.?

Thnaks !!

Answer 1

the binding should look like this

<Image Source="{Binding Tag, RelativeSource={RelativeSource FindAncestor,AncestorType={x:Type Button}}}"/>

 

Answer 2

But is there any difference?

 

If it works, why the TemplateBinding doesn't work?

 

Answer 3

TemplateBinding is a lightweight "binding", it doesn't support some features of traditional Binding, such as automatically type conversion using the known type converters associated with the target property (such as converting the string URI into a BitmapSource instance).

The following code can work properly:

Code Snippet

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Control Tag="C:\Documents and Settings\All Users\Documents\My Pictures\Sample Pictures\Sunset.jpg">
        <Control.Template>
            <ControlTemplate>
                <StackPanel>
                    <Image Source="{Binding Path=Tag, RelativeSource={RelativeSource TemplatedParent}}"/>
                </StackPanel>
            </ControlTemplate>
        </Control.Template>
    </Control>
</Page>

Hope this helps

Answer 4

Thanks, very helpful.

Answer 5

Excellent post Marco.  Just what I needed to set a background image on a HyperlinkButton along with Content Binding.  3 years later and your post is still helping and this works fine in Silverlight 4