Qt SVG：不再是1.2Tiny了

Qt SVG: Not so 1.2 Tiny any more

Qt SVG：不再是1.2Tiny了

February 03, 2024 by Matthias Rauter | Comments

​Matthias Rauter，2024年2月3日|评论

Introduction

介绍

Qt SVG has been around for basically forever, at least from the perspective of a Millennial like me. It has been a great tool to keep pixel artefacts away from our applications, a trait that has become increasingly important especially on highDPI displays. Unfortunately Qt SVG implements only SVG 1.2 Tiny, which can be limiting in many cases.

​至少从我这样的千禧一代的角度来看，Qt SVG基本上已经存在了很长一段时间。它是一个很好的工具，可以让像素伪影远离我们的应用程序，这一特性变得越来越重要，尤其是在高DPI显示器上。不幸的是，QtSVG仅实现SVG1.2Tiny，这在许多情况下可能是有限制的。

In 2015 I defended my Master thesis and I built my presentation with the Qt Graphics View Framework to make something that looked like Prezi but with crisp LaTeX equations. I used LaTeX and QGraphicsSvgItem to power the equation editor of my little presentation application (This was before MathML and MathJax took over the math world). Unfortunately, LaTeX created many <symbol> elements that were not part of SVG 1.2 Tiny and Qt did not want to render it. I helped myself with a pipeline of tools that eventually transformed my files into valid SVG 1.2 Tiny. A rather annoying experience.

​2015年，我为我的硕士论文进行了辩护，并用Qt图形视图框架构建了我的演示文稿，使其看起来像Prezi，但具有清晰的LaTeX方程。我使用LaTeX和QGraphicsSvgItem为我的小型演示应用程序的方程编辑器供电（这是在MathML和MathJax接管数学世界之前）。不幸的是，LaTeX创建了许多＜symbol＞元素，这些元素不是SVG 1.2 Tiny的一部分，Qt不能渲染它。这是一次相当烦人的经历。

I was still lucky, as symbols can be easily replaced with other SVG 1.2 Tiny elements. However, this is not always the case, especially with <mask>, <pattern> and <filter>, which are SVG (not SVG 1.2 Tiny) elements that cannot be emulated easily. To make things worse, these are very common elements that are used by many applications and designers without considering standards or their versions. In fact, even QSvgGenerator creates masks and patterns to augment the capabilities of QPainter. In short, many SVGs that cross the path of Qt SVG contain something beyond SVG Tiny and our SVG renderer is probably the sole defender of a strict SVG Tiny 1.2 standard.

​我仍然很幸运，因为符号可以很容易地被其他SVG 1.2Tiny元素取代。然而，情况并非总是如此，尤其是<mask>、<pattern>和<filter>，它们都是SVG（而不是SVG 1.2 Tiny）元素，无法轻松模拟。更糟糕的是，这些都是非常常见的元素，许多应用程序和设计者在使用这些元素时没有考虑标准或其版本。事实上，甚至QSvgGenerator也会创建掩码和模式来增强QPainter的功能。简而言之，许多跨越Qt-SVG路径的SVG包含SVG Tiny之外的内容，而我们的SVG渲染器可能是严格的SVG Tiny 1.2标准的唯一捍卫者。

New Features

新特征

In this situation it does not make much sense to stick to the standard. So when our chief-maintainer asked me to implement selected useful elements beyond SVG Tiny 1.2, I was very happy to oblige. Fast forward half a year and another release of Qt (6.7) we now provide support for the following SVG 1.1 (lower version number but no tiny here) or SVG 2.0 elements:

在这种情况下，坚持标准没有多大意义。因此，当我们的首席维护人员要求我实现SVG Tiny 1.2之外选定的有用元素时，我非常乐意。半年后，随着Qt（6.7）的再次发布，我们现在提供了对以下SVG 1.1（较低版本号，但此处不是tiny）或SVG 2.0元素的支持：

• <symbol>
• <marker>
• <pattern>
• <mask>
• <filter>, <feFlood>, <feGaussianBlur>, <feColorMatrix>, <feOffset>, <feMerge> and <feComposite>

We added these elements not to be compliant with SVG 1.1 or 2.0, but to deal with the most common stuff our users see. We limit our self to the most popular use cases and in particular to static elements. Please keep that in mind when testing our newest SVG renderer. If you think we missed something elemental, feel free to reach out to us or comment here. Last but not least there is the Qt Webengine module that aims to be compliant with SVG 2.0, in case you need the full standard. Qt SVG should stay a lightweight alternative to it.

​我们添加这些元素不是为了与SVG 1.1或2.0兼容，而是为了处理用户看到的最常见的东西。我们将自己局限于最流行的用例，尤其是静态元素。在测试我们最新的SVG渲染器时，请记住这一点。如果您认为我们遗漏了一些基本内容，请随时联系我们或在此处发表评论。最后但并非最不重要的是，Qt-Webengine模块旨在与SVG 2.0兼容，以防需要完整的标准。Qt-SVG应该是轻量级的替代品。

Let us look at some stuff we can do since Qt 6.7:

让我们看看自Qt 6.7以来我们可以做的一些事情：

First of all, we can do equations, thanks to the <symbol> element:

首先，由于＜symbol＞元素，我们可以创建方程：

Your browser:	Qt 6.7:

Similar to the <symbol> element is the <marker> element. It allows us to decorate a path:

与＜symbol＞元素类似的是＜marker＞元素。它允许我们装饰一条路径：

Your browser:	Qt 6.7:

We can now also fill objects with a pattern, thanks to the <pattern> element:

由于＜pattern＞元素，我们现在也可以用图案填充对象：

Your browser:	Qt 6.7:

The <mask> element does what a mask should do and gives designer a lot of flexibility:

＜mask＞元素完成了mask应该做的事情，并为设计者提供了很大的灵活性：

Your browser:	Qt 6.7:

The <filter> element can contain many filter primitives, that are applied in consecutive order. I counted 19 filter primitives in SVG 1.1, and as of Qt 6.7 we support six of them.

<filter>元素可以包含许多按连续顺序应用的过滤器基元。我统计了SVG 1.1中的19个过滤器原语，截至Qt 6.7，我们支持其中的6个。

With the supported <feOffset>, <feGaussianBlur> and <feMerge> we can draw Shadow effects:

使用支持的<feOffset>、<feGaussianBlur>和<feMerge>，我们可以绘制阴影效果：

Your browser:	Qt 6.7:

The filter <feColorMatrix> allows to exchange color:

滤镜＜feColorMatrix＞允许交换颜色：

Your browser:	Qt 6.7:

And finally, <feComposite> enables rather complex compositions.

最后，＜feComposite＞实现了相当复杂的合成。

Your browser:	Qt 6.7:

Final Notes

最终注释

Not everything in these elements is supported. For example, we do not support stroke="context-stroke" or  fill="context-fill"  in the marker element, but neither does Chromium. We are also limited in terms of color spaces and only support color-interpolation-filters="sRGB". The filters can not use the background as input and the Gaussian blur filter looks a bit funky with a rotational transformation in combination with unequal vertical and horizontal derivation (a bug I intend to fix). We are also aware that we miss many filter primitives and one of my personal favorites, <clipPath> (We have a patch available by now). However, with the recent change you should see a huge improvement in rendering everyday SVGs. We are about on the same level, sometimes a bit better, than most viewers I could find on Ubuntu, including Inkscape. We have a new page in our documentation that keeps track of supported and unsupported elements and features.

​并非这些元素中的所有内容都得到支持。例如，我们不支持标记元素中的stroke=“context stroke”或fill=“context fill”，但Chromium也不支持。我们在颜色空间方面也受到限制，仅支持颜色插值滤波器=“sRGB”。过滤器不能使用背景作为输入，高斯模糊过滤器看起来有点时髦，旋转变换与不相等的垂直和水平导数相结合（我打算修复这个错误）。我们还意识到，我们错过了许多过滤器基元和我个人最喜欢的一个＜clipPath＞（我们现在有可用的补丁）。然而，随着最近的变化，应该会看到在渲染日常SVG方面有了巨大的改进。与我在Ubuntu上能找到的大多数观众（包括Inkscape）相比，我们的水平差不多，有时甚至更好。我们的文档中有一个新页面，可以跟踪支持和不支持的元素和功能。

But it gets even better, as this is just the beginning of a new era for Qt SVG. With this step, we are opening Qt SVG up to support elements beyond SVG Tiny 1.2. This means that we will aim to include useful and common elements from SVG 1.1 and SVG 2.0, if maintenance is reasonably feasible. We will not aim for compliance with these standards but we will keep an eye on feature requests from our users. Further, we are open to contributions of such extensions by the community. So if you miss your favorite SVG element in the list above, fell free to send us some code, preferably on our code review platform.

​但它变得更好了，因为这只是Qt-SVG新时代的开始。通过这一步，我们将打开Qt SVG，以支持SVG Tiny 1.2以外的元素。这意味着，如果维护合理可行，我们将致力于包含SVG 1.1和SVG 2.0中有用和常见的元素。我们不会以遵守这些标准为目标，但我们会密切关注用户的功能请求。此外，我们对社会各界对这类延期的贡献持开放态度。因此，如果您错过了上面列表中您最喜欢的SVG元素，请随时向我们发送一些代码，最好是在我们的代码审查平台上。

If you feel that all of this is a mistake and that we should have never left the safe haven of a well-defined standard, you can still get back the old behavior: Just set the new flag SvgRenderer::options to include QtSvg::Tiny12FeaturesOnly and our parser and renderer will ignore everything that is not included in SVG 1.2 Tiny.

如果您觉得所有这些都是一个错误，并且我们不应该离开定义良好的标准的安全港，那么您仍然可以恢复旧的行为：只需设置新的标志SvgRenderer::options以包括QtSvg::Tiny12FeaturesOnly，我们的解析器和渲染器将忽略SVG 1.2 Tiny中未包含的所有内容。