Remove forgotten examples in the 'customitems' dir
This patch removes the following examples in particular: - progressbar - scrollbar - searchbox - slideswitch - spinner - tabwidget The reason for removing them is that they've clearly been forgotten, and no longer serve a purpose. They can only be built with qmake, since they're missing a CMakeLists.txt file, and even if you try to build them, the build will fail since the DECLARATIVE_EXAMPLE_MAIN macro in shared.h were at some point updated to prepend the resource patch to have the same prefix that the AUTO_RESOURCE_PREFIX cmake flag provides. Which had the side effect of causing these examples to no longer build out of the box. The purpose of the examples has been to demonstrate how to make custom controls. Today we recommend users to instead make custom styles for QQC2, which the flatstyle example demonstrate how to do. Pick-to: 6.5 Change-Id: I26af18ecaef836495f0c2a7e376268b1f956b1a9 Reviewed-by: Volker Hilsheimer <volker.hilsheimer@qt.io> Reviewed-by: Mitch Curtis <mitch.curtis@qt.io>
This commit is contained in:
Oliver Eftevaag
parent
7fdac218ad
commit
f97bdd0b70
|
|
@ -5,10 +5,4 @@ SUBDIRS = \
|
|||
|
||||
EXAMPLE_FILES = \
|
||||
dialcontrol \
|
||||
flipable \
|
||||
progressbar \
|
||||
scrollbar \
|
||||
searchbox \
|
||||
slideswitch \
|
||||
spinner \
|
||||
tabwidget
|
||||
flipable
|
||||
|
|
|
|||
|
|
@ -1,46 +0,0 @@
|
|||
// Copyright (C) 2017 The Qt Company Ltd.
|
||||
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
|
||||
|
||||
import QtQuick
|
||||
|
||||
Item {
|
||||
id: progressbar
|
||||
|
||||
property int minimum: 0
|
||||
property int maximum: 100
|
||||
property int value: 0
|
||||
property alias color: gradient1.color
|
||||
property alias secondColor: gradient2.color
|
||||
|
||||
width: 250; height: 23
|
||||
clip: true
|
||||
|
||||
BorderImage {
|
||||
source: "background.png"
|
||||
width: parent.width; height: parent.height
|
||||
border { left: 4; top: 4; right: 4; bottom: 4 }
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
id: highlight
|
||||
|
||||
property int widthDest: ((progressbar.width * (value - minimum)) / (maximum - minimum) - 6)
|
||||
|
||||
width: highlight.widthDest
|
||||
Behavior on width { SmoothedAnimation { velocity: 1200 } }
|
||||
|
||||
anchors { left: parent.left; top: parent.top; bottom: parent.bottom; margins: 3 }
|
||||
radius: 1
|
||||
gradient: Gradient {
|
||||
GradientStop { id: gradient1; position: 0.0 }
|
||||
GradientStop { id: gradient2; position: 1.0 }
|
||||
}
|
||||
|
||||
}
|
||||
Text {
|
||||
anchors { right: highlight.right; rightMargin: 6; verticalCenter: parent.verticalCenter }
|
||||
color: "white"
|
||||
font.bold: true
|
||||
text: Math.floor((value - minimum) / (maximum - minimum) * 100) + '%'
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 299 B |
|
|
@ -1,36 +0,0 @@
|
|||
// Copyright (C) 2017 The Qt Company Ltd.
|
||||
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
|
||||
|
||||
import QtQuick
|
||||
import "content"
|
||||
|
||||
Rectangle {
|
||||
id: main
|
||||
|
||||
width: 600; height: 405
|
||||
color: "#edecec"
|
||||
|
||||
Flickable {
|
||||
anchors.fill: parent
|
||||
contentHeight: column.height + 20
|
||||
|
||||
Column {
|
||||
id: column
|
||||
x: 10; y: 10
|
||||
spacing: 10
|
||||
|
||||
Repeater {
|
||||
model: 25
|
||||
|
||||
ProgressBar {
|
||||
property int r: Math.floor(Math.random() * 5000 + 1000)
|
||||
width: main.width - 20
|
||||
|
||||
NumberAnimation on value { duration: r; from: 0; to: 100; loops: Animation.Infinite }
|
||||
ColorAnimation on color { duration: r; from: "lightsteelblue"; to: "thistle"; loops: Animation.Infinite }
|
||||
ColorAnimation on secondColor { duration: r; from: "steelblue"; to: "#CD96CD"; loops: Animation.Infinite }
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,37 +0,0 @@
|
|||
// Copyright (C) 2017 The Qt Company Ltd.
|
||||
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
|
||||
|
||||
import QtQuick
|
||||
|
||||
Item {
|
||||
id: scrollBar
|
||||
|
||||
// The properties that define the scrollbar's state.
|
||||
// position and pageSize are in the range 0.0 - 1.0. They are relative to the
|
||||
// height of the page, i.e. a pageSize of 0.5 means that you can see 50%
|
||||
// of the height of the view.
|
||||
// orientation can be either Qt.Vertical or Qt.Horizontal
|
||||
property real position
|
||||
property real pageSize
|
||||
property int orientation : Qt.Vertical
|
||||
|
||||
// A light, semi-transparent background
|
||||
Rectangle {
|
||||
id: background
|
||||
anchors.fill: parent
|
||||
radius: orientation === Qt.Vertical ? (width/2 - 1) : (height/2 - 1)
|
||||
color: "white"
|
||||
opacity: 0.3
|
||||
}
|
||||
|
||||
// Size the bar to the required size, depending upon the orientation.
|
||||
Rectangle {
|
||||
x: orientation === Qt.Vertical ? 1 : (scrollBar.position * (scrollBar.width-2) + 1)
|
||||
y: orientation === Qt.Vertical ? (scrollBar.position * (scrollBar.height-2) + 1) : 1
|
||||
width: orientation === Qt.Vertical ? (parent.width-2) : (scrollBar.pageSize * (scrollBar.width-2))
|
||||
height: orientation === Qt.Vertical ? (scrollBar.pageSize * (scrollBar.height-2)) : (parent.height-2)
|
||||
radius: orientation === Qt.Vertical ? (width/2 - 1) : (height/2 - 1)
|
||||
color: "black"
|
||||
opacity: 0.7
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 154 KiB |
|
|
@ -1,14 +0,0 @@
|
|||
// Copyright (C) 2017 The Qt Company Ltd.
|
||||
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GFDL-1.3-no-invariants-only
|
||||
/*!
|
||||
\title UI Components: Scroll Bar Example
|
||||
\example customitems/scrollbar
|
||||
\brief The Scroll Bar Example shows how to use scroll bars on a flickable element.
|
||||
|
||||
This example shows how to create scroll bars for a \l Flickable element
|
||||
using the \l {Flickable::visibleArea.xPosition}{Flickable::visibleArea}
|
||||
properties.
|
||||
|
||||
\image qml-scrollbar-example.png
|
||||
*/
|
||||
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
// Copyright (C) 2020 The Qt Company Ltd.
|
||||
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
|
||||
#include "../../shared/shared.h"
|
||||
DECLARATIVE_EXAMPLE_MAIN(main)
|
||||
|
|
@ -1,58 +0,0 @@
|
|||
// Copyright (C) 2017 The Qt Company Ltd.
|
||||
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
|
||||
|
||||
import QtQuick
|
||||
|
||||
Rectangle {
|
||||
width: 640
|
||||
height: 480
|
||||
|
||||
// Create a flickable to view a large image.
|
||||
Flickable {
|
||||
id: view
|
||||
anchors.fill: parent
|
||||
contentWidth: picture.width
|
||||
contentHeight: picture.height
|
||||
|
||||
Image {
|
||||
id: picture
|
||||
source: "pics/niagara_falls.jpg"
|
||||
asynchronous: true
|
||||
}
|
||||
|
||||
// Only show the scrollbars when the view is moving.
|
||||
states: State {
|
||||
name: "ShowBars"
|
||||
when: view.movingVertically || view.movingHorizontally
|
||||
PropertyChanges {
|
||||
verticalScrollBar.opacity: 1
|
||||
horizontalScrollBar.opacity: 1
|
||||
}
|
||||
}
|
||||
|
||||
transitions: Transition {
|
||||
NumberAnimation { properties: "opacity"; duration: 400 }
|
||||
}
|
||||
}
|
||||
|
||||
// Attach scrollbars to the right and bottom edges of the view.
|
||||
ScrollBar {
|
||||
id: verticalScrollBar
|
||||
width: 12; height: view.height-12
|
||||
anchors.right: view.right
|
||||
opacity: 0
|
||||
orientation: Qt.Vertical
|
||||
position: view.visibleArea.yPosition
|
||||
pageSize: view.visibleArea.heightRatio
|
||||
}
|
||||
|
||||
ScrollBar {
|
||||
id: horizontalScrollBar
|
||||
width: view.width-12; height: 12
|
||||
anchors.bottom: view.bottom
|
||||
opacity: 0
|
||||
orientation: Qt.Horizontal
|
||||
position: view.visibleArea.xPosition
|
||||
pageSize: view.visibleArea.widthRatio
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 139 KiB |
|
|
@ -1,9 +0,0 @@
|
|||
TEMPLATE = app
|
||||
|
||||
QT += quick qml
|
||||
SOURCES += main.cpp
|
||||
|
||||
RESOURCES += scrollbar.qrc
|
||||
|
||||
target.path = $$[QT_INSTALL_EXAMPLES]/quick/customitems/scrollbar
|
||||
INSTALLS += target
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
import QmlProject 1.1
|
||||
|
||||
Project {
|
||||
mainFile: "main.qml"
|
||||
|
||||
/* Include .qml, .js, and image files from current directory and subdirectories */
|
||||
QmlFiles {
|
||||
directory: "."
|
||||
}
|
||||
JavaScriptFiles {
|
||||
directory: "."
|
||||
}
|
||||
ImageFiles {
|
||||
directory: "."
|
||||
}
|
||||
}
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
<RCC>
|
||||
<qresource prefix="/">
|
||||
<file>main.qml</file>
|
||||
<file>ScrollBar.qml</file>
|
||||
<file>pics/niagara_falls.jpg</file>
|
||||
</qresource>
|
||||
</RCC>
|
||||
|
|
@ -1,74 +0,0 @@
|
|||
// Copyright (C) 2017 The Qt Company Ltd.
|
||||
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
|
||||
|
||||
import QtQuick
|
||||
|
||||
FocusScope {
|
||||
id: focusScope
|
||||
width: 250; height: 28
|
||||
|
||||
BorderImage {
|
||||
source: "images/lineedit-bg.png"
|
||||
width: parent.width; height: parent.height
|
||||
border { left: 4; top: 4; right: 4; bottom: 4 }
|
||||
}
|
||||
|
||||
BorderImage {
|
||||
source: "images/lineedit-bg-focus.png"
|
||||
width: parent.width; height: parent.height
|
||||
border { left: 4; top: 4; right: 4; bottom: 4 }
|
||||
visible: parent.activeFocus ? true : false
|
||||
}
|
||||
|
||||
Text {
|
||||
id: typeSomething
|
||||
anchors.fill: parent; anchors.leftMargin: 8
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
text: "Type something..."
|
||||
color: "gray"
|
||||
font.italic: true
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
onClicked: { focusScope.focus = true; Qt.inputMethod.show(); }
|
||||
}
|
||||
|
||||
TextInput {
|
||||
id: textInput
|
||||
anchors { left: parent.left; leftMargin: 8; right: clear.left; rightMargin: 8; verticalCenter: parent.verticalCenter }
|
||||
focus: true
|
||||
selectByMouse: true
|
||||
}
|
||||
|
||||
Image {
|
||||
id: clear
|
||||
anchors { right: parent.right; rightMargin: 8; verticalCenter: parent.verticalCenter }
|
||||
source: "images/clear.png"
|
||||
opacity: 0
|
||||
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
onClicked: { textInput.text = ''; focusScope.focus = true; textInput.openSoftwareInputPanel(); }
|
||||
}
|
||||
}
|
||||
|
||||
states: State {
|
||||
name: "hasText"; when: textInput.text != ''
|
||||
PropertyChanges {
|
||||
typeSomething.opacity: 0
|
||||
clear.opacity: 1
|
||||
}
|
||||
}
|
||||
|
||||
transitions: [
|
||||
Transition {
|
||||
from: ""; to: "hasText"
|
||||
NumberAnimation { exclude: typeSomething; properties: "opacity" }
|
||||
},
|
||||
Transition {
|
||||
from: "hasText"; to: ""
|
||||
NumberAnimation { properties: "opacity" }
|
||||
}
|
||||
]
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 320 B |
Binary file not shown.
|
Before Width: | Height: | Size: 297 B |
Binary file not shown.
|
Before Width: | Height: | Size: 299 B |
|
|
@ -1,4 +0,0 @@
|
|||
// Copyright (C) 2020 The Qt Company Ltd.
|
||||
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
|
||||
#include "../../shared/shared.h"
|
||||
DECLARATIVE_EXAMPLE_MAIN(main)
|
||||
|
|
@ -1,23 +0,0 @@
|
|||
// Copyright (C) 2017 The Qt Company Ltd.
|
||||
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
|
||||
|
||||
import QtQuick
|
||||
|
||||
Rectangle {
|
||||
id: page
|
||||
width: 500; height: 250
|
||||
color: "#edecec"
|
||||
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
onClicked: page.focus = false;
|
||||
}
|
||||
Column {
|
||||
anchors { horizontalCenter: parent.horizontalCenter; verticalCenter: parent.verticalCenter }
|
||||
spacing: 10
|
||||
|
||||
SearchBox { id: search1; KeyNavigation.tab: search2; KeyNavigation.backtab: search3; focus: true }
|
||||
SearchBox { id: search2; KeyNavigation.tab: search3; KeyNavigation.backtab: search1 }
|
||||
SearchBox { id: search3; KeyNavigation.tab: search1; KeyNavigation.backtab: search2 }
|
||||
}
|
||||
}
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
TEMPLATE = app
|
||||
|
||||
QT += quick qml
|
||||
SOURCES += main.cpp
|
||||
|
||||
RESOURCES += searchbox.qrc
|
||||
|
||||
target.path = $$[QT_INSTALL_EXAMPLES]/quick/customitems/searchbox
|
||||
INSTALLS += target
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
import QmlProject 1.1
|
||||
|
||||
Project {
|
||||
mainFile: "main.qml"
|
||||
|
||||
/* Include .qml, .js, and image files from current directory and subdirectories */
|
||||
QmlFiles {
|
||||
directory: "."
|
||||
}
|
||||
JavaScriptFiles {
|
||||
directory: "."
|
||||
}
|
||||
ImageFiles {
|
||||
directory: "."
|
||||
}
|
||||
}
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
<RCC>
|
||||
<qresource prefix="/">
|
||||
<file>main.qml</file>
|
||||
<file>SearchBox.qml</file>
|
||||
<file>images/clear.png</file>
|
||||
<file>images/lineedit-bg-focus.png</file>
|
||||
<file>images/lineedit-bg.png</file>
|
||||
</qresource>
|
||||
</RCC>
|
||||
|
|
@ -1,84 +0,0 @@
|
|||
// Copyright (C) 2017 The Qt Company Ltd.
|
||||
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
|
||||
|
||||
//![0]
|
||||
import QtQuick
|
||||
|
||||
Item {
|
||||
id: toggleswitch
|
||||
width: background.width; height: background.height
|
||||
|
||||
//![1]
|
||||
property bool on: false
|
||||
//![1]
|
||||
|
||||
//![2]
|
||||
function toggle() {
|
||||
if (toggleswitch.state == "on")
|
||||
toggleswitch.state = "off";
|
||||
else
|
||||
toggleswitch.state = "on";
|
||||
}
|
||||
//![2]
|
||||
|
||||
//![3]
|
||||
function releaseSwitch() {
|
||||
if (knob.x == 1) {
|
||||
if (toggleswitch.state == "off") return;
|
||||
}
|
||||
if (knob.x == 78) {
|
||||
if (toggleswitch.state == "on") return;
|
||||
}
|
||||
toggle();
|
||||
}
|
||||
//![3]
|
||||
|
||||
//![4]
|
||||
Image {
|
||||
id: background
|
||||
source: "background.png"
|
||||
MouseArea { anchors.fill: parent; onClicked: toggle() }
|
||||
}
|
||||
//![4]
|
||||
|
||||
//![5]
|
||||
Image {
|
||||
id: knob
|
||||
x: 1; y: 2
|
||||
source: "knob.png"
|
||||
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
drag.target: knob; drag.axis: Drag.XAxis; drag.minimumX: 1; drag.maximumX: 78
|
||||
onClicked: toggle()
|
||||
onReleased: releaseSwitch()
|
||||
}
|
||||
}
|
||||
//![5]
|
||||
|
||||
//![6]
|
||||
states: [
|
||||
State {
|
||||
name: "on"
|
||||
PropertyChanges {
|
||||
knob.x: 78
|
||||
toggleswitch.on: true
|
||||
}
|
||||
},
|
||||
State {
|
||||
name: "off"
|
||||
PropertyChanges {
|
||||
knob.x: 1
|
||||
toggleswitch.on: false
|
||||
}
|
||||
}
|
||||
]
|
||||
//![6]
|
||||
|
||||
//![7]
|
||||
transitions: Transition {
|
||||
NumberAnimation { properties: "x"; easing.type: Easing.InOutQuad; duration: 200 }
|
||||
}
|
||||
//![7]
|
||||
}
|
||||
//![0]
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 3.0 KiB |
|
|
@ -1,23 +0,0 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 13.0.2, SVG Export Plug-In -->
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" [
|
||||
<!ENTITY ns_flows "http://ns.adobe.com/Flows/1.0/">
|
||||
]>
|
||||
<svg version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:a="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/"
|
||||
x="0px" y="0px" width="130px" height="56px" viewBox="0 0 130 56" enable-background="new 0 0 130 56" xml:space="preserve">
|
||||
<defs>
|
||||
</defs>
|
||||
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="-37.5005" y1="-66" x2="-37.5005" y2="-121.9985" gradientTransform="matrix(1 0 0 -1 102.5 -66)">
|
||||
<stop offset="0.0056" style="stop-color:#000000"/>
|
||||
<stop offset="1" style="stop-color:#EAECEF"/>
|
||||
</linearGradient>
|
||||
<path fill="url(#SVGID_1_)" d="M101.998,55.998H28c-15.439,0-28-12.562-28-28C0,12.56,12.561,0,28,0h73.998
|
||||
c15.439,0,28,12.559,28,27.998C129.998,43.438,117.438,55.998,101.998,55.998L101.998,55.998z"/>
|
||||
<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="-5.5" y1="-132.1338" x2="-69.5002" y2="-55.8613" gradientTransform="matrix(1 0 0 -1 102.5 -66)">
|
||||
<stop offset="0.0056" style="stop-color:#000000"/>
|
||||
<stop offset="1" style="stop-color:#828385"/>
|
||||
</linearGradient>
|
||||
<path fill="url(#SVGID_2_)" d="M127.999,27.998c0,14.359-11.642,26-26,26h-74c-14.359,0-26-11.641-26-26l0,0
|
||||
c0-14.359,11.641-26,26-26h74C116.357,1.998,127.999,13.639,127.999,27.998L127.999,27.998z"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.0 KiB |
|
|
@ -1,867 +0,0 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Generator: Adobe Illustrator 13.0.2, SVG Export Plug-In -->
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://web.resource.org/cc/"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
x="0px"
|
||||
y="0px"
|
||||
width="52px"
|
||||
height="52px"
|
||||
viewBox="0 0 52 52"
|
||||
enable-background="new 0 0 52 52"
|
||||
xml:space="preserve"
|
||||
id="svg3883"
|
||||
sodipodi:version="0.32"
|
||||
inkscape:version="0.44.1"
|
||||
sodipodi:docname="knob_on.svg"
|
||||
sodipodi:docbase="/local/axel/embeddedwidgets/embeddedstories/skins/svgslideswitch/MetallicBrush"><metadata
|
||||
id="metadata4200"><rdf:RDF><cc:Work
|
||||
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><sodipodi:namedview
|
||||
inkscape:window-height="640"
|
||||
inkscape:window-width="937"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:pageopacity="0.0"
|
||||
guidetolerance="10.0"
|
||||
gridtolerance="10.0"
|
||||
objecttolerance="10.0"
|
||||
borderopacity="1.0"
|
||||
bordercolor="#666666"
|
||||
pagecolor="#ffffff"
|
||||
id="base"
|
||||
inkscape:zoom="8.3653846"
|
||||
inkscape:cx="26.000002"
|
||||
inkscape:cy="26"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:current-layer="svg3883" />
|
||||
<defs
|
||||
id="defs3885">
|
||||
</defs>
|
||||
<linearGradient
|
||||
id="SVGID_1_"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="-59.7866"
|
||||
y1="-115.917"
|
||||
x2="-93.2123"
|
||||
y2="-76.0818"
|
||||
gradientTransform="matrix(1,0,0,-1,102.5,-70)">
|
||||
<stop
|
||||
offset="0.0056"
|
||||
style="stop-color:#000000"
|
||||
id="stop3888" />
|
||||
<stop
|
||||
offset="1"
|
||||
style="stop-color:#EAECEF"
|
||||
id="stop3890" />
|
||||
</linearGradient>
|
||||
<circle
|
||||
cx="26"
|
||||
cy="26"
|
||||
r="26"
|
||||
id="circle3892"
|
||||
style="fill:url(#SVGID_1_)"
|
||||
sodipodi:cx="26"
|
||||
sodipodi:cy="26"
|
||||
sodipodi:rx="26"
|
||||
sodipodi:ry="26"
|
||||
transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
|
||||
<linearGradient
|
||||
id="SVGID_2_"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="-100.5"
|
||||
y1="-96"
|
||||
x2="-52.5"
|
||||
y2="-96"
|
||||
gradientTransform="matrix(1,0,0,-1,102.5,-70)">
|
||||
<stop
|
||||
offset="0.0056"
|
||||
style="stop-color:#8AADCE"
|
||||
id="stop3895" />
|
||||
<stop
|
||||
offset="0.5"
|
||||
style="stop-color:#EAECEF"
|
||||
id="stop3897" />
|
||||
<stop
|
||||
offset="0.6043"
|
||||
style="stop-color:#E7EAED"
|
||||
id="stop3899" />
|
||||
<stop
|
||||
offset="0.6751"
|
||||
style="stop-color:#DEE4E7"
|
||||
id="stop3901" />
|
||||
<stop
|
||||
offset="0.7358"
|
||||
style="stop-color:#CFD9DD"
|
||||
id="stop3903" />
|
||||
<stop
|
||||
offset="0.791"
|
||||
style="stop-color:#B9CACF"
|
||||
id="stop3905" />
|
||||
<stop
|
||||
offset="0.8425"
|
||||
style="stop-color:#9EB6BD"
|
||||
id="stop3907" />
|
||||
<stop
|
||||
offset="0.891"
|
||||
style="stop-color:#7B9EA7"
|
||||
id="stop3909" />
|
||||
<stop
|
||||
offset="0.9374"
|
||||
style="stop-color:#53828C"
|
||||
id="stop3911" />
|
||||
<stop
|
||||
offset="0.9809"
|
||||
style="stop-color:#25626E"
|
||||
id="stop3913" />
|
||||
<stop
|
||||
offset="1"
|
||||
style="stop-color:#0E525F"
|
||||
id="stop3915" />
|
||||
</linearGradient>
|
||||
<circle
|
||||
cx="26"
|
||||
cy="26"
|
||||
r="24"
|
||||
id="circle3917"
|
||||
style="fill:url(#SVGID_2_)"
|
||||
sodipodi:cx="26"
|
||||
sodipodi:cy="26"
|
||||
sodipodi:rx="24"
|
||||
sodipodi:ry="24"
|
||||
transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
|
||||
<linearGradient
|
||||
id="SVGID_3_"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="-98.6328"
|
||||
y1="-96"
|
||||
x2="-54.3672"
|
||||
y2="-96"
|
||||
gradientTransform="matrix(1,0,0,-1,102.5,-70)">
|
||||
<stop
|
||||
offset="0.0056"
|
||||
style="stop-color:#8AADCE"
|
||||
id="stop3920" />
|
||||
<stop
|
||||
offset="0.073"
|
||||
style="stop-color:#8FAECB"
|
||||
id="stop3922" />
|
||||
<stop
|
||||
offset="0.5"
|
||||
style="stop-color:#EAECEF"
|
||||
id="stop3924" />
|
||||
<stop
|
||||
offset="0.5902"
|
||||
style="stop-color:#E7E9ED"
|
||||
id="stop3926" />
|
||||
<stop
|
||||
offset="0.618"
|
||||
style="stop-color:#E4E7EB"
|
||||
id="stop3928" />
|
||||
<stop
|
||||
offset="0.6697"
|
||||
style="stop-color:#E0E4E9"
|
||||
id="stop3930" />
|
||||
<stop
|
||||
offset="0.7211"
|
||||
style="stop-color:#D4DCE1"
|
||||
id="stop3932" />
|
||||
<stop
|
||||
offset="0.7722"
|
||||
style="stop-color:#C0CFD5"
|
||||
id="stop3934" />
|
||||
<stop
|
||||
offset="0.809"
|
||||
style="stop-color:#ADC2C9"
|
||||
id="stop3936" />
|
||||
<stop
|
||||
offset="1"
|
||||
style="stop-color:#0E525F"
|
||||
id="stop3938" />
|
||||
</linearGradient>
|
||||
<circle
|
||||
cx="26"
|
||||
cy="26"
|
||||
r="22.132999"
|
||||
id="circle3940"
|
||||
style="fill:url(#SVGID_3_)"
|
||||
sodipodi:cx="26"
|
||||
sodipodi:cy="26"
|
||||
sodipodi:rx="22.132999"
|
||||
sodipodi:ry="22.132999"
|
||||
transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
|
||||
<linearGradient
|
||||
id="SVGID_4_"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="-96.7671"
|
||||
y1="-96"
|
||||
x2="-56.2324"
|
||||
y2="-96"
|
||||
gradientTransform="matrix(1,0,0,-1,102.5,-70)">
|
||||
<stop
|
||||
offset="0.0056"
|
||||
style="stop-color:#8AADCE"
|
||||
id="stop3943" />
|
||||
<stop
|
||||
offset="0.073"
|
||||
style="stop-color:#86A7C4"
|
||||
id="stop3945" />
|
||||
<stop
|
||||
offset="0.5"
|
||||
style="stop-color:#EAECEF"
|
||||
id="stop3947" />
|
||||
<stop
|
||||
offset="0.577"
|
||||
style="stop-color:#E7EAED"
|
||||
id="stop3949" />
|
||||
<stop
|
||||
offset="0.618"
|
||||
style="stop-color:#E1E6EA"
|
||||
id="stop3951" />
|
||||
<stop
|
||||
offset="0.6697"
|
||||
style="stop-color:#DDE3E8"
|
||||
id="stop3953" />
|
||||
<stop
|
||||
offset="0.7211"
|
||||
style="stop-color:#D1DBE1"
|
||||
id="stop3955" />
|
||||
<stop
|
||||
offset="0.7722"
|
||||
style="stop-color:#BDCDD5"
|
||||
id="stop3957" />
|
||||
<stop
|
||||
offset="0.809"
|
||||
style="stop-color:#AAC0CA"
|
||||
id="stop3959" />
|
||||
<stop
|
||||
offset="1"
|
||||
style="stop-color:#0E525F"
|
||||
id="stop3961" />
|
||||
</linearGradient>
|
||||
<circle
|
||||
cx="26"
|
||||
cy="26"
|
||||
r="20.267"
|
||||
id="circle3963"
|
||||
style="fill:url(#SVGID_4_)"
|
||||
sodipodi:cx="26"
|
||||
sodipodi:cy="26"
|
||||
sodipodi:rx="20.267"
|
||||
sodipodi:ry="20.267"
|
||||
transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
|
||||
<linearGradient
|
||||
id="SVGID_5_"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="-94.8999"
|
||||
y1="-96"
|
||||
x2="-58.0996"
|
||||
y2="-96"
|
||||
gradientTransform="matrix(1,0,0,-1,102.5,-70)">
|
||||
<stop
|
||||
offset="0.0056"
|
||||
style="stop-color:#8AADCE"
|
||||
id="stop3966" />
|
||||
<stop
|
||||
offset="0.073"
|
||||
style="stop-color:#7E9FBC"
|
||||
id="stop3968" />
|
||||
<stop
|
||||
offset="0.5"
|
||||
style="stop-color:#EAECEF"
|
||||
id="stop3970" />
|
||||
<stop
|
||||
offset="0.5709"
|
||||
style="stop-color:#E6E9ED"
|
||||
id="stop3972" />
|
||||
<stop
|
||||
offset="0.618"
|
||||
style="stop-color:#DFE4E9"
|
||||
id="stop3974" />
|
||||
<stop
|
||||
offset="0.6687"
|
||||
style="stop-color:#DBE1E7"
|
||||
id="stop3976" />
|
||||
<stop
|
||||
offset="0.7193"
|
||||
style="stop-color:#CFD9E0"
|
||||
id="stop3978" />
|
||||
<stop
|
||||
offset="0.7695"
|
||||
style="stop-color:#BBCCD6"
|
||||
id="stop3980" />
|
||||
<stop
|
||||
offset="0.809"
|
||||
style="stop-color:#A6BECA"
|
||||
id="stop3982" />
|
||||
<stop
|
||||
offset="1"
|
||||
style="stop-color:#0E525F"
|
||||
id="stop3984" />
|
||||
</linearGradient>
|
||||
<circle
|
||||
cx="26"
|
||||
cy="26"
|
||||
r="18.4"
|
||||
id="circle3986"
|
||||
style="fill:url(#SVGID_5_)"
|
||||
sodipodi:cx="26"
|
||||
sodipodi:cy="26"
|
||||
sodipodi:rx="18.4"
|
||||
sodipodi:ry="18.4"
|
||||
transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
|
||||
<linearGradient
|
||||
id="SVGID_6_"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="-93.0332"
|
||||
y1="-96"
|
||||
x2="-59.9668"
|
||||
y2="-96"
|
||||
gradientTransform="matrix(1,0,0,-1,102.5,-70)">
|
||||
<stop
|
||||
offset="0.0056"
|
||||
style="stop-color:#8AADCE"
|
||||
id="stop3989" />
|
||||
<stop
|
||||
offset="0.073"
|
||||
style="stop-color:#7697B4"
|
||||
id="stop3991" />
|
||||
<stop
|
||||
offset="0.5"
|
||||
style="stop-color:#EAECEF"
|
||||
id="stop3993" />
|
||||
<stop
|
||||
offset="0.5636"
|
||||
style="stop-color:#E6E9ED"
|
||||
id="stop3995" />
|
||||
<stop
|
||||
offset="0.618"
|
||||
style="stop-color:#DCE2E8"
|
||||
id="stop3997" />
|
||||
<stop
|
||||
offset="0.6687"
|
||||
style="stop-color:#D8DFE6"
|
||||
id="stop3999" />
|
||||
<stop
|
||||
offset="0.7193"
|
||||
style="stop-color:#CCD7E0"
|
||||
id="stop4001" />
|
||||
<stop
|
||||
offset="0.7695"
|
||||
style="stop-color:#B8CAD5"
|
||||
id="stop4003" />
|
||||
<stop
|
||||
offset="0.809"
|
||||
style="stop-color:#A3BCCA"
|
||||
id="stop4005" />
|
||||
<stop
|
||||
offset="1"
|
||||
style="stop-color:#0E525F"
|
||||
id="stop4007" />
|
||||
</linearGradient>
|
||||
<circle
|
||||
cx="26"
|
||||
cy="26"
|
||||
r="16.533001"
|
||||
id="circle4009"
|
||||
style="fill:url(#SVGID_6_)"
|
||||
sodipodi:cx="26"
|
||||
sodipodi:cy="26"
|
||||
sodipodi:rx="16.533001"
|
||||
sodipodi:ry="16.533001"
|
||||
transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
|
||||
<linearGradient
|
||||
id="SVGID_7_"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="-91.167"
|
||||
y1="-96"
|
||||
x2="-61.833"
|
||||
y2="-96"
|
||||
gradientTransform="matrix(1,0,0,-1,102.5,-70)">
|
||||
<stop
|
||||
offset="0.0056"
|
||||
style="stop-color:#8AADCE"
|
||||
id="stop4012" />
|
||||
<stop
|
||||
offset="0.073"
|
||||
style="stop-color:#6D8FAD"
|
||||
id="stop4014" />
|
||||
<stop
|
||||
offset="0.5"
|
||||
style="stop-color:#EAECEF"
|
||||
id="stop4016" />
|
||||
<stop
|
||||
offset="0.5605"
|
||||
style="stop-color:#E5E8EC"
|
||||
id="stop4018" />
|
||||
<stop
|
||||
offset="0.618"
|
||||
style="stop-color:#DAE1E7"
|
||||
id="stop4020" />
|
||||
<stop
|
||||
offset="0.6679"
|
||||
style="stop-color:#D6DEE5"
|
||||
id="stop4022" />
|
||||
<stop
|
||||
offset="0.7175"
|
||||
style="stop-color:#CAD6DF"
|
||||
id="stop4024" />
|
||||
<stop
|
||||
offset="0.7669"
|
||||
style="stop-color:#B6C9D6"
|
||||
id="stop4026" />
|
||||
<stop
|
||||
offset="0.809"
|
||||
style="stop-color:#9FBACB"
|
||||
id="stop4028" />
|
||||
<stop
|
||||
offset="1"
|
||||
style="stop-color:#0E525F"
|
||||
id="stop4030" />
|
||||
</linearGradient>
|
||||
<circle
|
||||
cx="26"
|
||||
cy="26"
|
||||
r="14.667"
|
||||
id="circle4032"
|
||||
style="fill:url(#SVGID_7_)"
|
||||
sodipodi:cx="26"
|
||||
sodipodi:cy="26"
|
||||
sodipodi:rx="14.667"
|
||||
sodipodi:ry="14.667"
|
||||
transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
|
||||
<linearGradient
|
||||
id="SVGID_8_"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="-89.2998"
|
||||
y1="-96"
|
||||
x2="-63.7002"
|
||||
y2="-96"
|
||||
gradientTransform="matrix(1,0,0,-1,102.5,-70)">
|
||||
<stop
|
||||
offset="0.0056"
|
||||
style="stop-color:#8AADCE"
|
||||
id="stop4035" />
|
||||
<stop
|
||||
offset="0.073"
|
||||
style="stop-color:#6587A5"
|
||||
id="stop4037" />
|
||||
<stop
|
||||
offset="0.5"
|
||||
style="stop-color:#EAECEF"
|
||||
id="stop4039" />
|
||||
<stop
|
||||
offset="0.5588"
|
||||
style="stop-color:#E4E8EC"
|
||||
id="stop4041" />
|
||||
<stop
|
||||
offset="0.618"
|
||||
style="stop-color:#D8DFE7"
|
||||
id="stop4043" />
|
||||
<stop
|
||||
offset="0.6675"
|
||||
style="stop-color:#D4DCE5"
|
||||
id="stop4045" />
|
||||
<stop
|
||||
offset="0.7167"
|
||||
style="stop-color:#C8D5E0"
|
||||
id="stop4047" />
|
||||
<stop
|
||||
offset="0.7657"
|
||||
style="stop-color:#B4C8D6"
|
||||
id="stop4049" />
|
||||
<stop
|
||||
offset="0.809"
|
||||
style="stop-color:#9CB8CB"
|
||||
id="stop4051" />
|
||||
<stop
|
||||
offset="1"
|
||||
style="stop-color:#0E525F"
|
||||
id="stop4053" />
|
||||
</linearGradient>
|
||||
<circle
|
||||
cx="26"
|
||||
cy="26"
|
||||
r="12.8"
|
||||
id="circle4055"
|
||||
style="fill:url(#SVGID_8_)"
|
||||
sodipodi:cx="26"
|
||||
sodipodi:cy="26"
|
||||
sodipodi:rx="12.8"
|
||||
sodipodi:ry="12.8"
|
||||
transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
|
||||
<linearGradient
|
||||
id="SVGID_9_"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="-87.4331"
|
||||
y1="-96"
|
||||
x2="-65.5664"
|
||||
y2="-96"
|
||||
gradientTransform="matrix(1,0,0,-1,102.5,-70)">
|
||||
<stop
|
||||
offset="0.0056"
|
||||
style="stop-color:#8AADCE"
|
||||
id="stop4058" />
|
||||
<stop
|
||||
offset="0.073"
|
||||
style="stop-color:#5D809D"
|
||||
id="stop4060" />
|
||||
<stop
|
||||
offset="0.5"
|
||||
style="stop-color:#EAECEF"
|
||||
id="stop4062" />
|
||||
<stop
|
||||
offset="0.5567"
|
||||
style="stop-color:#E3E7EC"
|
||||
id="stop4064" />
|
||||
<stop
|
||||
offset="0.618"
|
||||
style="stop-color:#D5DDE6"
|
||||
id="stop4066" />
|
||||
<stop
|
||||
offset="0.6671"
|
||||
style="stop-color:#D1DAE4"
|
||||
id="stop4068" />
|
||||
<stop
|
||||
offset="0.7159"
|
||||
style="stop-color:#C5D3DF"
|
||||
id="stop4070" />
|
||||
<stop
|
||||
offset="0.7645"
|
||||
style="stop-color:#B1C6D6"
|
||||
id="stop4072" />
|
||||
<stop
|
||||
offset="0.809"
|
||||
style="stop-color:#98B5CB"
|
||||
id="stop4074" />
|
||||
<stop
|
||||
offset="1"
|
||||
style="stop-color:#0E525F"
|
||||
id="stop4076" />
|
||||
</linearGradient>
|
||||
<circle
|
||||
cx="26"
|
||||
cy="26"
|
||||
r="10.933"
|
||||
id="circle4078"
|
||||
style="fill:url(#SVGID_9_)"
|
||||
sodipodi:cx="26"
|
||||
sodipodi:cy="26"
|
||||
sodipodi:rx="10.933"
|
||||
sodipodi:ry="10.933"
|
||||
transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
|
||||
<linearGradient
|
||||
id="SVGID_10_"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="-85.5659"
|
||||
y1="-96"
|
||||
x2="-67.4336"
|
||||
y2="-96"
|
||||
gradientTransform="matrix(1,0,0,-1,102.5,-70)">
|
||||
<stop
|
||||
offset="0.0056"
|
||||
style="stop-color:#8AADCE"
|
||||
id="stop4081" />
|
||||
<stop
|
||||
offset="0.073"
|
||||
style="stop-color:#547896"
|
||||
id="stop4083" />
|
||||
<stop
|
||||
offset="0.5"
|
||||
style="stop-color:#EAECEF"
|
||||
id="stop4085" />
|
||||
<stop
|
||||
offset="0.5588"
|
||||
style="stop-color:#E1E6EB"
|
||||
id="stop4087" />
|
||||
<stop
|
||||
offset="0.618"
|
||||
style="stop-color:#D3DCE5"
|
||||
id="stop4089" />
|
||||
<stop
|
||||
offset="0.6663"
|
||||
style="stop-color:#CFD9E3"
|
||||
id="stop4091" />
|
||||
<stop
|
||||
offset="0.7143"
|
||||
style="stop-color:#C3D2DF"
|
||||
id="stop4093" />
|
||||
<stop
|
||||
offset="0.7621"
|
||||
style="stop-color:#AFC5D7"
|
||||
id="stop4095" />
|
||||
<stop
|
||||
offset="0.809"
|
||||
style="stop-color:#94B3CC"
|
||||
id="stop4097" />
|
||||
<stop
|
||||
offset="1"
|
||||
style="stop-color:#0E525F"
|
||||
id="stop4099" />
|
||||
</linearGradient>
|
||||
<circle
|
||||
cx="26"
|
||||
cy="26"
|
||||
r="9.066"
|
||||
id="circle4101"
|
||||
style="fill:url(#SVGID_10_)"
|
||||
sodipodi:cx="26"
|
||||
sodipodi:cy="26"
|
||||
sodipodi:rx="9.066"
|
||||
sodipodi:ry="9.066"
|
||||
transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
|
||||
<linearGradient
|
||||
id="SVGID_11_"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="-83.7002"
|
||||
y1="-96"
|
||||
x2="-69.2998"
|
||||
y2="-96"
|
||||
gradientTransform="matrix(1,0,0,-1,102.5,-70)">
|
||||
<stop
|
||||
offset="0.0056"
|
||||
style="stop-color:#8AADCE"
|
||||
id="stop4104" />
|
||||
<stop
|
||||
offset="0.073"
|
||||
style="stop-color:#4C708E"
|
||||
id="stop4106" />
|
||||
<stop
|
||||
offset="0.5"
|
||||
style="stop-color:#EAECEF"
|
||||
id="stop4108" />
|
||||
<stop
|
||||
offset="0.5625"
|
||||
style="stop-color:#DEE4EA"
|
||||
id="stop4110" />
|
||||
<stop
|
||||
offset="0.618"
|
||||
style="stop-color:#D0DAE4"
|
||||
id="stop4112" />
|
||||
<stop
|
||||
offset="0.6663"
|
||||
style="stop-color:#CCD7E2"
|
||||
id="stop4114" />
|
||||
<stop
|
||||
offset="0.7143"
|
||||
style="stop-color:#C0D0DE"
|
||||
id="stop4116" />
|
||||
<stop
|
||||
offset="0.7621"
|
||||
style="stop-color:#ACC3D6"
|
||||
id="stop4118" />
|
||||
<stop
|
||||
offset="0.809"
|
||||
style="stop-color:#91B1CC"
|
||||
id="stop4120" />
|
||||
<stop
|
||||
offset="1"
|
||||
style="stop-color:#0E525F"
|
||||
id="stop4122" />
|
||||
</linearGradient>
|
||||
<circle
|
||||
cx="26"
|
||||
cy="26"
|
||||
r="7.1999998"
|
||||
id="circle4124"
|
||||
style="fill:url(#SVGID_11_)"
|
||||
sodipodi:cx="26"
|
||||
sodipodi:cy="26"
|
||||
sodipodi:rx="7.1999998"
|
||||
sodipodi:ry="7.1999998"
|
||||
transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
|
||||
<linearGradient
|
||||
id="SVGID_12_"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="-81.833"
|
||||
y1="-96"
|
||||
x2="-71.167"
|
||||
y2="-96"
|
||||
gradientTransform="matrix(1,0,0,-1,102.5,-70)">
|
||||
<stop
|
||||
offset="0.0056"
|
||||
style="stop-color:#8AADCE"
|
||||
id="stop4127" />
|
||||
<stop
|
||||
offset="0.073"
|
||||
style="stop-color:#446986"
|
||||
id="stop4129" />
|
||||
<stop
|
||||
offset="0.5"
|
||||
style="stop-color:#EAECEF"
|
||||
id="stop4131" />
|
||||
<stop
|
||||
offset="0.5757"
|
||||
style="stop-color:#D9E0E8"
|
||||
id="stop4133" />
|
||||
<stop
|
||||
offset="0.618"
|
||||
style="stop-color:#CED8E3"
|
||||
id="stop4135" />
|
||||
<stop
|
||||
offset="0.6655"
|
||||
style="stop-color:#CAD5E2"
|
||||
id="stop4137" />
|
||||
<stop
|
||||
offset="0.7129"
|
||||
style="stop-color:#BECEDD"
|
||||
id="stop4139" />
|
||||
<stop
|
||||
offset="0.7601"
|
||||
style="stop-color:#AAC1D6"
|
||||
id="stop4141" />
|
||||
<stop
|
||||
offset="0.807"
|
||||
style="stop-color:#8EB0CC"
|
||||
id="stop4143" />
|
||||
<stop
|
||||
offset="0.809"
|
||||
style="stop-color:#8DAFCC"
|
||||
id="stop4145" />
|
||||
<stop
|
||||
offset="1"
|
||||
style="stop-color:#0E525F"
|
||||
id="stop4147" />
|
||||
</linearGradient>
|
||||
<circle
|
||||
cx="26"
|
||||
cy="26"
|
||||
r="5.3330002"
|
||||
id="circle4149"
|
||||
style="fill:url(#SVGID_12_)"
|
||||
sodipodi:cx="26"
|
||||
sodipodi:cy="26"
|
||||
sodipodi:rx="5.3330002"
|
||||
sodipodi:ry="5.3330002"
|
||||
transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
|
||||
<linearGradient
|
||||
id="SVGID_13_"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="-79.9658"
|
||||
y1="-96"
|
||||
x2="-73.0342"
|
||||
y2="-96"
|
||||
gradientTransform="matrix(1,0,0,-1,102.5,-70)">
|
||||
<stop
|
||||
offset="0.0056"
|
||||
style="stop-color:#8AADCE"
|
||||
id="stop4152" />
|
||||
<stop
|
||||
offset="0.073"
|
||||
style="stop-color:#3B617F"
|
||||
id="stop4154" />
|
||||
<stop
|
||||
offset="0.5"
|
||||
style="stop-color:#EAECEF"
|
||||
id="stop4156" />
|
||||
<stop
|
||||
offset="0.6087"
|
||||
style="stop-color:#CED9E3"
|
||||
id="stop4158" />
|
||||
<stop
|
||||
offset="0.618"
|
||||
style="stop-color:#CBD7E2"
|
||||
id="stop4160" />
|
||||
<stop
|
||||
offset="0.6655"
|
||||
style="stop-color:#C7D4E1"
|
||||
id="stop4162" />
|
||||
<stop
|
||||
offset="0.7129"
|
||||
style="stop-color:#BBCDDD"
|
||||
id="stop4164" />
|
||||
<stop
|
||||
offset="0.7601"
|
||||
style="stop-color:#A7C0D6"
|
||||
id="stop4166" />
|
||||
<stop
|
||||
offset="0.807"
|
||||
style="stop-color:#8BAECD"
|
||||
id="stop4168" />
|
||||
<stop
|
||||
offset="0.809"
|
||||
style="stop-color:#8AADCD"
|
||||
id="stop4170" />
|
||||
<stop
|
||||
offset="1"
|
||||
style="stop-color:#0E525F"
|
||||
id="stop4172" />
|
||||
</linearGradient>
|
||||
<circle
|
||||
cx="26"
|
||||
cy="26"
|
||||
r="3.4660001"
|
||||
id="circle4174"
|
||||
style="fill:url(#SVGID_13_)"
|
||||
sodipodi:cx="26"
|
||||
sodipodi:cy="26"
|
||||
sodipodi:rx="3.4660001"
|
||||
sodipodi:ry="3.4660001"
|
||||
transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
|
||||
<linearGradient
|
||||
id="SVGID_14_"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="-78.1001"
|
||||
y1="-96"
|
||||
x2="-74.9004"
|
||||
y2="-96"
|
||||
gradientTransform="matrix(1,0,0,-1,102.5,-70)">
|
||||
<stop
|
||||
offset="0.0056"
|
||||
style="stop-color:#8AADCE"
|
||||
id="stop4177" />
|
||||
<stop
|
||||
offset="0.073"
|
||||
style="stop-color:#335977"
|
||||
id="stop4179" />
|
||||
<stop
|
||||
offset="0.5"
|
||||
style="stop-color:#EAECEF"
|
||||
id="stop4181" />
|
||||
<stop
|
||||
offset="0.618"
|
||||
style="stop-color:#C9D5E1"
|
||||
id="stop4183" />
|
||||
<stop
|
||||
offset="0.6648"
|
||||
style="stop-color:#C5D3E0"
|
||||
id="stop4185" />
|
||||
<stop
|
||||
offset="0.7114"
|
||||
style="stop-color:#B9CBDC"
|
||||
id="stop4187" />
|
||||
<stop
|
||||
offset="0.758"
|
||||
style="stop-color:#A5BFD6"
|
||||
id="stop4189" />
|
||||
<stop
|
||||
offset="0.8042"
|
||||
style="stop-color:#89ADCE"
|
||||
id="stop4191" />
|
||||
<stop
|
||||
offset="0.809"
|
||||
style="stop-color:#86ABCD"
|
||||
id="stop4193" />
|
||||
<stop
|
||||
offset="1"
|
||||
style="stop-color:#0E525F"
|
||||
id="stop4195" />
|
||||
</linearGradient>
|
||||
<circle
|
||||
cx="26"
|
||||
cy="26"
|
||||
r="1.6"
|
||||
id="circle4197"
|
||||
style="fill:url(#SVGID_14_)"
|
||||
sodipodi:cx="26"
|
||||
sodipodi:cy="26"
|
||||
sodipodi:rx="1.6"
|
||||
sodipodi:ry="1.6"
|
||||
transform="matrix(0.923077,0,0,0.923077,2,1.999996)" />
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 17 KiB |
|
|
@ -1,108 +0,0 @@
|
|||
// Copyright (C) 2017 The Qt Company Ltd.
|
||||
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GFDL-1.3-no-invariants-only
|
||||
|
||||
|
||||
/*!
|
||||
\page qmlexampletoggleswitch.html
|
||||
\title Qt Quick Examples - Toggle Switch
|
||||
\brief A reusable switch component made in QML
|
||||
\ingroup qtquickexamples
|
||||
|
||||
This example shows how to create a reusable switch component in QML.
|
||||
|
||||
The code for this example can be found in the \c examples/quick/customitems/slideswitch directory.
|
||||
|
||||
The objects that compose the switch are:
|
||||
|
||||
\list
|
||||
\li a \c on property (the interface to interact with the switch),
|
||||
\li two images (the background image and the knob),
|
||||
\li two mouse regions for user interation (on the background image and on the knob),
|
||||
\li two states (an \e on state and an \e off state),
|
||||
\li two functions or slots to react to the user interation (\c toggle() and \c dorelease()),
|
||||
\li and a transition that describe how to go from one state to the other.
|
||||
\endlist
|
||||
|
||||
\section1 Switch.qml
|
||||
\snippet customitems/slideswitch/content/Switch.qml 0
|
||||
|
||||
\section1 Walkthrough
|
||||
|
||||
\section2 Interface
|
||||
\snippet customitems/slideswitch/content/Switch.qml 1
|
||||
|
||||
This property is the interface of the switch. By default, the switch is off and this property is \c false.
|
||||
It can be used to activate/deactivate the switch or to query its current state.
|
||||
|
||||
In this example:
|
||||
|
||||
\qml
|
||||
Item {
|
||||
Switch {
|
||||
id: mySwitch
|
||||
on: true
|
||||
}
|
||||
Text {
|
||||
text: "The switch is on"
|
||||
visible: mySwitch.on == true
|
||||
}
|
||||
}
|
||||
\endqml
|
||||
|
||||
the text will only be visible when the switch is on.
|
||||
|
||||
\section2 Images and User Interaction
|
||||
\snippet customitems/slideswitch/content/Switch.qml 4
|
||||
|
||||
First, we create the background image of the switch.
|
||||
In order for the switch to toggle when the user clicks on the background, we add a \l{MouseArea} as a child item of the image.
|
||||
A \c MouseArea has a \c onClicked property that is triggered when the item is clicked. For the moment we will just call a
|
||||
\c toggle() function. We will see what this function does in a moment.
|
||||
|
||||
\snippet customitems/slideswitch/content/Switch.qml 5
|
||||
|
||||
Then, we place the image of the knob on top of the background.
|
||||
The interaction here is a little more complex. We want the knob to move with the finger when it is clicked. That is what the \c drag
|
||||
property of the \c MouseArea is for. We also want to toggle the switch if the knob is released between state. We handle this case
|
||||
in the \c dorelease() function that is called in the \c onReleased property.
|
||||
|
||||
\section2 States
|
||||
\snippet customitems/slideswitch/content/Switch.qml 6
|
||||
|
||||
We define the two states of the switch:
|
||||
\list
|
||||
\li In the \e on state the knob is on the right (\c x position is 78) and the \c on property is \c true.
|
||||
\li In the \e off state the knob is on the left (\c x position is 1) and the \c on property is \c false.
|
||||
\endlist
|
||||
|
||||
For more information on states see \l{Qt Quick States}.
|
||||
|
||||
\section2 Functions
|
||||
|
||||
We add two JavaScript functions to our switch:
|
||||
|
||||
\snippet customitems/slideswitch/content/Switch.qml 2
|
||||
|
||||
This first function is called when the background image or the knob are clicked. We simply want the switch to toggle between the two
|
||||
states (\e on and \e off).
|
||||
|
||||
|
||||
\snippet customitems/slideswitch/content/Switch.qml 3
|
||||
|
||||
This second function is called when the knob is released and we want to make sure that the knob does not end up between states
|
||||
(neither \e on nor \e off). If it is the case call the \c toggle() function otherwise we do nothing.
|
||||
|
||||
For more information on scripts see \l{JavaScript Expressions in QML Documents}.
|
||||
|
||||
\section2 Transition
|
||||
\snippet customitems/slideswitch/content/Switch.qml 7
|
||||
|
||||
At this point, when the switch toggles between the two states the knob will instantly change its \c x position between 1 and 78.
|
||||
In order for the knob to move smoothly we add a transition that will animate the \c x property with an easing curve for a duration of 200ms.
|
||||
|
||||
For more information on transitions see \l{Animation and Transitions in Qt Quick}.
|
||||
|
||||
\section1 Usage
|
||||
The switch can be used in a QML file, like this:
|
||||
\snippet customitems/slideswitch/slideswitch.qml 0
|
||||
*/
|
||||
|
|
@ -1,14 +0,0 @@
|
|||
// Copyright (C) 2017 The Qt Company Ltd.
|
||||
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
|
||||
|
||||
import QtQuick
|
||||
import "content"
|
||||
|
||||
Rectangle {
|
||||
color: "white"
|
||||
width: 400; height: 250
|
||||
|
||||
//![0]
|
||||
Switch { anchors.centerIn: parent; on: false }
|
||||
//![0]
|
||||
}
|
||||
|
|
@ -1,33 +0,0 @@
|
|||
// Copyright (C) 2017 The Qt Company Ltd.
|
||||
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
|
||||
|
||||
import QtQuick
|
||||
|
||||
Image {
|
||||
property alias model: view.model
|
||||
property alias delegate: view.delegate
|
||||
property alias currentIndex: view.currentIndex
|
||||
property real itemHeight: 30
|
||||
|
||||
source: "spinner-bg.png"
|
||||
clip: true
|
||||
|
||||
PathView {
|
||||
id: view
|
||||
anchors.fill: parent
|
||||
|
||||
pathItemCount: height/itemHeight
|
||||
preferredHighlightBegin: 0.5
|
||||
preferredHighlightEnd: 0.5
|
||||
highlight: Image { source: "spinner-select.png"; width: view.width; height: itemHeight+4 }
|
||||
dragMargin: view.width/2
|
||||
|
||||
path: Path {
|
||||
startX: view.width/2; startY: -itemHeight/2
|
||||
PathLine { x: view.width/2; y: view.pathItemCount*itemHeight + itemHeight }
|
||||
}
|
||||
}
|
||||
|
||||
Keys.onDownPressed: view.incrementCurrentIndex()
|
||||
Keys.onUpPressed: view.decrementCurrentIndex()
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 274 B |
Binary file not shown.
|
Before Width: | Height: | Size: 320 B |
|
|
@ -1,4 +0,0 @@
|
|||
// Copyright (C) 2020 The Qt Company Ltd.
|
||||
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
|
||||
#include "../../shared/shared.h"
|
||||
DECLARATIVE_EXAMPLE_MAIN(main)
|
||||
|
|
@ -1,24 +0,0 @@
|
|||
// Copyright (C) 2017 The Qt Company Ltd.
|
||||
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
|
||||
|
||||
import QtQuick
|
||||
import "content"
|
||||
|
||||
Rectangle {
|
||||
width: 240; height: 320
|
||||
|
||||
Column {
|
||||
y: 20; x: 20; spacing: 20
|
||||
|
||||
Spinner {
|
||||
id: spinner
|
||||
width: 200; height: 240
|
||||
focus: true
|
||||
model: 20
|
||||
itemHeight: 30
|
||||
delegate: Text { font.pixelSize: 25; text: index; height: 30 }
|
||||
}
|
||||
|
||||
Text { text: "Current item index: " + spinner.currentIndex }
|
||||
}
|
||||
}
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
TEMPLATE = app
|
||||
|
||||
QT += quick qml
|
||||
SOURCES += main.cpp
|
||||
|
||||
RESOURCES += spinner.qrc
|
||||
|
||||
target.path = $$[QT_INSTALL_EXAMPLES]/quick/customitems/spinner
|
||||
INSTALLS += target
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
import QmlProject 1.1
|
||||
|
||||
Project {
|
||||
mainFile: "main.qml"
|
||||
|
||||
/* Include .qml, .js, and image files from current directory and subdirectories */
|
||||
QmlFiles {
|
||||
directory: "."
|
||||
}
|
||||
JavaScriptFiles {
|
||||
directory: "."
|
||||
}
|
||||
ImageFiles {
|
||||
directory: "."
|
||||
}
|
||||
}
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
<RCC>
|
||||
<qresource prefix="/">
|
||||
<file>main.qml</file>
|
||||
<file>content/spinner-bg.png</file>
|
||||
<file>content/spinner-select.png</file>
|
||||
<file>content/Spinner.qml</file>
|
||||
</qresource>
|
||||
</RCC>
|
||||
|
|
@ -1,65 +0,0 @@
|
|||
// Copyright (C) 2017 The Qt Company Ltd.
|
||||
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
|
||||
|
||||
import QtQuick
|
||||
|
||||
Item {
|
||||
id: tabWidget
|
||||
|
||||
// Setting the default property to stack.children means any child items
|
||||
// of the TabWidget are actually added to the 'stack' item's children.
|
||||
// See the "Property Binding"
|
||||
// documentation for details on default properties.
|
||||
default property alias content: stack.children
|
||||
|
||||
property int current: 0
|
||||
|
||||
onCurrentChanged: setOpacities()
|
||||
Component.onCompleted: setOpacities()
|
||||
|
||||
function setOpacities() {
|
||||
for (var i = 0; i < stack.children.length; ++i) {
|
||||
stack.children[i].opacity = (i == current ? 1 : 0)
|
||||
}
|
||||
}
|
||||
|
||||
Row {
|
||||
id: header
|
||||
|
||||
Repeater {
|
||||
model: stack.children.length
|
||||
delegate: Rectangle {
|
||||
width: tabWidget.width / stack.children.length; height: 36
|
||||
|
||||
Rectangle {
|
||||
width: parent.width; height: 1
|
||||
anchors { bottom: parent.bottom; bottomMargin: 1 }
|
||||
color: "#acb2c2"
|
||||
}
|
||||
BorderImage {
|
||||
anchors { fill: parent; leftMargin: 2; topMargin: 5; rightMargin: 1 }
|
||||
border { left: 7; right: 7 }
|
||||
source: "tab.png"
|
||||
visible: tabWidget.current == index
|
||||
}
|
||||
Text {
|
||||
horizontalAlignment: Qt.AlignHCenter; verticalAlignment: Qt.AlignVCenter
|
||||
anchors.fill: parent
|
||||
text: stack.children[index].title
|
||||
elide: Text.ElideRight
|
||||
font.bold: tabWidget.current == index
|
||||
}
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
onClicked: tabWidget.current = index
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Item {
|
||||
id: stack
|
||||
width: tabWidget.width
|
||||
anchors.top: header.bottom; anchors.bottom: tabWidget.bottom
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 4.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 309 B |
|
|
@ -1,18 +0,0 @@
|
|||
// Copyright (C) 2017 The Qt Company Ltd.
|
||||
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GFDL-1.3-no-invariants-only
|
||||
|
||||
/*!
|
||||
\title TabWidget Example
|
||||
\example customitems/tabwidget
|
||||
\brief The TabWidget example shows how to create a tabwidget using property aliases
|
||||
and QML Object default properties.
|
||||
|
||||
This example shows how to create a tab widget. It also demonstrates how
|
||||
\l {Property aliases}{property aliases} and
|
||||
\l {QML Object Attributes#Default Properties}{default properties} can be used to collect and
|
||||
assemble the child items declared within an \l Item.
|
||||
|
||||
\image qml-tabwidget-example.png
|
||||
*/
|
||||
|
||||
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
// Copyright (C) 2020 The Qt Company Ltd.
|
||||
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
|
||||
#include "../../shared/shared.h"
|
||||
DECLARATIVE_EXAMPLE_MAIN(main)
|
||||
|
|
@ -1,62 +0,0 @@
|
|||
// Copyright (C) 2017 The Qt Company Ltd.
|
||||
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
|
||||
|
||||
import QtQuick
|
||||
|
||||
TabWidget {
|
||||
id: tabs
|
||||
width: 640; height: 480
|
||||
|
||||
Rectangle {
|
||||
property string title: "Red"
|
||||
anchors.fill: parent
|
||||
color: "#e3e3e3"
|
||||
|
||||
Rectangle {
|
||||
anchors.fill: parent; anchors.margins: 20
|
||||
color: "#ff7f7f"
|
||||
Text {
|
||||
width: parent.width - 20
|
||||
anchors.centerIn: parent; horizontalAlignment: Qt.AlignHCenter
|
||||
text: "Roses are red"
|
||||
font.pixelSize: 20
|
||||
wrapMode: Text.WordWrap
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
property string title: "Green"
|
||||
anchors.fill: parent
|
||||
color: "#e3e3e3"
|
||||
|
||||
Rectangle {
|
||||
anchors.fill: parent; anchors.margins: 20
|
||||
color: "#7fff7f"
|
||||
Text {
|
||||
width: parent.width - 20
|
||||
anchors.centerIn: parent; horizontalAlignment: Qt.AlignHCenter
|
||||
text: "Flower stems are green"
|
||||
font.pixelSize: 20
|
||||
wrapMode: Text.WordWrap
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
property string title: "Blue"
|
||||
anchors.fill: parent; color: "#e3e3e3"
|
||||
|
||||
Rectangle {
|
||||
anchors.fill: parent; anchors.margins: 20
|
||||
color: "#7f7fff"
|
||||
Text {
|
||||
width: parent.width - 20
|
||||
anchors.centerIn: parent; horizontalAlignment: Qt.AlignHCenter
|
||||
text: "Violets are blue"
|
||||
font.pixelSize: 20
|
||||
wrapMode: Text.WordWrap
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
TEMPLATE = app
|
||||
|
||||
QT += quick qml
|
||||
SOURCES += main.cpp
|
||||
|
||||
RESOURCES += tabwidget.qrc
|
||||
|
||||
target.path = $$[QT_INSTALL_EXAMPLES]/quick/customitems/tabwidget
|
||||
INSTALLS += target
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
import QmlProject 1.1
|
||||
|
||||
Project {
|
||||
mainFile: "main.qml"
|
||||
|
||||
/* Include .qml, .js, and image files from current directory and subdirectories */
|
||||
QmlFiles {
|
||||
directory: "."
|
||||
}
|
||||
JavaScriptFiles {
|
||||
directory: "."
|
||||
}
|
||||
ImageFiles {
|
||||
directory: "."
|
||||
}
|
||||
}
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
<RCC>
|
||||
<qresource prefix="/">
|
||||
<file>main.qml</file>
|
||||
<file>TabWidget.qml</file>
|
||||
<file>doc/images/qml-tabwidget-example.png</file>
|
||||
<file>doc/images/tab.png</file>
|
||||
</qresource>
|
||||
</RCC>
|
||||
Loading…
Reference in New Issue