--- /dev/null
+import QmlProject 1.1
+
+Project {
+ mainFile: "stock.qml"
+
+ /* Include .qml, .js, and image files from current directory and subdirectories */
+ QmlFiles {
+ directory: "."
+ }
+ JavaScriptFiles {
+ directory: "."
+ }
+ ImageFiles {
+ directory: "."
+ }
+}
\ No newline at end of file
****************************************************************************/
import QtQuick 2.0
-import "../contents"
import "cache.js" as TwitterUserCache
Rectangle {
width:360
--- /dev/null
+import QmlProject 1.1
+
+Project {
+ mainFile: "friends.qml"
+
+ /* Include .qml, .js, and image files from current directory and subdirectories */
+ QmlFiles {
+ directory: "."
+ }
+ JavaScriptFiles {
+ directory: "."
+ }
+ ImageFiles {
+ directory: "."
+ }
+}
\ No newline at end of file
import "../contents"
Item {
id:container
- width:360
- height:600
+ width:320
+ height:480
Column {
spacing:5
anchors.fill:parent
- Text { font.pointSize:25; text:"Bezier Curve"; anchors.horizontalCenter:parent.horizontalCenter}
+ Text { font.pointSize:15; text:"Bezier Curve"; anchors.horizontalCenter:parent.horizontalCenter}
Canvas {
id:canvas
- width:360
- height:360
+ width:320
+ height:280
property string strokeStyle:"red"
property string fillStyle:"red"
property int lineWidth:lineWidthCtrl.value
Rectangle {
id:controls
- width:360
- height:160
+ width:320
+ height:150
Column {
spacing:3
- Slider {id:lineWidthCtrl; width:300; height:30; min:1; max:10; init:2; name:"Line width"}
- Slider {id:scaleXCtrl; width:300; height:30; min:0.1; max:10; init:1; name:"ScaleX"}
- Slider {id:scaleYCtrl; width:300; height:30; min:0.1; max:10; init:1; name:"ScaleY"}
- Slider {id:rotateCtrl; width:300; height:30; min:0; max:Math.PI*2; init:0; name:"Rotate"}
- Slider {id:alphaCtrl; width:300; height:30; min:0; max:1; init:1; name:"Alpha"}
+ Slider {id:lineWidthCtrl; width:300; height:20; min:1; max:10; init:2; name:"Line width"}
+ Slider {id:scaleXCtrl; width:300; height:20; min:0.1; max:10; init:1; name:"ScaleX"}
+ Slider {id:scaleYCtrl; width:300; height:20; min:0.1; max:10; init:1; name:"ScaleY"}
+ Slider {id:rotateCtrl; width:300; height:20; min:0; max:Math.PI*2; init:0; name:"Rotate"}
+ Slider {id:alphaCtrl; width:300; height:20; min:0; max:1; init:1; name:"Alpha"}
}
}
}
--- /dev/null
+TEMPLATE = app
+
+QT += quick declarative
+SOURCES += main.cpp
+
+target.path = $$[QT_INSTALL_EXAMPLES]/qtdeclarative/quick/canvas
+qml.files = canvas.qml bezierCurve clip quadraticCurveTo roundedrect smile squircle tiger
+qml.path = $$[QT_INSTALL_EXAMPLES]/qtdeclarative/quick/canvas
+INSTALLS += target qml
\ No newline at end of file
--- /dev/null
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the examples of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** You may use this file under the terms of the BSD license as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+** * Redistributions of source code must retain the above copyright
+** notice, this list of conditions and the following disclaimer.
+** * Redistributions in binary form must reproduce the above copyright
+** notice, this list of conditions and the following disclaimer in
+** the documentation and/or other materials provided with the
+** distribution.
+** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
+** the names of its contributors may be used to endorse or promote
+** products derived from this software without specific prior written
+** permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+import "../../shared" as Examples
+
+/*!
+ \title QtQuick Examples - Canvas
+ \example quick/canvas
+ \brief This is a collection of QML Canvas examples.
+
+ This is a collection of small QML examples relating to Canvas item. Each example is
+ a small QML file emphasizing a particular element or feature.
+
+ Red heart demonstrates using a bezierCurve API to stroke and fill a red heart.
+
+ Talk bubble demonstrates using a quadraticCurveTo API to stroke and fill a customized talk bubble,
+ this example also demonstrates the fillText API.
+
+ Squircle demonstrates using a collection of simple moveTo/lineTo path APIs to draw a smooth squircle.
+
+ Rounded rectangle demonstrates using a collection if lineTo/arcTo path APIs to draw a rounded rectangle.
+
+ Smile face demonstrates using several complex path APIs to draw an fill a smile face.
+
+ Clip demonstrates using clip API to clip a given image.
+
+ Tiger demonstrates using SVG path API to draw a tiger with a collection of SVG path strings.
+
+*/
+
+Item {
+ height: 480
+ width: 320
+ Examples.LauncherList {
+ id: ll
+ anchors.fill: parent
+ Component.onCompleted: {
+ addExample("Red heart", "Draws a red heart with bezier curves", Qt.resolvedUrl("bezierCurve/bezierCurve.qml"));
+ addExample("Talk bubble", "Draws a talk bubble with quadratic curves", Qt.resolvedUrl("quadraticCurveTo/quadraticCurveTo.qml"));
+ addExample("Squircle", "Draws a smooth squircle with simple lines", Qt.resolvedUrl("squircle/squircle.qml"));
+ addExample("Rounded rectangle", "Draws a rounded rectangle with lines and arcs", Qt.resolvedUrl("roundedrect/roundedrect.qml"));
+ addExample("Smile face", "Draws a smile face with complex paths", Qt.resolvedUrl("smile/smile.qml"));
+ addExample("Clip", "Shows the canvas clip feature", Qt.resolvedUrl("clip/clip.qml"));
+ addExample("Tiger", "Draw a tiger with a collection of SVG paths", Qt.resolvedUrl("tiger/tiger.qml"));
+ }
+ }
+}
import "../contents"
Item {
id:container
- width:360
- height:600
+ width:320
+ height:480
Column {
spacing:5
anchors.fill:parent
- Text { font.pointSize:25; text:"Makes squircle icon with clip"; anchors.horizontalCenter:parent.horizontalCenter}
+ Text { font.pointSize:15; text:"Makes squircle icon with clip"; anchors.horizontalCenter:parent.horizontalCenter}
Canvas {
id:canvas
- width:360
- height:360
+ width:320
+ height:280
property string strokeStyle:"blue"
property string fillStyle:"steelblue"
property int lineWidth:2
Rectangle {
id:controls
- width:360
- height:160
+ width:320
+ height:150
Column {
spacing:3
- Slider {id:nCtrl; width:300; height:30; min:1; max:10; init:4; name:"N"}
- Slider {id:rCtrl; width:300; height:30; min:30; max:180; init:100; name:"Radius"}
- Slider {id:xCtrl; width:300; height:30; min:50; max:300; init:180; name:"X"}
- Slider {id:yCtrl; width:300; height:30; min:30; max:300; init:220; name:"Y"}
- Slider {id:alphaCtrl; width:300; height:30; min:0; max:1; init:1; name:"Alpha"}
+ Slider {id:nCtrl; width:300; height:20; min:1; max:10; init:4; name:"N"}
+ Slider {id:rCtrl; width:300; height:20; min:30; max:180; init:100; name:"Radius"}
+ Slider {id:xCtrl; width:300; height:20; min:50; max:300; init:180; name:"X"}
+ Slider {id:yCtrl; width:300; height:20; min:30; max:300; init:220; name:"Y"}
+ Slider {id:alphaCtrl; width:300; height:20; min:0; max:1; init:1; name:"Alpha"}
}
}
}
PropertyChanges { target: pressed; opacity: 1 }
}
]
-}
\ No newline at end of file
+}
** $QT_END_LICENSE$
**
****************************************************************************/
-
-#include <QtQml/QQmlExtensionPlugin>
-#include <QtQml/qqml.h>
-#include <QtGui/QGuiApplication>
-#include "model.h"
-
-class QStockChartExampleQmlPlugin : public QQmlExtensionPlugin
-{
- Q_OBJECT
-public:
- void registerTypes(const char *uri)
- {
- Q_ASSERT(uri == QLatin1String("com.nokia.StockChartExample"));
- qmlRegisterType<StockModel>(uri, 1, 0, "StockModel");
- qmlRegisterType<StockPrice>(uri, 1, 0, "StockPrice");
- }
-};
-
-#include "plugin.moc"
-
-Q_EXPORT_PLUGIN2(qmlstockchartexampleplugin, QStockChartExampleQmlPlugin);
+#include "../../shared/shared.h"
+DECLARATIVE_EXAMPLE_MAIN(canvas)
\ No newline at end of file
import "../contents"
Item {
id:container
- width:360
- height:600
+ width:320
+ height:480
Column {
spacing:5
anchors.fill:parent
- Text { font.pointSize:25; text:"Quadratic Curve"; anchors.horizontalCenter:parent.horizontalCenter}
+ Text { font.pointSize:15; text:"Quadratic Curve"; anchors.horizontalCenter:parent.horizontalCenter}
Canvas {
id:canvas
- width:360
- height:360
+ width:320
+ height:280
property string strokeStyle:"steelblue"
property string fillStyle:"yellow"
property int lineWidth:lineWidthCtrl.value
Rectangle {
id:controls
- width:360
- height:160
+ width:320
+ height:150
Column {
spacing:3
- Slider {id:lineWidthCtrl; width:300; height:30; min:1; max:10; init:2; name:"Line width"}
- Slider {id:scaleXCtrl; width:300; height:30; min:0.1; max:10; init:1; name:"ScaleX"}
- Slider {id:scaleYCtrl; width:300; height:30; min:0.1; max:10; init:1; name:"ScaleY"}
- Slider {id:rotateCtrl; width:300; height:30; min:0; max:Math.PI*2; init:0; name:"Rotate"}
- Slider {id:alphaCtrl; width:300; height:30; min:0; max:1; init:1; name:"Alpha"}
+ Slider {id:lineWidthCtrl; width:300; height:20; min:1; max:10; init:2; name:"Line width"}
+ Slider {id:scaleXCtrl; width:300; height:20; min:0.1; max:10; init:1; name:"ScaleX"}
+ Slider {id:scaleYCtrl; width:300; height:20; min:0.1; max:10; init:1; name:"ScaleY"}
+ Slider {id:rotateCtrl; width:300; height:20; min:0; max:Math.PI*2; init:0; name:"Rotate"}
+ Slider {id:alphaCtrl; width:300; height:20; min:0; max:1; init:1; name:"Alpha"}
}
}
}
import "../contents"
Item {
id:container
- width:360
- height:600
+ width:320
+ height:480
Column {
spacing:5
anchors.fill:parent
- Text { font.pointSize:25; text:"Rounded rectangle"; anchors.horizontalCenter:parent.horizontalCenter}
+ Text { font.pointSize:15; text:"Rounded rectangle"; anchors.horizontalCenter:parent.horizontalCenter}
Canvas {
id:canvas
- width:360
- height:360
+ width:320
+ height:280
smooth:true
renderTarget:Canvas.Image
renderStrategy: Canvas.Immediate
Rectangle {
id:controls
- width:360
- height:160
+ width:320
+ height:150
Column {
spacing:3
- Slider {id:lineWidthCtrl; width:300; height:30; min:1; max:10; init:2; name:"Line width"}
- Slider {id:rxCtrl; width:300; height:30; min:5; max:30; init:10; name:"rectx"}
- Slider {id:ryCtrl; width:300; height:30; min:5; max:30; init:10; name:"recty"}
- Slider {id:rCtrl; width:300; height:30; min:10; max:100; init:40; name:"Radius"}
- Slider {id:alphaCtrl; width:300; height:30; min:0; max:1; init:1; name:"Alpha"}
+ Slider {id:lineWidthCtrl; width:300; height:20; min:1; max:10; init:2; name:"Line width"}
+ Slider {id:rxCtrl; width:300; height:20; min:5; max:30; init:10; name:"rectx"}
+ Slider {id:ryCtrl; width:300; height:20; min:5; max:30; init:10; name:"recty"}
+ Slider {id:rCtrl; width:300; height:20; min:10; max:100; init:40; name:"Radius"}
+ Slider {id:alphaCtrl; width:300; height:20; min:0; max:1; init:1; name:"Alpha"}
}
}
}
import "../contents"
Item {
id:container
- width:360
- height:600
+ width:320
+ height:480
Column {
spacing:5
anchors.fill:parent
- Text { font.pointSize:25; text:"Smile with arcs"; anchors.horizontalCenter:parent.horizontalCenter}
+ Text { font.pointSize:15; text:"Smile with arcs"; anchors.horizontalCenter:parent.horizontalCenter}
Canvas {
id:canvas
- width:360
- height:360
+ width:320
+ height:280
smooth:true
renderTarget:Canvas.Image
renderStrategy: Canvas.Immediate
Rectangle {
id:controls
- width:360
- height:160
+ width:320
+ height:150
Column {
spacing:3
- Slider {id:lineWidthCtrl; width:300; height:30; min:1; max:10; init:2; name:"Line width"}
- Slider {id:scaleXCtrl; width:300; height:30; min:0.1; max:10; init:1; name:"ScaleX"}
- Slider {id:scaleYCtrl; width:300; height:30; min:0.1; max:10; init:1; name:"ScaleY"}
- Slider {id:rotateCtrl; width:300; height:30; min:0; max:Math.PI*2; init:0; name:"Rotate"}
- Slider {id:alphaCtrl; width:300; height:30; min:0; max:1; init:1; name:"Alpha"}
+ Slider {id:lineWidthCtrl; width:300; height:20; min:1; max:10; init:2; name:"Line width"}
+ Slider {id:scaleXCtrl; width:300; height:20; min:0.1; max:10; init:1; name:"ScaleX"}
+ Slider {id:scaleYCtrl; width:300; height:20; min:0.1; max:10; init:1; name:"ScaleY"}
+ Slider {id:rotateCtrl; width:300; height:20; min:0; max:Math.PI*2; init:0; name:"Rotate"}
+ Slider {id:alphaCtrl; width:300; height:20; min:0; max:1; init:1; name:"Alpha"}
}
}
}
import "../contents"
Item {
id:container
- width:360
- height:600
+ width:320
+ height:480
Column {
spacing:5
anchors.fill:parent
- Text { font.pointSize:25; text:"Squircles"; anchors.horizontalCenter:parent.horizontalCenter}
+ Text { font.pointSize:15; text:"Squircles"; anchors.horizontalCenter:parent.horizontalCenter}
Image {
anchors.horizontalCenter:parent.horizontalCenter
source:"squircle.png"
}
Canvas {
id:canvas
- width:360
- height:360
+ width:320
+ height:250
smooth:true
renderTarget:Canvas.Image
renderStrategy: Canvas.Immediate
Rectangle {
id:controls
- width:360
- height:160
+ width:320
+ height:150
Column {
spacing:3
- Slider {id:nCtrl; width:300; height:30; min:1; max:10; init:4; name:"N"}
- Slider {id:rCtrl; width:300; height:30; min:30; max:180; init:100; name:"Radius"}
- Slider {id:xCtrl; width:300; height:30; min:50; max:300; init:180; name:"X"}
- Slider {id:yCtrl; width:300; height:30; min:30; max:300; init:220; name:"Y"}
- Slider {id:alphaCtrl; width:300; height:30; min:0; max:1; init:1; name:"Alpha"}
+ Slider {id:nCtrl; width:300; height:20; min:1; max:10; init:4; name:"N"}
+ Slider {id:rCtrl; width:300; height:20; min:30; max:180; init:100; name:"Radius"}
+ Slider {id:xCtrl; width:300; height:20; min:50; max:300; init:180; name:"X"}
+ Slider {id:yCtrl; width:300; height:20; min:30; max:300; init:220; name:"Y"}
+ Slider {id:alphaCtrl; width:300; height:20; min:0; max:1; init:1; name:"Alpha"}
}
}
}
import "tiger.js" as Tiger
Item {
id:container
- width:360
- height:600
+ width:320
+ height:480
Column {
spacing:5
anchors.fill:parent
- Text { font.pointSize:25; text:"Tiger with SVG path"; anchors.horizontalCenter:parent.horizontalCenter}
+ Text { font.pointSize:15; text:"Tiger with SVG path"; anchors.horizontalCenter:parent.horizontalCenter}
Canvas {
id:canvas
- width:360
- height:360
+ width:320
+ height:280
smooth:true
renderTarget:Canvas.FramebufferObject
renderStrategy: Canvas.Cooperative
}
Rectangle {
id:controls
- width:360
- height:160
+ width:320
+ height:150
Column {
spacing:3
- Slider {id:scaleXCtrl; width:300; height:30; min:0.1; max:10; init:0.5; name:"ScaleX"}
- Slider {id:scaleYCtrl; width:300; height:30; min:0.1; max:10; init:0.5; name:"ScaleY"}
- Slider {id:rotateCtrl; width:300; height:30; min:0; max:Math.PI*2; init:0; name:"Rotate"}
- Slider {id:alphaCtrl; width:300; height:30; min:0; max:1; init:1; name:"Alpha"}
+ Slider {id:scaleXCtrl; width:300; height:20; min:0.1; max:10; init:0.5; name:"ScaleX"}
+ Slider {id:scaleYCtrl; width:300; height:20; min:0.1; max:10; init:0.5; name:"ScaleY"}
+ Slider {id:rotateCtrl; width:300; height:20; min:0; max:Math.PI*2; init:0; name:"Rotate"}
+ Slider {id:alphaCtrl; width:300; height:20; min:0; max:1; init:1; name:"Alpha"}
}
}
}