- Qt 6.9
- Qt Qml
- Qt Qml Tooling
- svgtoqml
- Qt 6.9.3 Reference Documentation

qmlimportscanner ◦ qmlcachegen

# svgtoqml

`svgtoqml` is a command line tool shipped with Qt that converts an SVG document to a QML file. This QML file can then be used as a component in Qt Quick applications. The Weather Forecast Example includes multiple QML files that have been generated using this tool.

## Overview

The `svgtoqml` will convert an SVG file to a QML file which uses Qt Quick primitives. Since Qt Quick supports scalable vector graphics, the resulting item will be smoothly transformable as far as this is possible. As a baseline, the tool supports most of the static features of the SVG Tiny 1.2 profile. Certain additional features are supported, determined on a case-by-case basis. Interactive features and animations are not supported.

## Usage

The basic usage of `svgtoqml` is to provide an input file and an output file: `svgtoqml input.svg output.qml`. This will read the `input.svg` file and convert it into the corresponding Qt Quick scene in `output.qml`, which can then be used as part of a Qt Quick application.

In addition, it supports the following options:

Option | Description
--- | ---
–copyright-statement <string> | Adds <string> as a comment at the beginning of the generated file.
-c, –curve-renderer | Enables the curve renderer backend for Qt Quick Shapes. This enables smooth, antialiased shapes in the scene without multi-sampling, but at some extra cost.
-p, –optimize-paths | Enables optimization of paths before committing them to the QML file, potentially making them faster to load and render later.
–outline-stroke-mode | Stroke the outline (contour) of the filled shape instead of the original path.
-t, –type-name <string> | In place of Shape, the output will use the type name <string> instead. This is enables using a custom item to override the default behavior of Shape items.
-v, –view | Display a preview of the Qt Quick item as it will be generated.

## Comparison to other options

There are multiple options for including SVG content in Qt Quick. The following will give an overview of where `svgtoqml` fits into the story.

### Comparison to Qt SVG

Qt SVG is a module which provides a parser and software renderer for SVG files. In addition, it includes an image loader plugin, so that SVG files can be loaded directly by the Image element in Qt Quick. The SVG will then be rasterized and cached at a specified size and redrawing it will be quite cheap. But zooming into the image without pixelation will involve reloading it at a different size, which in turn can be expensive.

`svgtoqml` (and the VectorImage component) are alternative ways of rendering the same content. Once loaded into Qt Quick, transforms can be changed while retaining the geometry data needed to render the scene in GPU memory. Thus, the vector image can be redrawn at different scales with very little overhead.

If the image size will not change during the life time of the application, however, loading the SVG as an Image will be more efficient. In this case, if the SVG is always rendered at a small subset of possible sizes, consider pre-rasterizing it to an image format which is more efficient to load, such as `PNG`.

### Comparison to VectorImage

The VectorImage component provides the same basic functionality as `svgtoqml`, but instead of pregenerating the Qt Quick scene as a QML file, it creates the scene at runtime. This allows loading SVG files that are not provided at build time and thus allows for more flexibility. Pregenerating the scenes with `svgtoqml` allows optimizing the scene before it is loaded. Thus, for files that are available at build time, `svgtoqml` is the preferred option.

### Comparison to PathSvg

The PathSvg component is part of the Qt Quick Shapes module. It provides a way to define paths with the syntax used by SVG, where the control points of a path are specified as a string. It does not support loading SVG files, so it is not a direct alternative to `svgtoqml`. If a complex SVG contains a specific shape needed by the application, then copying this path description into PathSvg may be more convenient than generating the full file.

qmlimportscanner ◦ qmlcachegen