Create XAML icons and replace the shipped pngs with these

[batzen]

We need to convert the shipped pngs to xaml icons to be able to change their colors based on the current theme.
This would also solve issues like #635

Any help is greatly appreciated as i am very bad when it comes to creating icons/graphics.

[Splitwirez]

I know this isn't a direct answer, but InkScape can trace raster images fairly well, and can then export the result to a series of WPF paths... https://inkscape.org/en/

[batzen]

I already tried that and the results looked horrible...

[Splitwirez]

...right. I haven't used that feature much, but the one time I did use it, I got pretty good results after fiddling with the options for a few moments. In any case, though...how many icons are we talking about? 🤔

[batzen]

There are about 10 icons that would need to be converted.

[LucaFagan]

Convert your PNGs to SVGs and then use "Expression Blend 4" to export the vector images to xaml.

If conversion from png to svg is horribile then you have to create the icons from scratch.

I can help, where can I find those icons ?

[batzen]

The icons are here https://github.com/fluentribbon/Fluent.Ribbon/tree/develop/Fluent.Ribbon/Images and here https://github.com/fluentribbon/Fluent.Ribbon/tree/develop/Fluent.Ribbon/Themes/Images
Help is very appreciated ;-)

[LucaFagan]

Do you need xaml icons in multicolor or in one color ?

I mean, if an icon is yellow and black (for example Warning.png) and I give you a xaml of that icon, will you be able to change the yellow and the black according to the theme ?

[batzen]

It depends on the icon. For some icons which are black now i'd need to be able to change that to white depending on the theme. The warning icon should already look good on the dark and light background. The reason to convert all icons is that they are scaleable then.

[LucaFagan]

Do you have the icons in higher resolution? It a bit difficult to create vector images starting from low resolution raster images.

[batzen]

Sadly not. The ones in the repo are the only ones i got.

[LucaFagan]

I've created the vector version of your icons and converted into xaml.

Download is here: https://drive.google.com/open?id=1hAXIYXWeCKETSeBQiIT-RkNHkPDSKlRo

Vector icons are in VectorIcons.zip
XAML icons are in the example: TestXAMLImages.zip

I've changed some icons to a most modern design. Launch the example to see the result.

Let me now if you want some changes.

[punker76]

@DenZuck That work looks really nice! 👍

[batzen]

Sorry for my late response. Will have a look at these during the next week.

[batzen]

@DenZuck
The icons look very nice. Thanks a lot for your work.
Is there some way to get those as XAML icons? Currently you exported them to png files which is not what i imagined.
I hoped to replace all png files with xaml icons so that i am able to change their colors during runtime.
I can't really do something with the ai files, or which free program can i use for those?

[LucaFagan]

Look at the TestXAMLImages.zip sample project, icons are already in xaml format.

XAML icons are defined in Icons.xaml
Icons are used in MainWindow.xaml

As I told in another message I used "Expression Blend 4" to convert .ai into xaml but you don't need to do that because they are already converted and ready to use in TestXAMLImages.zip.

[batzen]

Uh, i am sorry. Tried to change the foreground of the images in snoop, opened the solution and only saw the png files.
Will have a second look during the week.

[LucaFagan]

In first column I use your original icons, in other columns I use xaml icons in various sizes.

XAML icon definitions

XAML icon use

[batzen]

Thanks @DenZuck for creating those icons!
I replaced all shipped images. If you find any oddities/problems please report back.