Ok i have in my project Resources about 5 Images. What i want to do is to Bind an Image.Source from my Project Resources. Im C# code its pretty easy, i just do :
ImageHolder.Source = Propetries.Resources.Image1.png.
How can this be done in XAML?
Something like this :
<Image Source={??????}/>
Thanks in advance.
Visual studio will create Resources folder and put your image file into it when you add image to the resx file.
In order to use this image in binding you will need to change build action from None to Resource. After that you can bind as follows:
<Image Source="Resources/your_image_name.png"/>
You can not bind directly to Propetries.Resources.your_image_name because of you will need to convert System.Drawing.Bitmap to WPF BitmapSource. But you can bind to strings in the Resource.resx:
<TextBlock Text="{x:Static properties:Resources.YourStringResource}"></TextBlock>
Read here how to convert System.Darwing.Bitmap to the WPF bitmap: Load a WPF BitmapImage from a System.Drawing.Bitmap
And here about binding to the values in the resx file: Get values from *.resx files in XAML
Make sure your Build Action for image is marked as Resource and then you can simply do this in your XAML -
<Image Source="Properties/Resources/a.png"/>
Assuming Propetries/Resources is folder structure in your project where your image is present.
Related
I put crypto.png image into drawable folder under Resources in Android Project.
After I right click on the image -> Build Action -> Embedded Resource.
In MainPage.xaml on the main project I try to load the image like that:
<Image x:Name="HeadImage"
WidthRequest="100"
HeightRequest="100"
MinimumHeightRequest="100"
MinimumWidthRequest="100"
VerticalOptions="CenterAndExpand"
HorizontalOptions="CenterAndExpand"
Aspect="AspectFit"
Source="crypto.png"/>
But the image not load.
I try a second method like this in the c# code:
var HeadImage = new Image { Aspect = Aspect.AspectFit };
HeadImage.Source = ImageSource.FromFile("crypto.png");
And this method not worked again..
You need to let your image in drawable folder as Android Resource instead of Embedded Resource, and to use it, you need to:
HeadImage.Source = "crypto.png";
Also, before set the image, is a good practice to remove MinimumWidthRequest and MinimumHeightRequest. This is safe ONLY if you are sure the image have this minimum size. Otherwise, your image will not appear.
To know more about image in Xamarin, see here.
And to understand the difference between the ways of set an ImageSource see here.
I can't display an image on WPF window during runtime. However, it is shown during design mode. The image is located in Images folder and Build action is set to Content as well is Copy to output to Copy Always. The output Any suggestions?
===EDIT====
The output type of a project is : Class Libray, if I change it to Window Application the bellow are workign fine. However I still need to build it is Class library.
2nd try
<Image Source="pack://siteoforigin:,,,/Images/Logo2.png" Grid.Row="0"/>
3rd try
<Image Source="pack://application:,,,/Images/Logo2.png" Grid.Row="0"/>
Also,
If I put a full path to the image location it is working, apparently this is not ideal situation:
<Image Source="C:/.../Images/Logo2.png" Grid.Row="0"/>
Rebuild your entire solution and try again. It probably didn't do a build with images in it when you tried it again.
Also use your 3rd try again then build action to content, no need to make a copy always.
After several trials the answer was quite simple:
For Class Library Project set your images Build Action to Resource and get a reference in Xaml as:
<Image Source="/YOURNAMESPACE;component/Images/Logo.png"/>
It won't work with png, but convert to jpg and write:
<Image Source="/YOURNAMESPACE;component/Images/Logo.jpg"/>
That works for me :)
I have two .png files added to my resources which I need to access their Uri when doing binding.
My xaml code is as followed:
<Grid>
<Image>
<Image.Source>
<BitmapImage DecodePixelWidth="10" UriSource="{Binding Path=ImagePath}"/>
</Image.Source>
</Image>
</Grid>
and the binding code using ImagePath is:
ImagePath = resultInBinary.StartsWith("1") ? Properties.Resources.LedGreen : Properties.Resources.ledRed;
However
Properties.Resources.LedGreen
returns a Bitmap instead of String containing the Uri of that particular image.
I just want to know how to extract that value without a need to address a path of the image in the directory that it's stored. (Which honestly I am not sure is a right thing to do as I couldn't find any similar situation on the net).
Please let me know if there is even a preferred method to the one I am trying to use if available.
In a WPF application you would usually not store images in Properties/Resources.resx and access them by means of the Properties.Resources class.
Instead you just add the image files to your Visual Studio project as regular files, perhaps in a folder named "Images" or the like. Then you would set their Build Action to Resource, which is done in the Properties window. You get there e.g. by right-clicking the image file and select the Properties menu item. Note that the default value of the Build Action should be Resource for image files anyways.
In order to access these image resources from code you would then use a Pack URI. With the above folder name "Images" and an image file named "LedGreen.png", creating such an URI would look like this:
var uri = new Uri("pack://application:,,,/Images/LedGreen.png");
So you could perhaps declare your property to be of type Uri:
public Uri ImageUri { get; set; } // omitted INotifyPropertyChanged implementation
and set it like this:
ImageUri = resultInBinary.StartsWith("1")
? new Uri("pack://application:,,,/Images/LedGreen.png")
: new Uri("pack://application:,,,/Images/LedRed.png");
Finally your XAML should look like shown below, which relies on built-in type conversion from Uri to ImageSource:
<Grid>
<Image Width="10" Source="{Binding Path=ImageUri}" />
</Grid>
Declare the Properties.Resources.LedGreen property as ImageSource and set it to Uri location rather than the Bitmap object.
Or if you insist of storing it as a bitmap you can get the source by returning Properties.Resources.LedGreen.ImageSource which will be of type ImageSource.
I would prefer the first approach.
I'm trying to use resource files (.resx) in a class library. I'm having trouble using these resources in my library's XAML files because libraries do not come with an App.xaml file. So I can not do:
<Application.Resources>
<local:LocalizedStrings xmlns:local="clr-namespace:WPLocalization" x:Key="LocalizedStrings" />
</Application.Resources>
How do I go about localizing a self-contained WP8 library/assembly?
I found a way but it's rather a work around.
The solution is not to try to localize your controls from XAML, but instead from your behind code.
For example, you define a Button in XAML as follows:
<Button Name="MyButton" />
And then in your partial class behind you set the content of the button programatically as follows:
MyButton.Content = MyLocalizedStrings.Hello;
Of course, in this example you would have a resource file called "MyLocalizedStrings.resx" in your project with a string named "Hello" in it.
This approach solves the problem. The only down side is that you won't be able to see a preview of the localized XAML in the Visual Studio XAML window.
I would like to load vector graphics stored as XAML files (separate files, not in a dictionary), embedded in my application, and I have a few questions to do so:
XAML looks a bit ambiguous, since it can be used to represent either static resources like vector images, or interfaces which are being dynamically built like the ones in WPF. Because of this, the format of a XAML vector image is unclear to me : what should be the root element, like the "svg" tag for svg vector images ? Currently, I'm using a Canvas as the top element since I want to plot my graphics in another Canvas.
What is the best method to load those file programmatically (I mean, to create the Canvas from the xaml files) ? I've seen (and tried) different solutions with XamlReader, but nothing worked: the app crashes and the debugger does not help (most problems I've encountered seem to occur during the parsing, and the error message was unclear).
I've read http://learnwpf.com/post/2006/06/04/How-do-I-Include-Vector-Based-Image-Resources-in-my-WPF-Application.aspx, but the link to the article dealing with resource files loading is dead, and the images are not created using C# code.
Okay, I found the solution by myself and here it is :
My project is named "Editor", and I've placed the XAML file I want to read in a "Graphics" folder. This file is named "Image.xaml".
The project tree looks like this :
The XAML file itself holds this code :
<Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
Width="40" Height="40">
<Rectangle Canvas.Left="0" Canvas.Top="0" Fill="White" Stroke="Black" StrokeThickness="1" Height="40" Width="40" />
<!-- ... -->
</Canvas>
(the xaml namespace 'xmlns' reference is needed)
The code used to load the file is :
StreamResourceInfo sr = Application.GetResourceStream(new Uri("Editor;component/Graphics/Image.xaml", UriKind.Relative));
Canvas result = (Canvas)XamlReader.Load(new XmlTextReader(sr.Stream));
layoutRoot.Children.Add(result);
'layoutRoot' being the name of the main Canvas of my application.
Last subtility : the property 'BuildAction' of the *.xaml file must be set to 'Resource', or you will encounter a XamlParseException with hexadecimal value 0x0C (to change this property, right-click on the file in the project treeview).
Hope this can help.