I've successfully been able to use a static .svg file as an image in WPF by following the guidance in another question.
The basic approach there is to use the SharpVectors library, and do:
<svgc:SvgViewbox Source="path/to/file.svg"/>
In place of an <Image .../> tag.
However I am struggling trying to find a similar method to use an SVG within a System.Windows.Controls.Ribbon - where i'd like to use it as the SmallImageSource of a RibbonMenuButton.
I have tried the following:
<RibbonMenuButton Label="Test">
<RibbonMenuButton.SmallImageSource>
<svgc:SvgViewbox Source="path/to/file.svg"/>
</RibbonMenuButton.SmallImageSource>
</RibbonMenuButton>
Which produces the compiler error message:
The specified value cannot be assigned. The following type was
expected: "ImageSource".
I think the key problem is that an svgc:SvgViewBox is not an "image source", but I don't know how to properly convert or otherwise work around this.
I'm open to alternate approaches which don't use SharpVectors, but it is extremely convenient to have source image files in SVG format and not have to manually convert to any other format.
SharpVectors includes a converter extension which can be used to 'output' an ImageSource.
This is documented in section "1.2 WPF Extensions and Type Converters" of their usage guidelines.
Example:
<RibbonMenuButton Label="Test" LargeImageSource="{svgc:SvgImage path/to/file.svg}"/>
(where svgc is the defined name of the SharpVectors namespace in your XAML.)
The svgc:SvgImage binding extension produces a DrawingImage which is a type of ImageSource. This works perfectly at runtime with the SVG image rendered into the button.
Unfortunately at design-time the button image is blank.
Please try using the newly added property; AppName, which is used to try and resolve the URI of the resource file at design-time.
See the samples for the SvgImage and newly added SvgImageConverter, especially the toolbar demo using the SVG icons.
https://github.com/ElinamLLC/SharpVectors/tree/master/TutorialSamples/ControlSamplesWpf
SvgImageConverter provides binding support, if you need it unlike the SvgImage.
Related
I have an application where I'm taking a XAML template from a database record, plugging in new text strings and image references, and showing it in a window.
I take the XAML text and create a DependencyObject using this property:
public DependencyObject ParsedXamlTree
{
get
{
String xaml;
DependencyObject theDependencyObj;
xaml = ProcessedXaml;
byte[] xamlData = Encoding.Unicode.GetBytes(xaml);
using (MemoryStream ms = new MemoryStream(xamlData))
{
theDependencyObj = (DependencyObject)XamlReader.Load(ms);
}
return theDependencyObj;
}
}
Within the XAML will be an Image tag. For example:
<Image x:Name="categoryImage"
HorizontalAlignment="Center"
Height="240"
Margin="72,42,408,318"
VerticalAlignment="Center"
Width="320"
Source="SampleAssets\pacman-151558_640.png"/>
The problem I'm having is that when I parse the DependencyObject tree and get to the corresponding Image object, the string "SampleAssets\pacman-151558_640.png" from the Source attribute seems to be missing.
I notice that when it reads and parses the XAML, there is an IO exception being thrown within WPF itself. That's the line where XamlReader.Load is called. This exception is caught within the library so I'm only seeing evidence of it in the debug trace window.
I'm guessing that it's trying to find "SampleAssets\pacman-151558_640.png" for the Image tag and failing. That's fine in itself, as I always figured the image sources would have to be patched up at runtime.
The question is, how do I retrieve the "SampleAssets\pacman-151558_640.png" string that was in the original XAML? Is there somewhere in the Image object I can get this?
Worst case scenario would be parsing the XAML myself to find the tag and extracting the attribute string from it, but I'm hoping that's not necessary.
WPF has a built-in type converter (ImageSourceConverter) that converts URI strings to ImageSource objects (the type of the Image.Source property). If an image could not be loaded from an URI string, the converter returns null, so the Source property of your Image control will also be null.
There is nothing in the object tree that will keep the URI of a non-available image. You will have to parse the XAML Template before loading and replace invalid image URIs by valid ones.
I have a function (I inherited the code and am new to .Net) that is defined as
private void setTextBoxes(DataView dv, FCKeditor txtField, HiddenField hidField)
We were using the ckEditorv2 (FckEditorv2), but due to incompatibility issues they want to go to just use the ajaxcontroltoolkit htmleditor. I cannot figure out what to put in place of FCKEditor in the above code call. I have tried various things like HTMLEditor, ajaxeditor and cannot figure what this is really pulling and how I access it or replace it with the ajax control instead of the FCKEditor control.
Thank you for any help you can give me.
wb
ANSWER:
It turns out I was not using the correct collection. I was using AjaxControlToolKit and I needed to (perhaps also) use AjaxControlToolKit.HTMLEditor. Once I used that collection it recognized Editor as the correct parameter type and then I just had to clean up the code (such as AjaxControlToolKit does not have .value, it is .content) and it works!
ANSWER: It turns out I was not using the correct collection. I was using AjaxControlToolKit and I needed to (perhaps also) use AjaxControlToolKit.HTMLEditor. Once I used that collection it recognized Editor as the correct parameter type and then I just had to clean up the code (such as AjaxControlToolKit does not have .value, it is .content) and it works!
i have a project with a lot of assemblies (> 100). many of those assemblies have subfolders like "images". many wpf-windows/user-controls for example have a "\images\close.png". that means that i have many "close.png" pictures instead of just a single one.
now i want to create a central place for all images/resources. what i did:
created a new class-libary/assembly called "a.b.c.d.e.Core.Resources"
added a resourcedictionary called "ImageDictionary.xaml"
created a subfolder "Images"
copied my images to this subfolder. for example "a.b.c.d.e.Core.Resources\images\close.png"
setting the built property of the image to "resource"
declared the image in the "ImageDictionary.xaml" like this "< ImageSource x:Key="Image_close">close.png< /ImageSource>"
using the dictionary in the wpf window where i want to use the "close.png" image like this
< Window.Resources>
< ResourceDictionary Source="pack://application:,,,/a.b.c.d.e.Core.Resources;component/Images/ImageDictionary.xaml"/>
< /Window.Resources >
trying to use the image declared in the central resource dictionary "ImageDictionary.xaml" like this < Button>< Image Source="{StaticResource Image_close}">< /Image>< /Button>
in the designer mode of VS the image is beeing displayed but when i start the project and open my wpf window i get an error like
"{"The File or Assembly \"a.b.c.d.e.Core.Resources, Culture=neutral\" or one of its dependencys can't be found. The system can't find the given file.":"a.b.c.d.c.e.Resources, Culture=neutral"} (i translated the error message from german to english :) )
Does anyone have any idea what i did wrong and why i can't get the central resourcedictionary getting to work properly? Thanks for any ideas!!!
Greetings from Germany
edit:
i also have a reference to "a.b.c.d.e.Core.Resources" in the assembly where my wpf window is
edit 2:
System.Windows.Markup.XamlParseException: Message=RowNumber "7" and RowPosition "10" of "Setting the Property "System.Windows.ResourceDictionary.Source" caused an exception".
Ok, the first idea I have is, that the file cannot be found because of the maximum path length limitation of the WinApi. I'm not sure about it, because I don't know anything about the internals of the resource loading mechanism.
Please try to start the program from a shorter path. Perhaps, it'll solve the problem.
EDIT
Just an idea, is your ImageDictionary.xaml declared as resource? If not, you should set its build step to "resource".
EDIT2
Next idea. Please empty the ImageDictionary.xaml by commenting out the elements. Uncomment the dictionary element by element. Perhaps, you'll find the reason for your problem, this way.
I'm trying to use an icon that I've added as a resource as the image on a button. I know it's possible because I can do it in other projects through the designer. However, I'm trying to do this with code. I added the icon as a resource to my project by following the steps in the accepted answer to this question. The resource is named CancelButtonIcon.
Now, I'm trying to add that icon as the image on a standard button with this code:
this.CancelButton.Image = (System.Drawing.Image)Properties.Resources.CancelButtonIcon;
However, I get an error message:
Cannot convert type 'System.Drawing.Icon' to 'System.Drawing.Image'
In the code that Visual Studio automatically generates when I use the designer, it looks like this:
((System.Drawing.Image)(resources.GetObject("SaveButton.Image")));
which results from manually adding a resource through the Properties window. How can I convert this icon resource to an image so it can be used on the button? Adding it through the designer is not an option (this button is created programmatically and thus isn't present in the designer).
You can use the Icon.ToBitmap method for this purpose. Note that a Bitmap is an Image.
CancelButton.Image = Properties.Resources.CancelButtonIcon.ToBitmap();
Not sure why, but any time I tried using the accepted answer's approach, the .ToBitmap() call was giving me array index out of bounds exceptions. I solved this by doing it this way instead:
System.Drawing.Icon.FromHandle(Properties.Resources.CancelButtonIcon.Handle).ToBitmap();
I'm trying to draw a SVG File. So far I've tried using an Image tag and a WebView with the svg itself or an object / embed tag. Nothing so far seems to help, and all the dll's I've found so far need .NET.
Examples of what I've tried so far (note: Paths have all been tried with or without ms-appx:///, note2: using img tag in webview for non-svg types hasn't worked either)
WebView:
webView.NavigateToString("<embed src='circle1.svg' type='image/svg+xml' />");
webView.NavigateToString("<object data='circle1.svg' type='image/svg+xml' />");
webView.NavigateToString("<svg>....</svg>");
Image:
<Image Source='circle1.svg'>
I am not sure if you can include external images this way, have you tried with other image formats? Have you tried using an absolute path? I would also consider using the data tag as image source instead of an external file.
Example (from wikipedia):
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg=="
alt="Red dot">
Additionally, there is project in codeplex called xamltune that can convert a svg file into an xaml file. Maybe you can insert the output xaml code in your application instead of using a WebView.