PDA

View Full Version : SVG rendering problems and doubs



GuS
3rd October 2009, 21:42
Hi Guys,

I am making and example code (for integrate later in my proyect) to print receipts using a SVG as template.

I have 2 problems:

1. Does Qt supports very will <tspan> inside <text>?:
The idea is to let user draft a SVG receipt template using Inkscape. Now, in inkscape when you create a <text> and inside that one newlines are inserted by using <tspan>. Every SVG viewer and browser shows this correctly, having one string under other as expected. Qt does not, it puts the strings one next the other (avoiding the existence of <tspan>). Now, i could fix this by inserting just one string per <text> and not using <tspan>. But the main question is if Qt supports it and if does, what i am doing wrong?.
2. Another related to rendering, as you can see in the SVG, i have a background in which represents the receipt structure. Well, Qt only is rendering only the backgrond color and the external borders. The lines inside the background, does not appear (which again, it works in all browsers and SVG viewers).

There is something i am doing wrong?

Here is my example code:

Main svn dir: http://websvn.tuxfamily.org/listing.php?repname=opencoffee%2Fopencoffee&path=%2Ftrunk%2Fsandbox%2FSvgTemplate%2F&#path_trunk_sandbox_SvgTemplate_

The main code is in mainApp.py and in that folder you have the SVG template too.

The example is in Spanish, but is just completing anything in the lineEdits and just adding some articles (artÃ*culos) with some values (cantidad, precio = quantity, price) for the testing and then just preview or print it.

Thanks in advance for any help and tips you guys can give me.

ChrisW67
4th October 2009, 08:25
I've done exactly this myself.


1. Does Qt supports very will <tspan> inside <text>?:

QtSvg only supports the static features of SVG Tiny. From that spec on wrapping text:


Each 'text' element causes a single string of text to be rendered. The 'text' element performs no automatic line breaking or word wrapping. To achieve the effect of multiple lines of text, use one of the following methods:
* Use the 'textArea' element to specify a rectangular area in which to flow the text.
* Pre-compute the line breaks (which can be done by the author or authoring tool) and use individual 'text' elements to manually place the lines of text. (Note: this is discouraged for accessibility reasons.)
* Express the text to be rendered in another XML namespace such as XHTML [XHTML] embedded inline within a 'foreignObject' element. (Note: the exact semantics of this approach are not completely defined at this time.)

Unfortunately Inkscape does none of these things in its multi-line text. If memory serves it uses an attribute from the draft SVG Full 1.2 (flowRoot and flowRegion). I simply created multiple text objects for multi-line fixed text. For columns of variable text I retrieved a named bounding box and rendered the text within the rectangle after rendering the template. You could try manually using a textarea.

2. Another related to rendering, as you can see in the SVG, I have a background in which represents the receipt structure. Well, Qt only is rendering only the backgrond color and the external borders. The lines inside the background, does not appear (which again, it works in all browsers and SVG viewers).
In my application background shading was optional and only rendered when requested (I painted selected SVG objects by id). I had to be careful that the background was painted before the overlying lines or it would obscure them. If you do something similar this is something to watch for.

When I get to my Qt dev machine I'll try your code and see if I can see the the same problem.

Edit:
It does that for me too.

ChrisW67
4th October 2009, 09:25
I took a look at the paths defining the left table and it struck me that it was dictating a lot of moveto (m) commands that don't (shouldn't) draw, and a few lineto (l) and circle (c) commands that do. The line and circle commands are your outer border.

<path
id="billBg_original"
style="fill:#f0f0f0;stroke:#000000;stroke-width:1.77165353000000003;
stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;
stroke-opacity:1;stroke-dasharray:none;fill-opacity:1"
d="m 495.27339,970.73588 0,-358.53854
m -71.27008,324.1224 0,-324.21608
m 158.9011,358.77089 -511.991713,0
m 511.991713,-34.25 -511.991713,0
m 511.991713,-324.5625 -511.991713,0
m 511.991713,-22.52773 -511.991713,0
m 511.991713,-69.55806 -511.991713,0
m 511.991713,-54.68568 -511.991713,0
m 255.995853,-139.98177 0,139.96355
M 80.901962,325.27594
l 492.013188,0 c 5.54,0 10,4.46 10,10
l 0,669.17246 c 0,5.54 -4.46,10 -10,10
l -492.013188,0 c -5.54,0 -10,-4.46 -10,-10
l 0,-669.17246 c 0,-5.54 4.46,-10 10,-10 z" />
(line wrapping is mine)
When I used the Path/Break Apart option in Inkscape and readjusted the depth the missing lines were drawn. The SVG got a bit bulkier with multiple paths. Inkscape may be doing something odd with these paths when combined

I drew my complex grids as a collection of rectangles and lines rather than one compound path.

GuS
5th October 2009, 00:47
Hi!

Thanks for the reply. Seems that Qt even have problems rendering lines. I just create from scratch the bg and external borders as a rectangle and the same for the lines, just used thin rectangles and works. As for the text, i will just create separated <text> for the data, which that works.

Before i was using a html/css template to generate this (with QWebKit for the rendering part) but seems that this QWebKit has problems to render too: i was rendering the template with a more small size... weird... in all browsers (nt webKit based) was good.

Thanks!