1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
|
// Copyright (C) 2024 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
pragma ComponentBehavior: Bound
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import QtQuick.VectorImage
ApplicationWindow {
id: topLevel
width: 800
height: 800
visible: true
title: qsTr("Vector Image Example")
color: "lightpink"
property real sourceSize: Math.min(topLevel.width / 12, topLevel.height / 12)
Component {
id: imageComponent
//! [image]
Image {
sourceSize: Qt.size(topLevel.sourceSize, topLevel.sourceSize)
source: "heart.svg"
}
//! [image]
}
Component {
id: vectorImageComponent
//! [vectorimage]
VectorImage {
width: topLevel.sourceSize
height: topLevel.sourceSize
preferredRendererType: VectorImage.CurveRenderer
source: "heart.svg"
}
//! [vectorimage]
}
Component {
id: svgtoqmlComponent
//! [svgtoqml]
Heart {
width: topLevel.sourceSize
height: topLevel.sourceSize
}
//! [svgtoqml]
}
GridLayout {
id: grid
anchors.fill: parent
columns: 3
uniformCellWidths: true
rowSpacing: 0
Label {
id: label
Layout.alignment: Qt.AlignTop | Qt.AlignHCenter
text: "Image"
color: "black"
font.pixelSize: 20
font.bold: true
}
Label {
Layout.alignment: Qt.AlignTop | Qt.AlignHCenter
text: "VectorImage"
color: "black"
font.pixelSize: 20
font.bold: true
}
Label {
Layout.alignment: Qt.AlignTop | Qt.AlignHCenter
text: "svgtoqml"
color: "black"
font.pixelSize: 20
font.bold: true
}
Repeater {
id: repeater
property int count: grid.columns
model: grid.columns * count
Item {
id: repeaterDelegate
required property int index
property int margin: 10
Layout.preferredHeight: ((grid.height - label.height - margin) / repeater.count)
Layout.preferredWidth: ((grid.height - label.height - margin) / repeater.count)
Layout.alignment: Qt.AlignTop | Qt.AlignHCenter
clip: true
Rectangle {
anchors.fill: parent
border.width: 1
color: "lightcoral"
radius: 10
}
Item {
property int row: repeaterDelegate.index / grid.columns
transformOrigin: Item.Center
anchors.fill: parent
Loader {
id: loader
property int column: repeaterDelegate.index % grid.columns
anchors.centerIn: parent
sourceComponent: {
switch (column) {
case 0: return imageComponent
case 1: return vectorImageComponent
case 2: return svgtoqmlComponent
}
}
}
scale: 1 + row * 1.5
}
}
}
}
}
|
