Mini-project: interactive display of SVG

concreteRick

Anyone interested in a mini project for rendering SVG dynamically?

The following is a high level, conceptual description of a Qt project requirement.

The objective is to create a Qt dialog containing an area for entering hand-crafted SVG as
follows:

An area where a user can type or paste SVG Tiny elements in text form (without SVG root element,
namespaces, etc). Ie. for color gradients, line drawing, text, etc.

E.g. (1)
```
 <circle cx="40pt" cy="40pt" r="24pt" style="stroke:#006600; fill:#00cc00"/>
 <circle cx="40%" cy="40%" r="24%" style="stroke:#006600; fill:#00cc00"/>
```
E.g. (2)
```
 <linearGradient id="lGrad1" gradientTransform="rotate(20 1.5 .1)" >
    <stop offset="0%" stop-color="white"/> <stop offset="20%" stop-color="#4c4c48"/>
    <stop offset="60%" stop-color="#a9a9a9"/> <stop offset="88%" stop-color="#3c3c38"/>
 </linearGradient>
 <rect fill="url(#lGrad1)" width="100%" height="100%" rx="0.5mm" ry="1.0mm" />
```
This would be a re-sizable text entry area, w/ scrollbars as applicable.

This area would have an associated Preview button.

Note that the <svg> root element, and its x, y, width and height attributes, are omitted
because the <svg> element and associated attribute values will be supplied at runtime
by the higher-level application depending on the context in which the SVG code is
used.
A re-sizable display area showing rendered SVG

After the Preview button in (1) above is clicked, the text in (1) is parsed/validated
and if valid then displayed graphically in a re-sizable pop-up display area as rendered SVG.

Ideally the parsing/validating process would highlight errors in the SVG code. But this is not essential. The usage is intended only for SVG aficionados ...

When the user is happy he/she may click a Save button. The result is that the approved SVG code
gets saved into a large XML structure, within a name-tagged <xSVG> element. For the purposes
of this mini-project, it's sufficient that the SVG code can be saved to a file.

I'm hoping this may be a not-too-difficult project. But I don't know much about Qt's inbuilt
capabilities, or whether Qt can easily support such a concept.

If anyone thinks this is do-able at reasonable cost, please feel ultra-welcome to contact me
to discuss it, with the idea of subsequently being interested in providing a quotation for the
work involved. (rick at datazone dot com). And hopefully in follow-up work on a large Qt GUI application.

Rick

mrjj

Hi
Just as a note.
Qt only support SVG Tiny
https://www.w3.org/TR/SVGMobile12/
So SVG 1.1 might contain elements Qt won't support.

concreteRick

Ah! Many thanks for the info/correction. At first glance, SVG Tiny provides support for more than sufficient artifacts than needed in this case, so would be fine. So if/when I figure how to edit the OP, I'll change the reference from SVG 1.1 to SVG Tiny.
Thanks again,
/Rick

mrjj

@concreteRick
Hi
You can edit with the alt text
menu.

Also, as far as i know
https://doc.qt.io/qt-5/qsvgrenderer.html
does not really give any error output so it might not be possible to
provide code highlighting for invalid constructs.

As least i did not see any while fiddling with some SVG from Inkscape that Qt would not draw
the text part correctly.

concreteRick

Many thanks. No worries. Code-highlighting not so important for this mini-project. So it can be skipped. /Rick