What road to take to load an SVG graphic into a FireMonkey app?

Question

There are about four implementations I can think of that are capable of loading SVG graphics into a Delphi application.

One of those, by Mattias Andersson, who is the author of FMX.Canvas.VPR , works with FireMonkey, but he's not yet prepared to release the code.

A second one, by Martin Walter, works with the VCL, but developer has quit Delphi and has no plans to convert to FireMonkey.

A third one, part of the AGGPAS framework, works with the VCL, but no FireMonkey.

A fourth one is in development by Jason Southwell, but no date has been fixed yet.

So my question: what road to take if I want an SVG component today, without trying to reinvent the wheel a fifth (and probably more) time?

Hug

Please, provide the url links of the resources you reference. – Hierarchy

Done, but someone edited the question so that one was lead to believe that FMX.Canvas.VPR was the SVG implementation, which is not so. Corrected. – Hug

Maybe this provides some useful information as well: stackoverflow.com/questions/63607/rendering-svg-with-delphi – Saberhagen

Answer 1

The SVG component I've been working on has been released as part of our Apesuite for Firemonkey.

http://arcana.sivv.com/apesuite

Curtice

Bought the beta and having a blast with it! Beautiful piece of coding! – Hug

Thanks. Had fun building it. – Curtice

Your site says it is no longer available for purchase. Any plans to change that? – Unalienable

It was discontinued due to changes in FM2 that closed loopholes I was using to fix bugs in FM1. I would like to take a stab at it again now that FM is more mature. – Curtice

Answer 2

I'm Mattias Andersson -- the author of FMX.Canvas.VPR; I can say that I'm still actively working on the SVG solution. I guess once I have properly added support for gradients and text rendering then I can release a first beta version. I'm relying on TXMLDocument and that is a bit restrictive in what you are permitted to do (IMO), so I've had to invent some workarounds (maybe a better option would have been to implement my own XML class from scratch.) Also, I've had to do some run-time patching of the FireMonkey classes in order to make everything work correctly. The good part is that I'm actually implementing things according to the SVG interface specifications.

Nematic

Many thanks for your heads-up, Mattias. Will the the loaded SVG graphic be built-up in FireMonkey object descendants so that each can be manipulated separately? – Hug

Well, there is a TSVGImage class that descends from the FMX TControl class. The TSVGImage class has a document property of the TSVGDocument class (a TXMLDocument descendant.) Each node in the TSVGDocument class is a TXMLNode descendant that implements the appropriate SVG interfaces for that particular node type. As an example a TSVGPathElement node implements ISVGAnimatedPathData, ISVGPathElement, ISVGLocatable, ISVGTests, ISVGExternalResourcesRequired, IEventTarget, ISVGLangSpace, ISVGStylable, ISVGElement (if the node represents a visual primitive then it would also have a Paint method.) – Nematic

Of course one option would be to associate each node with a separate TControl class -- it has some advantages -- you can easily change properties in the object inspector for instance. The drawbacks would be additional memory overhead and it would be more closely tied to FMX (I'm planning to reuse the SVG implementation for a different project of mine that is not dependent on FMX.) – Nematic

Thx. I see this is probably not going to be anywhere near "today", right? :) – Hug

Answer 3

Getting involved with Mattias Andersson in the development is the best option:

• FMX.Canvas.VPR by Mattias Andersson looks promising and VPR is proven to be an excellent project
• No spoon-fed SVG FireMonkey component working out-of-the-box is available as of the time of posting (extensive web search made in general).

Hierarchy

I fully agree on the excellence of Mattias Andersson's creations. The problem is that I need a component today. Maybe I should ask him to get into some kind of beta. – Hug

I've also searched for it in a few but notable french and german delphi forum but were in vain. I suspected that the chinese counterpart might have cooked something interesting: They are very prolific and seem to keep up well with the new Firemonkey. Maybe you may call for special help from chinese speaking SO member. – Hierarchy

Answer 4

You could also consider using Chromiumembedded. Just load the svg in the embedded browser. You can then mix Delphi code with javascript, mix in html and css, etc.

This way, you can just leave it up to Chrome how to draw stuff fast (for example whether to employ gpu acceleration or not).

You'll get proper svg support, it's easy to integrate into your application, it's flexible, and there is lots of documentation and example code available online.

Saberhagen

Thank you for your reply. I had considered Chromiumembedded as an HTML viewer component, but would think it's rather overkill to load a simple SVG sprite. The small SVG graphic should be quickly loaded and translated into FireMonkey objects, so they are then free to be manipulated, such as transparency, rotation, scaling, color etc. And this for their individual components. Don't know if Chromiumembedded offers this in an elegant fashion? – Hug

If you load a svg, you can easily grab it as a bitmap; also off-screen. But yes, if you just have a couple of simple sprites, then ChromiumEmbedded is probably way overkill – Saberhagen