I have created a new Silverlight website and wonder how I can set an image to the whole WebForm wich is the entire webbrowsers window ?

I think that the image would be inside this someowhere but am not sure. I am not sure what <UserControl> is also ?

This code creates a Gradient Grid in the left upper corner of the White form. So this White Form that is the whole webbrowserwindow is the Form where I want to put a .bmp picture. I have created a folder: images where I have background.bmp

<UserControl x:Class="myApp.Page"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="400" Height="300" Background="#FFFFFFFF" >
 
    <Grid x:Name="LayoutRoot" >
     <Grid.Background>
      <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
       <GradientStop Color="#FF000000"/>
       <GradientStop Color="#FFA07676" Offset="1"/>
      </LinearGradientBrush>
     </Grid.Background>

    </Grid>
 

</UserControl>

http://silverlight.net/blogs/jesseliberty/archive/2008/01/11/did-you-know-that-if-you-want-your-silverlight-control-to-have-a-transparent-background-you-must-set-iswindowless-to-true.aspx

   you need to set your background to windowless and transparent

http://weblogs.asp.net/olakarlsson/archive/2008/04/18/semi-transparent-silverlight-on-top-of-html.aspx

please mark this post as answered thank you  

Thank you for your response. I am not sure if that helped me. As I beleive I should have done this right in order to have an image as a background for the Grid. I have Added a new folder to my project in the "Solution" and in that folder I have put an image called: backGround.png. The code for that look like this.

<Grid.Background>

</Grid.Background>

But now when I F5 the page I get an error like below and no image was shown. I would be very happy to know what I could miss out.

Line: 453
Error: Sys.InvalidOperationException: ImageError error #4001 in control 'Xaml1': AG_E_NETWORK_ERROR

<UserControl x:Class="myTestPage1.Page"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Height="678"

Background="#FFFFFFFF" xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

<Grid x:Name="LayoutRoot" >

<Grid.Background>

<Grid.RowDefinitions>

<RowDefinition Height="40" />

<RowDefinition Height="*" />

</Grid.RowDefinitions>

<Grid Grid.Row="0" Margin="7">

<Grid.ColumnDefinitions>

<ColumnDefinition Width="*" />

<ColumnDefinition Width="200" />

<ColumnDefinition Width="50" />

</Grid.ColumnDefinitions>

<Border Grid.Column="0" CornerRadius="10" Background="#FFDEDEDE" Margin="0,0,5,0">

<TextBlock Text="DIGG SEARCH" Foreground="#FF14517B" Margin="10,3,0,0" />

</Border>

<TextBox Grid.Column="1" FontSize="14" Text="Topic..." />

<Button Grid.Column="2" Content="Search" />

</Grid>

<TextBlock Grid.Row="1" Margin="10" Foreground="White">

</TextBlock>

<RadioButton HorizontalAlignment="Left" Margin="10,37,0,0" VerticalAlignment="Top" Grid.Row="1" Content="RadioButton" d:LayoutOverrides="HorizontalAlignment, Height"/>

</UserControl>

 Hi,

In Silverlight, the image control can be used to display images. The usage is pretty straight forward. The syntax of using Image control is shown below:

<Grid x:Name="Layout" Width="250" Height="250" Background="GREEN" > <Image x:Name="MyImage" Source="/images/basket.jpg" Stretch="Uniform" ></Image> </Grid>

Image.stretch Property

The Stretch attribute can have the following values:

1. None

This will do no modification on the size of the image. If the image size is more than the size of the container, then the image will be cut to fit in the container.

2. Fill

In this case, the image will be expanded to fill the region of the container. The aspect ratio (proportion of width and height) will not be maintained.

3. Uniform

This is the default value. In this case, the image will be resized to fit the container, but the aspect ratio will be maintained. So, there may be blank space in the container depending on the width and height of the image and container.

4. UniformToFill

In this case, the image will be resized and will fill the container, but aspect ratio will be maintained by trimming some portion of the image if required.

Width and Height properties

The width and height properties of the image can be used to override the stretch property. If width and height properties are specified, then Stretch property will be ignored.

Mark as Answer

Regard

Prateek