Search code examples
c#imagexamltelerik

Why can't I see the image on my Telerik button

This is a part of a xaml file in my C# program:

<telerik:RadRibbonGroup Header="General/Tests">
    <StackPanel Orientation="Horizontal">
        <telerik:RadRibbonButton Command="{Binding Path=...}" Style="{StaticResource RibbonTabButton}">
            <StackPanel Orientation="Vertical">
                <Image Source="/ThisProject;component/Pictures/Coldstart.png" />
                <TextBlock Text="Coldstart all zones" TextAlignment="Center"/>
            </StackPanel>
        </telerik:RadRibbonButton>
    </StackPanel>
</telerik:RadRibbonGroup>

I have added the "<Image Source ..." piece of source code by dragging that filename from the Solution explorer into the xaml file, yet I don't see anything when I run the code. The XAML designer is not working properly, so I need to run the project in order to see if it works.

That mentioned *.png file is something I have added to my project, it looks as follows in the *.csproj file:

<Project ToolsVersion="14.0" 
         DefaultTargets="Build" 
         xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
...
  <ItemGroup>
    <Content Include="ThisProject.ico" />
    <Content Include="Pictures\Coldstart.png" />
    ...
  ...

Why don't I see the picture, but only the text of the "Coldstart" button? Do I need to do any action (like an "image import") to make this work?

For your information, this is what is looks like (don't worry about not seeing the header of the RadRibbonGroup, it is visible more to the right but the entire thing is too large):

enter image description here

I have modified the <Content> into a <Resource> tag:

<Resource Include="Pictures\Coldstart.png" >
  <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
</Resource>

This is A LOT better, but the image is too large. Is there an "AutoResize" option to the image or to the RadRibbonButton?

It currently looks as follows (incomplete image and no room for the text anymore):

enter image description here

Solution

  • Instead of Content

    <Content Include="Pictures\Coldstart.png" />

    use Resource

    <Resource Include="Pictures\Coldstart.png" />

    consider declaring all files as resource in your pictures directory with this

    <Resource Include="Pictures\**\*.*" />

    (notice: this also includes all sub directories)