Looking for SVG support in Delphi?

[pyscripter 689]

In an earlier thread I presented an Interface-based access to native Windows (Direct2D) SVG support for Delphi applications.  This has now been integrated into the SVGIconImageList components by @Carlo Barazzetta.  Carlo is a kind of master of ImageLists (among other things).  Have a look at his IconFontsImageList for instance. His SVGIconImageList component was based on the work of Martin Walter who must be a great programmer.  His SVG component covered almost every SVG element and was well structured and cleanly written.  There were numerous bugs and issues though, which, to a large extent, were fixed over the last few weeks and the code was refactored and optimized.  Finally, @Vincent Parrett contributed a virtual version of the Image List, mirroring Delphi's VirtualImageList.

 

So in its current form the component features:

• An SVGImageCollection component that inherits from Delphi's CustomImageCollection and thus is compatible with VirtualImageList
• A choice of SVG engines:  the pascal one based on Martin's work which is using GDI+ and the native Windows one which is using Direct2D.
• Other SVG engines can be plugged-in with minimum effort.
• Excellent design support with a nice and effective SVGImageCollection editor developed by Carlo and the built-in VirtualImageList editor.
• Support for changing the opacity and color of the SVGs including using GrayScale.  If you adopt  Material Design for example and you use VCL styles, you can adjust the icon color to the style.
• Compatibility with older Delphi versions going back to XE6.
• It is free and open-source

 

Svgs are vastly superior to bitmaps because they are typically tiny text files and scale perfectly.  So, you do not need to ship with your application multiple resolutions of your images to match the DPI of the monitors.  And there is a vast number of free SVGs to cover most needs.  IMHO the combination of SVGImageCollection with Delphi's VirtualImageList is the best available solution (commercial ones included) for building DPI-aware Windows applications.  Give it a try.

Edited August 25, 2020 by pyscripter

[Shrinavat 16]

Looks great, is there any chance of animation support (like SVGMagic do)?

[Vincent Parrett 750]

Animation is not simple, I can only imagine the amount of work required to implement animation - and that's not really the intended direction for SVGIconImageList - as you can tell from the name of the library, it's about using svg with imagelists. 

[Carlo Barazzetta 116]

I want to personally thank Vincent Parrett and Kyriakos Vlahos for the great contribution to the project!
The official 2.0 version will be released shortly and also published on GetIt.
Meanwhile, you can download the project from Github and report any problems.

I'm also working on IconFontsImageList to add similar funcionalities, like a IconFontsVirtualImageList and IconFontsImageCollection...
 

[Carlo Barazzetta 116]

I've published an article about SVGIconImageList and IconFontsImageList:
https://ethea.it/icons_in_delphi/

[c0d3r 17]

2 hours ago, Carlo Barazzetta said:

I've published an article about SVGIconImageList and IconFontsImageList:
https://ethea.it/icons_in_delphi/

Great article,  Thanks for the post.

[Kryvich 165]

@Carlo Barazzetta Thank you! Your components are a must-have for High-DPI enabled applications. I would say High-DPI is a second revolution in Delphi desktop development after Unicode.

[Lars Fosdal 1791]

@Carlo Barazzetta, This looks awesome, but I found a bug and identified the cause.
https://github.com/EtheaDev/SVGIconImageList/issues/119
Luckily it was possible to work around the bug by removing the offending section.

[Tntman 14]

Are you saying that we could use SVG images in our delphi apps ? Wow this is great, i am having destop app that have really heavy user interface, i am struggling with making different size of images ( png and jpg ) images so it can look nice on my app.. SVG will solve everything, i will try it very soon 

[Lars Fosdal 1791]

Related: A good source of SVG icons: https://www.flaticon.com/

[Carlo Barazzetta 116]

Good news about 2.4.0 version of SVGIconImageList:
- Added new engine: Image32 library (ver.3.0) by Angus Johnson (VCL+FMX)
- Image32 is now the default native Delphi engine, because has more SVG functionalities like blur, gradient, merge, drop-shadow, markers, simbol, pattern, subpixel.
- Added support for Android and iOS platforms (by Image32 engine)
- Added support for backward Delphi versions (from XE3)
- Added demo to compare the four engines (SVGViewer)

[dwrbudr 8]

I could provide resvg bindings if you like and a compiled DLL files (32 and 64bit)

[ASuni 0]

Hi!

 

" The official 2.0 version will be released shortly and also published on GetIt. "

 

Is this toolkit available already in GetIt, and / or is it available for "Embarcadero® RAD Studio 10 Seattle Version 23.0.22248.5795 "?

I tried searching in GetIt of Delphi 10 Seattle for "SVG" and it came up empty. Am I doing something wrong or is this not (yet?) available in this way and/or for this IDE version?

 

Regards,

  Antti

 

[Carlo Barazzetta 116]

On 5/2/2022 at 8:32 AM, ASuni said:

Hi!

 

" The official 2.0 version will be released shortly and also published on GetIt. "

 

Is this toolkit available already in GetIt, and / or is it available for "Embarcadero® RAD Studio 10 Seattle Version 23.0.22248.5795 "?

I tried searching in GetIt of Delphi 10 Seattle for "SVG" and it came up empty. Am I doing something wrong or is this not (yet?) available in this way and/or for this IDE version?

 

Regards,

  Antti

 

In the last version, 3.9.1 on GitHub Repo (https://github.com/EtheaDev/SVGIconImageList), I've added support for Delphi 10 Seattle (only VCL).

[Carlo Barazzetta 116]

News on the latest versions of SVGIconImageList components:

The library now also supports the SKIA4Delphi SVG engine, but Image32 remains the best library for SVG rendering for complex files, as you can see in SVGViewerDemo.
Cairo support has been removed.

 

 

[Bbommel 3]

Hi Carlo, hi all! After I saw this thread, we decided to try this SVG components and the results are really awesome! But there is one really annoying issue: someone seems to think that it is a really good idea, to include a "{$MESSAGE HINT 'Use Delphi native Image32 SVG-Engine for SVGIconImageList'}" to indicate the used engine. So, on every build this hint pops up - a hint should be a note to take a closer look at a specific code not a simple debug information. And I didn't find a place to turn this off. 😞 Are we doing anything wrong? How to get rid of this? Otherwise, because of this little thing, this library would be useless for us.

 

(I know how I could change the code myself, but I would like to use the standard, otherwise we would have to change it with every update 🙂 )

 

We are using the version deployed via GetIt.

Edited June 16, 2023 by Bbommel

[Uwe Raabe 2057]

I found that hint also annoying, especially as some people tend to have no hints and warnings when building their projects. IMHO it would be sufficient to emit it only f.i. in DEBUG mode or even better controlled by a specific DEFINE.

 

As a workaround you can pre-compile the component units and use only the DCUs for your projects. As you stated, you prefer not to change the code, you can as well go this way - it will even speed up compile time a bit. That doesn't hinder you to debug the sources as long as everything is set up properly.

Edited June 16, 2023 by Uwe Raabe

[Bbommel 3]

+1 for a specific "DEFINE" to enable or disable this feature. I also don't want to have this warnings in the normal debug mode. But good to know that I'm not the only one struggeling with this.

 

How do I get this precompiled dcu the best way? Sounds like a good workaround to me, but I only know the other way around when including a file of the Delphi RTL in my project. 🙂 Simply compiling the project seperatly doesn't seem to help. Do I have to place the dcu-files in my destination folder manually?

[Uwe Raabe 2057]

4 minutes ago, Bbommel said:

How do I get this precompiled dcu the best way?

When compiling the packages set dedicated DCU output folders for RELEASE and DEBUG. Then compile the packages first with DEBUG configuration and after that with RELEASE configuration (the other way round would make you work with DEBUG packages in the IDE). Then copy all DFM and RES files from the sources to the RELEASE DCU folder.

 

In your Project Options replace the Search path to the SVG sources with the RELEASE DCU folder from above in the BASE configuration and add the DEBUG DCU folder in the DEBUG configuration. That way the debug dcus are found before the release dcus, while the resource files are still taken from the release folder.

 

To make the debugger find the source files, select Debugger in Project Options, switch to the DEBUG configuration and add the source folder you just replaced to Source Path.

 

 

[Bbommel 3]

Thanks Uwe for your detailed instruction! For a first test I did a shortcut of this and simply replaced the searchpath to the "source" of the libraries by the path Lib\D11\Win32\Release and it works (of cause I'm loosing the chance to debug the library this way).

 

I will also open an issue in the GitHub repository in case @Carlo Barazzetta misses this discussion here. 🙂