Rewrite system.uri string from wpf to winui standard - image

I have png image in the Assets\NavImages\ folder in my WPF Assembly - EhLib.WPF.
And I refer to this file in the Image.Source line as follows.
<Image Source="pack://application:,,,/EhLib.WPF;component/Resources/NavImages/DataNavigator_First.png"
Stretch="None" />
Now I port my Assembly to WinUI and try to use next line .
<Image Source="ms-appx:///Assets/NavImages/DataNavigator_First.png"
Stretch="None" />
to refer to the similar file in the new Assembly - EhLib.WinUI.
But it doesn’t work.
The picture is not displayed.
This only works when the file is located in the main assembly of the executive application.
I can't find any useful information in the documentation.
https://learn.microsoft.com/en-us/windows/winui/api/microsoft.ui.xaml.controls.image.source?view=winui-3.0#microsoft-ui-xaml-controls-image-source

This works only if you set the Build Action of the image to Content and copy it to the output folder:
<Image Source="ms-appx:///ClassLibrary1/Assets/NavImages/DataNavigator_First.png"
Stretch="None" />
I am afraid that embedded resources cannot be extracted using the ms-appx URI scheme. You will have to extract these programmatically yourself.

Related

Xamarin.Forms PCL cannot show image

I'm learning Xamarin.Forms PCL. I want to load image on page, i tried to load image with uri, that's OK. But i add image into project, it's don't work.
<StackLayout Margin="0,20,0,0">
<Image x:Name="img" Source="mario.jpg"/>
<Button x:Name="btnRotate" Clicked="btnRotate_Clicked" Text="Rotate" />
</StackLayout>
Any help is appreciated. Thanks!
You can not include dashes or spaces in image names for Android compatibility
Rename your image from piotr-chrobot-276746.jpg to something else, like piotrchrobot.jpg
https://developer.xamarin.com/guides/android/application_fundamentals/resources_in_android/part_1_-_android_resource_basics/
Don't forget to set the Build action to AndroidResource.

Is it possible to use Image Set in a Xamarin Forms

I am trying to add some Images as Image Sets in a Xamarin.Forms project. I followed this guide . But the icon is not displayed. Is it possible actually to use Image Sets in a Xamarin Forms Solution for the iOS project?
<Image VerticalOptions="Center"
HorizontalOptions="End"
Source="check_outline_500_active.png"
WidthRequest="40">
</Image>
Yes you can.
create the Asset catalog
add Image Set and name it "check_outline_500_active" (without .png)
add the images
done
my xaml
<Image VerticalOptions="Center"
HorizontalOptions="Center"
Source="check_outline_500_active.png">
</Image>
Result
Note
You might have to delete mtbs (on the mac) and bin/obj (on your project) or the build cache can fool you :)
Try to add images in resources folder under xamarin ios project and rename file like :
check_outline_500_active.png,
check_outline_500_active#2x.png,
check_outline_500_active#3x.png
but in code use : check_outline_500_active.png

Wp7 background image not showing up when i debug

I'm new to WP7 programming but have XP with other platforms, I am just running through all the basics so I can get to know the language but I have hit a roadblock I've entered a source for my background image:
<Grid x:Name="LayoutRoot">
<Grid.Background>
<ImageBrush ImageSource="C:/users/hypernova/pictures/Background1.jpg">
</ImageBrush>
</Grid.Background>
</Grid>
And the image shows up as a background in the design tab that is next to the XAML but when I debug and the emulator starts its just a black screen no background image, what have I missed? I have tried other ways of setting a background like:
<Grid x:Name="LayoutRoot">
<Canvas>
<Canvas.Background>
<ImageBrush ImageSource="C:/users/hypernova/pictures/Background1.jpg">
</ImageBrush>
</Canvas.Background>
</Canvas>
</Grid>
but the same thing happens I've tried a few other ways also but again nothing, I'm sure I've missed something I should have caught.
The path
C:/users/hypernova/pictures/Background1.jpg
exists on your dev machine, not on any Windows Phone 7+ device.
Remember, users will be downloading your app from the store, then running it on their phones. How would they possibly access your hard drive and get that image?
Unfortunately, since the design surface allows you to do this, it can of course be confusing to a new developer.
What you should do is add your image to your project as a Resource, then reference the resource via a pack URI (don't click on that link unless you want to scare yourself silly).
To add it as a resource, simply add the image to the root of your WP7 project, right click on it, select Properties, and then change the build action to Resource (not Embedded Resource, mind you).
Next, you have to construct a pack URI for this resource. This is ... not easy. You can use the tools in Visual Studio to do this, by editing the properties of your ImageBrush in the designer. This is the simplest, and recommended, route. All you have to do is edit the ImageSource of your ImageBrush in the Properties tool window, and select the image from the list of available images in the solution.
The other way is to manually construct the pack URI. For example, you could take the following
/[project assembly name];component/Background1.jpg
replace [project assembly name] with the name of your assembly (no extensions), and use it as your ImageSource value. You can find the correct project assembly name by looking at the Assembly Name under the Application section of the project properties.
<ImageBrush ImageSource="/MyWp7Application;component/Background1.jpg"/>
Note, depending on how your project folder structure is constructed, this URI may be different. Constructing the correct URI outside of the tools provided is a task deserving of another question.

How to use a relative image source in WPF using IronPython

I'm creating a WPF project using Python Tools for Visual Studio (in VS 2010). I add an Image control to the form. I click the "..." in the Image's Source property, and find an image.
This adds an "Images" folder to the project (both in the filesystem and in the solution), and copies the image to that folder (again both in the filesystem and in the solution). The image does not show up in the "Add" dialog. The Source attribute is set to "Images/foo.png".
In the XAML the source is blue-underlined because the "Build Action" is not set to "Resource". The only build actions available are "Content", "Compile", and "None". I presume "Resource" isn't available in a dynamic language like IronPython (certainly an embedded resource would be complex). I don't know whether this is the problem or whether this can be ignored.
The image does not show in the live editing window, and it doesn't show when the program runs.
I've tried "/Images/foo.png" (as suggested here), "pack://application:,,,/foo.png", "pack://application:,,,/Images/foo.png", "pack://siteoforigin:,,,/foo.png", and "pack://siteoforigin:,,,/Images/foo.png".
(The siteoforigin doesn't work because the 'origin' is ipy.exe. If I move the Images folder to the folder where IronPython is installed, then this does work. Obviously not a great solution!).
I've tried moving the Images folder in the filesystem to the same folder as the solution (i.e. one level up in the hierarchy), and having the image in the same folder as the .py file rather than in an Images subfolder.
If I change the source (directly in the XAML) to an absolute path, then it works perfectly. Obviously this isn't a great solution either!
How can I use a relative path for the Image?
It is possible. Apparently all you need to do is specify the source as a BitmapImage and relative URI will use the current directory as the base. Ignore the warnings about the file not being a resource, it doesn't really matter. It will show when you run your program.
<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MyWpfApplication" Height="300" Width="300">
<Grid>
<Image>
<Image.Source>
<BitmapImage UriSource="../Relative/Path/To/Image.png" />
</Image.Source>
</Image>
</Grid>
</Window>
I think it is all due to the default value converters for images. If you bypass using them, it all seems to just work out.
The best way I found to deal with image paths is to just completely bypass that ponderous pack:// URI nonsense and simply use a Binding that binds directly to a BitmapImage.
<Image Source="{Binding imgWarningYellow}" Height="50" HorizontalAlignment="Center" VerticalAlignment="Center" />
This way, I can use a simple GetFullPath filesystem call in code to locate the damn thing and load it up as a BitmapImage:
yellowbitmap = System.Windows.Media.Imaging.BitmapImage()
yellowbitmap.BeginInit()
yellowbitmap.UriSource = System.Uri(System.IO.Path.GetFullPath("Images\warning-yellow50.png"))
yellowbitmap.DecodePixelHeight = 50
try:
yellowbitmap.EndInit()
except System.IO.FileNotFoundException as e:
print e.Message
else:
self.imgWarningYellow = yellowbitmap

Silverlight app Image not showing at runtime

In Visual Studio 2010 I have created a new project with the Silverlight Business Application template. I added an Images folder under the Assets folder. The png files in this folder have Build Action set to Resource, and Copy To Output Directory set to Always. In the header section I added an <Image Source="Assets\Images\logo.png" /> element. In design time it displays my image. At runtime it does not.
Any idea as to why my image is missing at runtime?
--Shawn
I had a similar problem with images showing in design-time, but not at runtime. Mine was using a pack URI so I wanted to post that fix as well:
Does not work at runtime, does work at design-time:
<Image Source="TelerikDemo;component/Images/logo.png" />
Works at both design and runtime:
<Image Source="/TelerikDemo;component/Images/logo.png" />
Note the extra '/' before the Pack URI starts.
hmf! Turns out my backslashes needed to be forward slashes!

Resources