Silverlight Image element not showing up - silverlight

Silverlight newbie question:
I've got a small Silverlight application with the following XAML snippet:
<Image Source="http://judahhimango.com/images/smileys/cool.gif" />
The image doesn't show up! I would expect the image to download asynchronously, then show up in the UI, but alas, no such luck.
What am I doing wrong?
Update -------------------------------------------------
Ok, no-go on the .GIFs, forgot about that. But using a PNG doens't work either:
<Image Source="http://judahhimango.com/images/smileys/cool.png" />
However, if I change the Source to a BitmapImage, then it works:
<Image>
<Image.Source>
<BitmapImage UriSource="http://judahhimango.com/images/smileys/cool.png" />
</Image.Source>
</Image>
Why can't I just specify the Image Source? Why do I have to specify a BitmapImage?

I changed two properties on my png image: Build Action to Content and Copy to Output Direct Copy always.

I think SL does not support gifs:
http://forums.silverlight.net/forums/p/3883/232781.aspx
can you try a jpg?
3/9/10: Editing per request:
I can't post complete code, but here is my MainPage.xaml
<UserControl x:Class="SilverlightApplication2.MainPage"
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"
mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480">
<Grid x:Name="LayoutRoot">
<Image Source="http://judahhimango.com/images/smileys/cool.png"/>
</Grid>
</UserControl>
3/9/10: OK, I think I know what your problem may be. When you create a new silverlight application project in Visual Studio, it gives you the option of hosting it in an ASP.NET website. Did you select that option? If not, please select it, and give it a try. See this:
deep zoom is not displayed

Related

WPF: MediaElement doesn't display at runtime

This concerns WPF. The problem is that my MediaElement (actually a GIF) doesn't show up at runtime (so I only get an empty screen), even though it shows perfectly in the design mode. Before citing the code I note the following:
The GIF-file in question has been added to the solution.
Its BuildAction property is set to Resource (I've checked).
When I replace the MediaElement by an Image element (and either use the same GIF-file or replace that source-file by a .png file), the image/GIF does display at runtime. Just not when it's used as a MediaElement.
Closing and re-starting Visual Studio doesn't help.
As I said (and just to emphasize, if I may), the GIF image does display in the design mode part of the screen - just not at runtime.
And here's the code:
<Window x:Class="Testing.TestWindow"
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:local="clr-namespace:Testing"
mc:Ignorable="d"
Title="TestWindow" WindowState="Maximized">
<StackPanel>
<MediaElement Source="pack://application:,,,/Images/untitled.gif" Stretch="Fill" Visibility="Visible" />
</StackPanel>
</Window>
Thanks.

View in a module not displaying image but it will display text

I am using MEF, Prism and WPF. I have a simple module (for now, I'll do more with it when I get past this roadblock) that displays a single image sourced as static resource in that module. Here is the xaml for the view:
<UserControl x:Class="SplashScreenModule.SplashView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d"
Height="960" Width="1180">
<Grid>
<Label>
<Image Source="Images/My Image.png"/>
</Label>
</Grid>
The image shows up in the designer but when I run the code the window is blank. If I replace the image with simple text the text is display as expected.
<Label>
This shows up in the window.
</Label>
I've spent the last 3 hours trying to figure this out and am stumped. I would appreciate any help.
Thanks,
Bill
You have to know that there is a difference on how ressources are managed at DesignTime and at RunTime. At DesignTime there is no compilation required, thus it is able to display a ressource even if it is not include in the project.
At runtime this is normally possible, but it is better to include the ressources in your project (ie create a folder Images in your solution, and add the "My Image.png" in this folder), to be sure of the location of your ressource compared to your exe.
If you do it and the image still doesn't show up, try to remove the label and execute again.
By doing this it works fine for me. As soon as the image show up, you can add back the label.
Hope it helps.
The following code is working for me:
<Window x:Class="LabelImage.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
<Label>
<Image Source="Images/visual studio.png" />
</Label>
</Grid>
</Window>
I structured my solution like you did: I have the picture inside a folder named Images. The MainWindow is located directly under the project node (it's not in any subdirectory).
Make sure that the Build Action for your image is set to resource, otherwise it won't work with the WPF Resource Finding System (which internally uses PACK-Uris: http://msdn.microsoft.com/en-us/library/aa970069(v=vs.110).aspx)
I use .NET 4.5 with VS 2013. If you have any further questions, please feel free to ask.
Update after Bill's comment:
That's a whole different thing when your resource resides within another assembly. The syntax for referencing the image should be like this:
<Image Source="/ClassLibraryForResources;component/Images/visual studio.png" />
where you do the following steps:
Begin with a slash "/"
Specify the name of the assembly that holds your resource (this can also be a strong assembly name)
Continue with ";component/"
End with the path of the image (or other resource)
(Please note that you have to omit the quotation marks).
The solution that I used is structured like this:
This should resemble what you have described. Again: it's all about the PACK URIs that WPF uses (see link above).

Metro Style in WPF applications _ Packages differences

I want to create a metro style application, I did some researches and I found lots of articles and tutorials about that.
But I still need a clear comparison between Modern UI for WPF , Elysium and MahApps.
Testing all of them takes too much time ! I need to learn bout each one's features to decide with which one to start.
Thanks,
first : Download the WPF Shell Integration Library Here
then use this XML Code :
<Window x:Class="MyLibrary.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:shell="http://schemas.microsoft.com/winfx/2006/xaml/presentation/shell"
Title="MainWindow"
WindowStyle="SingleBorderWindow"
ResizeMode="CanResizeWithGrip"
mc:Ignorable="d"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
d:DesignHeight="449"
d:DesignWidth="677"
Foreground="White"
removed="Black">
<shell:WindowChrome.WindowChrome>
<shell:WindowChrome CaptionHeight="35"
GlassFrameThickness="0,0,0,1"
ResizeBorderThickness="5" />
</shell:WindowChrome.WindowChrome>
<Grid x:Name="LayoutRoot">
</Grid>
</Window>
(note, you need to have referenced Microsoft.Windows.Shell)
This is really the Best way to do that.. It will work on all windows versions.
Edit:
if you want to add Caption Buttons on the top of the window add this XAML code to any control at the top: (button as example)
<button shell:WindowChrome.IsHitTestVisibleInChrome="True"/>

Image shows in Expression Blend but not during runtime

The image in question is located in a ControlTemplate inside of a ResourceDictionary similar to this (various details removed for clarity):
<ResourceDictionary
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">
<ControlTemplate x:Key="ImageTestTemplate" TargetType="ImageTest">
<Grid>
<Image Source="/MyAssembly;Component/Images/MyImage.png"/>
</Grid>
</ControlTemplate>
</ResourceDictionary>
When I view the control in Expression Blend the image shows up just fine, but when I run the app the image does not show up. If I drop the same image into a UserControl it also shows up just fine, so the problem has something to do with using the template.
Is there some other way I should be loading the image resource inside the template?
I don't think you need the leading '/'. The base resource path I'm using for a project is "IMLPrototype2;component/Model/Sounds/" in SL 3 & 4.

Load Silverlight Canvas as a seperate XAML File?

I want to be able to store various Canvas items in seperate XAML files so for example they are declared as:
<canvas x:Class="Item.One" Height="300" Width="400">
...
</canvas>
and another like this
<canvas x:Class="Item.Two" Height="300" Width="400">
...
</canvas>
I am wondering why I cannot get this to work when I try and load them in as classes I get a parser error, I can do this fine in WPF but not in Silverlight 3.0, what can you do to have to have XAML work as objects rather than resources?
Just to help the Parser error is
AG_E_PARSER_BAD_TYPE
And a real example that does not work:
<Canvas x:Class="Cards.Appointment.ZuneVertical" x:Name="ZuneVertical"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="240" Height="320" Background="White">
</Canvas>
In my code I want to do this:
Preview.Children.Add(Item.One)
Where Preview is a Grid within a ScrollView which is where I want the XAML to be loaded into, ie the Canvas, there a various versions of Canvas I want to load into this Preview Pane, each one is a Class as XAML in WPF, but cannot seem to get this to work in Silverlight 3.0 without the parsing error, tried UserControls but this has the same problem!
Seems it was a problem with the Namespace of my XAML file I added the Application Namespace and this resolves the problem.
<Canvas x:Class="ZuneCardrintouch.Cards.Appointment.ZuneVertical" />

Resources