[Solved] Unable to have images displayed

[CSurieux]

Hello,

new to silverlight, I am testing the book component.
I created a projet, and adapted the xaml from Telerik binding sample.
I am unable to have my image displayed, for
1) I have under my Silverlight project, Images/Telerik folder  with the same png I copied : using source="/BookTest/Images/Telerik/telerik.png" no success.
2) I also tried copying the full Images folder under the Default.aspx folder using source="/Images/Telerik/telerik.png" no success again.

Here is my code

<qsf:Example x:Class="BookTest.MainPage"
        xmlns:qsf="clr-namespace:Telerik.Windows.QuickStart;assembly=Telerik.Windows.QuickStart"
    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"
    xmlns:telerikNavigation="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Navigation"
    mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480">
    <Grid x:Name="LayoutRoot" >
        <telerikNavigation:RadBook x:Name="RadBook1" Margin="100" IsKeyboardNavigationEnabled="True">
            <telerikNavigation:RadBook.LeftPageTemplate>
                <DataTemplate>
                    <Border BorderBrush="Gray" BorderThickness="1">
                        <Grid Background="White">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" />
                                <RowDefinition Height="*" />
                                <RowDefinition Height="Auto" />
                            </Grid.RowDefinitions>

                            <Border Background="LightGray" Opacity="0.5" BorderThickness="0 0 0 1"
                                    BorderBrush="Gray">
                                <TextBlock Text="This is a Left page." HorizontalAlignment="Center"
                                        FontSize="20" FontWeight="Bold" TextWrapping="Wrap" />
                            </Border>
                            <Image Source="/Images/Telerik/telerik.png"
                                    HorizontalAlignment="Center" VerticalAlignment="Center"
                                    Grid.Row="1" />
                            <TextBlock Text="{Binding}" HorizontalAlignment="Center" Grid.Row="2"
                                    VerticalAlignment="Center" FontSize="72" FontWeight="Bold"
                                    TextWrapping="Wrap" />
                        </Grid>
                    </Border>
                </DataTemplate>
            </telerikNavigation:RadBook.LeftPageTemplate>
            <telerikNavigation:RadBook.RightPageTemplate>
                <DataTemplate>
                    <Border BorderBrush="Gray" BorderThickness="1">
                        <Grid Background="White">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" />
                                <RowDefinition Height="*" />
                                <RowDefinition Height="Auto" />
                            </Grid.RowDefinitions>

                            <Border Background="LightGray" Opacity="0.5" BorderThickness="0 0 0 1"
                                    BorderBrush="Gray">
                                <TextBlock Text="This is a Right page." HorizontalAlignment="Center"
                                        FontSize="20" FontWeight="Bold" TextWrapping="Wrap" />
                            </Border>
                            <Image Source="/BookTest/BookTest/Images/nice_crm.png"
                                    HorizontalAlignment="Center" VerticalAlignment="Center"
                                    Grid.Row="1" />
                            <TextBlock Text="{Binding}" HorizontalAlignment="Center" Grid.Row="2"
                                    VerticalAlignment="Center" FontSize="72" FontWeight="Bold"
                                    TextWrapping="Wrap" />
                        </Grid>
                    </Border>
                </DataTemplate>
            </telerikNavigation:RadBook.RightPageTemplate>
            <telerikNavigation:RadBookItem  Content="Page 1">
            </telerikNavigation:RadBookItem>
            <telerikNavigation:RadBookItem Content="Page 2">
            </telerikNavigation:RadBookItem>
            <telerikNavigation:RadBookItem Content="Page 3">
            </telerikNavigation:RadBookItem>
            <telerikNavigation:RadBookItem Content="Page 4">
            </telerikNavigation:RadBookItem>
        </telerikNavigation:RadBook>
    </Grid>
</qsf:Example>

Certainly an evidence !
Thanks for help.

CS

[CSurieux]

Ok, I don't know why but it works with

<Image

 

Source="Images/myimage.png" />
as myimage.png is considered as a resourse by visual studio silverlight seems to be able to extract images resources with this strange 'relative url path' ?

CS

 

[Kiril Stanoev]

Hi Christian,

You have to remove the forward slash from the source path, so instead of having Source="/BookTest/BookTest/Images/nice_crm.png" you have to have Source="BookTest/BookTest/Images/nice_crm.png". I am attaching the DataBinding sample. Have a look at it and let me know if you still experience the same issue.

Sincerely yours,
Kiril Stanoev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[CSurieux]

Thank you Kiril,

With an asp.net background, this king of uri was dispointing.
Why the absolute version doesn't work ?

CS

[Kiril Stanoev]

Hello Christian,

Here is an article that explains how URIs work in Silverlight:

Silverlight 2: Demystifying URI references for app resources

Hope this helps.

Regards,
Kiril Stanoev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[CSurieux]

Ok, Thanks.