From d98362f5e9cc5c07cff5f32672aa448b0a0c31c4 Mon Sep 17 00:00:00 2001 From: Mika Salmela Date: Fri, 2 May 2014 14:14:55 +0300 Subject: StocQt demo improvement MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Along with general demo improvements, this task implements the new layout to the StocQt demo. Also few bugs on the functionality are corrected, like drawing the stock graph on right way and initial values reset on stock model when changing active stock. Task-number: QTBUG-38254 Change-Id: I9d3387ed0e3f23512b8e60c70246589c10237818 Reviewed-by: Topi Reiniƶ --- examples/quick/demos/stocqt/content/Button.qml | 10 +- examples/quick/demos/stocqt/content/CheckBox.qml | 24 +-- examples/quick/demos/stocqt/content/DatePicker.qml | 131 ------------ examples/quick/demos/stocqt/content/StockChart.qml | 226 ++++++++++++--------- examples/quick/demos/stocqt/content/StockInfo.qml | 119 +++++++++++ .../quick/demos/stocqt/content/StockListModel.qml | 200 +++++++++--------- .../quick/demos/stocqt/content/StockListView.qml | 181 ++++++++++++++++- examples/quick/demos/stocqt/content/StockModel.qml | 45 ++-- .../quick/demos/stocqt/content/StockSettings.qml | 216 -------------------- .../demos/stocqt/content/StockSettingsPanel.qml | 174 ++++++++++++++++ examples/quick/demos/stocqt/content/StockView.qml | 92 +++------ .../stocqt/content/images/icon-calendar-anim.png | Bin 1088 -> 0 bytes .../demos/stocqt/content/images/icon-calendar.png | Bin 884 -> 0 bytes .../demos/stocqt/content/images/icon-items.png | Bin 887 -> 0 bytes .../stocqt/content/images/icon-left-arrow.png | Bin 0 -> 1368 bytes .../demos/stocqt/content/images/icon-settings.png | Bin 1066 -> 0 bytes .../quick/demos/stocqt/content/images/logo.png | Bin 4266 -> 0 bytes .../stocqt/doc/images/qtquick-demo-stocqt.png | Bin 24592 -> 48979 bytes examples/quick/demos/stocqt/stocqt.pro | 1 + examples/quick/demos/stocqt/stocqt.qml | 140 ++++++++----- examples/quick/demos/stocqt/stocqt.qrc | 10 +- 21 files changed, 850 insertions(+), 719 deletions(-) delete mode 100644 examples/quick/demos/stocqt/content/DatePicker.qml create mode 100644 examples/quick/demos/stocqt/content/StockInfo.qml delete mode 100644 examples/quick/demos/stocqt/content/StockSettings.qml create mode 100644 examples/quick/demos/stocqt/content/StockSettingsPanel.qml delete mode 100644 examples/quick/demos/stocqt/content/images/icon-calendar-anim.png delete mode 100644 examples/quick/demos/stocqt/content/images/icon-calendar.png delete mode 100644 examples/quick/demos/stocqt/content/images/icon-items.png create mode 100644 examples/quick/demos/stocqt/content/images/icon-left-arrow.png delete mode 100644 examples/quick/demos/stocqt/content/images/icon-settings.png delete mode 100644 examples/quick/demos/stocqt/content/images/logo.png (limited to 'examples/quick') diff --git a/examples/quick/demos/stocqt/content/Button.qml b/examples/quick/demos/stocqt/content/Button.qml index 6cad4e135e..38b553fb31 100644 --- a/examples/quick/demos/stocqt/content/Button.qml +++ b/examples/quick/demos/stocqt/content/Button.qml @@ -47,17 +47,17 @@ Rectangle { property bool buttonEnabled: false width: Math.max(64, txt.width + 16) height: 32 - color: buttonEnabled ? "#76644A" : "transparent" - border.color: "#76644A" - border.width: 1 + color: "transparent" MouseArea { anchors.fill: parent onClicked: button.clicked() } Text { anchors.centerIn: parent - font.pixelSize: 18 - color: "#ecc089" + font.family: "Open Sans" + font.pointSize: 19 + font.weight: Font.DemiBold + color: button.buttonEnabled ? "#000000" : "#14aaff" id: txt } } diff --git a/examples/quick/demos/stocqt/content/CheckBox.qml b/examples/quick/demos/stocqt/content/CheckBox.qml index 1e7dcf7c74..5d9accaf7f 100644 --- a/examples/quick/demos/stocqt/content/CheckBox.qml +++ b/examples/quick/demos/stocqt/content/CheckBox.qml @@ -42,10 +42,9 @@ import QtQuick 2.0 Item { id: button - property alias text: txt.text property bool buttonEnabled: true - width: 140 - height: 25 + width: 30 + height: 30 x: 5 MouseArea { id: mouse @@ -59,29 +58,20 @@ Item { } Rectangle { id: checkbox - width: 23 - height: 23 + width: 30 + height: 30 anchors.left: parent.left - border.color: "#76644A" + border.color: "#999999" border.width: 1 antialiasing: true radius: 2 color: "transparent" Rectangle { anchors.fill: parent - anchors.margins: 4 + anchors.margins: 5 antialiasing: true radius: 1 - color: mouse.pressed || buttonEnabled ? "#76644A" : "transparent" + color: mouse.pressed || buttonEnabled ? "#999999" : "transparent" } } - Text { - id: txt - anchors.left: checkbox.right - anchors.leftMargin: 4 - anchors.verticalCenter: parent.verticalCenter - text: "Close " - color: "#ecc089" - font.pixelSize: 18 - } } diff --git a/examples/quick/demos/stocqt/content/DatePicker.qml b/examples/quick/demos/stocqt/content/DatePicker.qml deleted file mode 100644 index 6c0df2a41a..0000000000 --- a/examples/quick/demos/stocqt/content/DatePicker.qml +++ /dev/null @@ -1,131 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies). -** Contact: http://www.qt-project.org/legal -** -** 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 Digia Plc 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 - -Rectangle { - id: root - color: "transparent" - width: 300 - height: 40 - property var _monthNames: [ "JAN", "FEB", "MAR", "APR", "MAY", "JUN","JUL", "AUG", "SEP", "OCT", "NOV", "DEC" ]; - property var date: new Date() - - onDateChanged: { - month.text = root._monthNames[root.date.getMonth()]; - day.text = date.getDate(); - year.text = date.getFullYear(); - } - Row { - spacing: 4 - anchors.fill: parent - - Rectangle { - height: root.height - width: root.width/3 - 20 - color: "#272822" - border.color: "#76644A" - border.width: 1 - radius: 2 - antialiasing: true - - TextInput { - id: month - anchors.centerIn: parent - color: "#ecc089" - font.pointSize: 25 - font.bold: true - text: root._monthNames[root.date.getMonth()] - onAccepted: { - for (var i = 0; i < 12; i++) { - if (text === root._monthNames[i]) { - root.date.setMonth(i); - root.date = root.date; - return; - } - } - root.date = root.date; - } - } - } - - Rectangle { - height: root.height - width: root.width/3 - 20 - color: "#272822" - border.color: "#76644A" - border.width: 1 - radius: 2 - antialiasing: true - - TextInput { - id: day - anchors.centerIn: parent - color: "#ecc089" - font.pointSize: 25 - font.bold: true - text: root.date.getDate() - validator:IntValidator {bottom: 1; top: 31} - onAccepted: { root.date.setDate(text); root.date = root.date;} - } - } - - Rectangle { - height: root.height - width: root.width/3 - 20 - color: "#272822" - border.color: "#76644A" - border.width: 1 - radius: 2 - antialiasing: true - - TextInput { - id: year - anchors.centerIn: parent - color: "#ecc089" - font.pointSize: 25 - font.bold: true - text: root.date.getFullYear() - validator: IntValidator {bottom: 1995; top: (new Date()).getFullYear()} - onAccepted:{ root.date.setFullYear(text); root.date = root.date;} - } - } - } -} diff --git a/examples/quick/demos/stocqt/content/StockChart.qml b/examples/quick/demos/stocqt/content/StockChart.qml index f7e0d0206b..e6bc02306e 100644 --- a/examples/quick/demos/stocqt/content/StockChart.qml +++ b/examples/quick/demos/stocqt/content/StockChart.qml @@ -43,93 +43,155 @@ import QtQuick 2.0 Rectangle { id: chart width: 320 - height: 320 + height: 200 color: "transparent" property var _months: [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ] property var stockModel: null property var startDate: new Date() property var endDate: new Date() + property string activeChart: "year" property var settings function update() { - if (settings.chartType === "year") + endDate = new Date(); + if (chart.activeChart === "year") chart.startDate = new Date(chart.endDate.getFullYear() - 1, chart.endDate.getMonth(), chart.endDate.getDate()); - else if (settings.chartType === "month") + else if (chart.activeChart === "month") chart.startDate = new Date(chart.endDate.getFullYear() , chart.endDate.getMonth() -1, chart.endDate.getDate()); - else if (settings.chartType === "week") + else if (chart.activeChart === "week") chart.startDate = new Date(chart.endDate.getFullYear() , chart.endDate.getMonth(), chart.endDate.getDate() - 7); else - chart.startDate = new Date(1995, 3, 25); + chart.startDate = new Date(2005, 3, 25); canvas.requestPaint(); } + Row { + id: activeChartRow + anchors.left: chart.left + anchors.right: chart.right + anchors.top: chart.top + anchors.topMargin: 4 + spacing: 52 + onWidthChanged: { + var buttonsLen = maxButton.width + yearButton.width + monthButton.width + weekButton.width; + var space = (width - buttonsLen) / 3; + spacing = Math.max(space, 10); + } + + Button { + id: maxButton + text: "Max" + buttonEnabled: chart.activeChart === "max" + onClicked: { + chart.activeChart = "max"; + chart.update(); + } + } + Button { + id: yearButton + text: "Year" + buttonEnabled: chart.activeChart === "year" + onClicked: { + chart.activeChart = "year"; + chart.update(); + } + } + Button { + id: monthButton + text: "Month" + buttonEnabled: chart.activeChart === "month" + onClicked: { + chart.activeChart = "month"; + chart.update(); + } + } + Button { + id: weekButton + text: "Week" + buttonEnabled: chart.activeChart === "week" + onClicked: { + chart.activeChart = "week"; + chart.update(); + } + } + } + Text { id: fromDate - color: "#6a5b44" + color: "#000000" width: 50 + font.family: "Open Sans" font.pointSize: 10 wrapMode: Text.WordWrap anchors.left: parent.left anchors.leftMargin: 20 - anchors.top: parent.top + anchors.bottom: parent.bottom text: _months[startDate.getMonth()] + "\n" + startDate.getFullYear() } Text { id: toDate - color: "#6a5b44" + color: "#000000" font.pointSize: 10 width: 50 wrapMode: Text.WordWrap anchors.right: parent.right anchors.leftMargin: 20 - anchors.top: parent.top + anchors.bottom: parent.bottom text: _months[endDate.getMonth()] + "\n" + endDate.getFullYear() } Canvas { id: canvas - width: parent.width - anchors.top: toDate.bottom - anchors.bottom: parent.bottom - renderTarget: Canvas.FramebufferObject + anchors.top: activeChartRow.bottom + anchors.left: chart.left + anchors.right: chart.right + anchors.bottom: fromDate.top antialiasing: true - property int frames: first - property int mouseX: 0 - property int mouseY: 0 - property int mousePressedX: 0 - property int mousePressedY: 0 - property int movedY: 0 - property real scaleX: 1.0 - property real scaleY: 1.0 - property int first: 0 - property int last: 0 property int pixelSkip: 1 + property real xGridOffset: width / 13 + property real xGridStep: width / 4 + property real yGridOffset: height / 26 + property real yGridStep: height / 12 + function drawBackground(ctx) { ctx.save(); - ctx.fillStyle = "#272822"; + ctx.fillStyle = "#ffffff"; ctx.fillRect(0, 0, canvas.width, canvas.height); - ctx.strokeStyle = "#423a2f"; + ctx.strokeStyle = "#d7d7d7"; ctx.beginPath(); - for (var i = 0; i < 10; i++) { - ctx.moveTo(0, i * (canvas.height/10.0)); - ctx.lineTo(canvas.width, i * (canvas.height/10.0)); + // Horizontal grid lines + for (var i = 0; i < 12; i++) { + ctx.moveTo(0, canvas.yGridOffset + i * canvas.yGridStep); + ctx.lineTo(canvas.width, canvas.yGridOffset + i * canvas.yGridStep); } - for (i = 0; i < 12; i++) { - ctx.moveTo(i * (canvas.width/12.0), 0); - ctx.lineTo(i * (canvas.width/12.0), canvas.height); + // Vertical grid lines + var height = 35 * canvas.height / 36; + var yOffset = canvas.height - height; + for (i = 0; i < 4; i++) { + ctx.moveTo(canvas.xGridOffset + i * canvas.xGridStep, yOffset); + ctx.lineTo(canvas.xGridOffset + i * canvas.xGridStep, height); } ctx.stroke(); - ctx.strokeStyle = "#5c7a37"; + // Right ticks + ctx.strokeStyle = "#666666"; ctx.beginPath(); - ctx.moveTo(8 * (canvas.width/12.0), 0); - ctx.lineTo(8 * (canvas.width/12.0), canvas.height); + var xStart = 35 * canvas.width / 36; + ctx.moveTo(xStart, 0); + ctx.lineTo(xStart, canvas.height); + for (i = 0; i < 12; i++) { + ctx.moveTo(xStart, canvas.yGridOffset + i * canvas.yGridStep); + ctx.lineTo(canvas.width, canvas.yGridOffset + i * canvas.yGridStep); + } + ctx.moveTo(0, canvas.yGridOffset + 9 * canvas.yGridStep); + ctx.lineTo(canvas.width, canvas.yGridOffset + 9 * canvas.yGridStep); + ctx.closePath(); ctx.stroke(); ctx.restore(); @@ -140,64 +202,29 @@ Rectangle { ctx.save(); ctx.globalAlpha = 0.7; ctx.strokeStyle = color; - ctx.lineWidth = 1; + ctx.lineWidth = 3; ctx.beginPath(); - var w = canvas.width/points.length; var end = points.length; - for (var i = 0; i < end; i+=pixelSkip) { - var x = points[i].x; + var xOffset = canvas.width / 36 + + for (var i = 0; i < end; i += pixelSkip) { + var x = 34 * points[i].x / 36 + xOffset; var y = points[i][price]; + y = canvas.height * y/highest; + y = canvas.height - y; + y = 9 * y / 12 + yGridOffset; // Scaling to graph area if (i == 0) { - ctx.moveTo(x+w/2, y); + ctx.moveTo(x, y); } else { - ctx.lineTo(x+w/2, y); + ctx.lineTo(x, y); } } ctx.stroke(); ctx.restore(); } - function drawKLine(ctx, from, to, points, highest) - { - ctx.save(); - ctx.globalAlpha = 0.4; - ctx.lineWidth = 2; - var end = points.length; - for (var i = 0; i < end; i+=pixelSkip) { - var x = points[i].x; - var open = canvas.height * points[i].open/highest - canvas.movedY; - var close = canvas.height * points[i].close/highest - canvas.movedY; - var high = canvas.height * points[i].high/highest - canvas.movedY; - var low = canvas.height * points[i].low/highest - canvas.movedY; - - var top, bottom; - if (close <= open) { - ctx.fillStyle = Qt.rgba(1, 0, 0, 1); - ctx.strokeStyle = Qt.rgba(1, 0, 0, 1); - top = close; - bottom = open; - } else { - ctx.fillStyle = Qt.rgba(0, 1, 0, 1); - ctx.strokeStyle = Qt.rgba(0, 1, 0, 1); - top = open; - bottom = close; - } - - var w1, w2; - w1 = canvas.width/points.length; - w2 = w1 > 10 ? w1/2 : w1; - - ctx.fillRect(x + (w1 - w2)/2, top, w2, bottom - top); - ctx.beginPath(); - ctx.moveTo(x+w1/2, high); - ctx.lineTo(x+w1/2, low); - ctx.stroke(); - } - ctx.restore(); - } - function drawVolume(ctx, from, to, color, price, points, highest) { ctx.save(); @@ -211,7 +238,8 @@ Rectangle { var x = points[i].x; var y = points[i][price]; y = canvas.height * (1 - y/highest); - ctx.fillRect(x, y, canvas.width/points.length, canvas.height - y); + y = 3 * y / 13; + ctx.fillRect(x, canvas.height - y, canvas.width/points.length, y); } ctx.restore(); } @@ -223,41 +251,39 @@ Rectangle { ctx.lineWidth = 1; drawBackground(ctx); - if (!stockModel.ready) + + if (!stockModel.ready) { return; + } - last = stockModel.indexOf(chart.endDate) - first = last - (chart.endDate.getTime() - chart.startDate.getTime())/86400000; - first = Math.max(first, 0); - console.log("painting... first:" + first + ", last:" + last); + var last = stockModel.indexOf(chart.startDate); + var first = 0; var highestPrice = stockModel.highestPrice; var highestVolume = stockModel.highestVolume; - console.log("highest price:" + highestPrice + ", highest volume:" + highestVolume) var points = []; - for (var i = 0; i <= last - first; i+=pixelSkip) { - var price = stockModel.get(i + first); + var step = canvas.width / (last + 0); + for (var i = last, j = 0; i >= 0 ; i -= pixelSkip, j += pixelSkip) { + var price = stockModel.get(i); points.push({ - x: i*canvas.width/(last-first+1), + x: j * step, open: price.open, close: price.close, - high:price.high, - low:price.low, - volume:price.volume + high: price.high, + low: price.low, + volume: price.volume }); } + if (settings.drawHighPrice) - drawPrice(ctx, first, last, settings.highColor,"high", points, highestPrice); + drawPrice(ctx, first, last, settings.highColor, "high", points, highestPrice); if (settings.drawLowPrice) - drawPrice(ctx, first, last, settings.lowColor,"low", points, highestPrice); + drawPrice(ctx, first, last, settings.lowColor, "low", points, highestPrice); if (settings.drawOpenPrice) - drawPrice(ctx, first, last,settings.openColor,"open", points, highestPrice); + drawPrice(ctx, first, last,settings.openColor, "open", points, highestPrice); if (settings.drawClosePrice) - drawPrice(ctx, first, last, settings.closeColor,"close", points, highestPrice); - if (settings.drawVolume) - drawVolume(ctx, first, last, settings.volumeColor,"volume", points, highestVolume); - if (settings.drawKLine) - drawKLine(ctx, first, last, points, highestPrice); + drawPrice(ctx, first, last, settings.closeColor, "close", points, highestPrice); + drawVolume(ctx, first, last, settings.volumeColor, "volume", points, highestVolume); } } } diff --git a/examples/quick/demos/stocqt/content/StockInfo.qml b/examples/quick/demos/stocqt/content/StockInfo.qml new file mode 100644 index 0000000000..3178f03098 --- /dev/null +++ b/examples/quick/demos/stocqt/content/StockInfo.qml @@ -0,0 +1,119 @@ +/**************************************************************************** +** +** Copyright (C) 2014 Digia Plc and/or its subsidiary(-ies). +** Contact: http://www.qt-project.org/legal +** +** 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 Digia Plc 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 + +Rectangle { + id: root + width: 440 + height: 160 + color: "transparent" + + property var stock: null + + Text { + id: stockIdText + anchors.left: parent.left + anchors.leftMargin: 5 + anchors.top: parent.top + anchors.topMargin: 15 + color: "#000000" + font.family: "Open Sans" + font.pointSize: 38 + font.weight: Font.DemiBold + text: root.stock.stockId + } + + Text { + id: stockNameText + anchors.left: parent.left + anchors.leftMargin: 5 + anchors.bottom: priceChangePercentage.bottom + anchors.right: priceChangePercentage.left + anchors.rightMargin: 15 + color: "#000000" + font.family: "Open Sans" + font.pointSize: 16 + elide: Text.ElideRight + text: root.stock.stockName + } + + Text { + id: price + anchors.right: parent.right + anchors.rightMargin: 5 + anchors.top: parent.top + anchors.topMargin: 15 + horizontalAlignment: Text.AlignRight + color: "#000000" + font.family: "Open Sans" + font.pointSize: 30 + font.weight: Font.DemiBold + text: root.stock.stockPrice + } + + Text { + id: priceChange + anchors.right: parent.right + anchors.rightMargin: 20 + anchors.top: price.bottom + anchors.topMargin: 5 + horizontalAlignment: Text.AlignRight + color: root.stock.stockPriceChanged < 0 ? "#d40000" : "#328930" + font.family: "Open Sans" + font.pointSize: 20 + font.weight: Font.Bold + text: root.stock.stockPriceChanged + } + + Text { + id: priceChangePercentage + anchors.right: parent.right + anchors.rightMargin: 20 + anchors.top: priceChange.bottom + anchors.topMargin: 5 + horizontalAlignment: Text.AlignRight + color: root.stock.stockPriceChanged < 0 ? "#d40000" : "#328930" + font.family: "Open Sans" + font.pointSize: 18 + font.weight: Font.Bold + text: Math.abs(Math.round(root.stock.stockPriceChanged/(root.stock.stockPrice - root.stock.stockPriceChanged) * 100))/100 +"%" + } +} diff --git a/examples/quick/demos/stocqt/content/StockListModel.qml b/examples/quick/demos/stocqt/content/StockListModel.qml index 635e3afb4a..a0e5590763 100644 --- a/examples/quick/demos/stocqt/content/StockListModel.qml +++ b/examples/quick/demos/stocqt/content/StockListModel.qml @@ -43,104 +43,104 @@ import QtQuick 2.0 ListModel { id: stocks // Data from : http://en.wikipedia.org/wiki/NASDAQ-100 - ListElement {name: "Activision Blizzard"; stockId: "ATVI"} - ListElement {name: "Adobe Systems Incorporated"; stockId: "ADBE"} - ListElement {name: "Akamai Technologies, Inc"; stockId: "AKAM"} - ListElement {name: "Alexion Pharmaceuticals"; stockId: "ALXN"} - ListElement {name: "Altera Corporation"; stockId: "ALTR"} - ListElement {name: "Amazon.com, Inc."; stockId: "AMZN"} - ListElement {name: "Amgen Inc."; stockId: "AMGN"} - ListElement {name: "Apollo Group, Inc."; stockId: "APOL"} - ListElement {name: "Apple Inc."; stockId: "AAPL"} - ListElement {name: "Applied Materials, Inc."; stockId: "AMAT"} - ListElement {name: "Autodesk, Inc."; stockId: "ADSK"} - ListElement {name: "Automatic Data Processing, Inc."; stockId: "ADP"} - ListElement {name: "Baidu.com, Inc."; stockId: "BIDU"} - ListElement {name: "Bed Bath & Beyond Inc."; stockId: "BBBY"} - ListElement {name: "Biogen Idec, Inc"; stockId: "BIIB"} - ListElement {name: "BMC Software, Inc."; stockId: "BMC"} - ListElement {name: "Broadcom Corporation"; stockId: "BRCM"} - ListElement {name: "C. H. Robinson Worldwide, Inc."; stockId: "CHRW"} - ListElement {name: "CA, Inc."; stockId: "CA"} - ListElement {name: "Celgene Corporation"; stockId: "CELG"} - ListElement {name: "Cephalon, Inc."; stockId: "CEPH"} - ListElement {name: "Cerner Corporation"; stockId: "CERN"} - ListElement {name: "Check Point Software Technologies Ltd."; stockId: "CHKP"} - ListElement {name: "Cisco Systems, Inc."; stockId: "CSCO"} - ListElement {name: "Citrix Systems, Inc."; stockId: "CTXS"} - ListElement {name: "Cognizant Technology Solutions Corporation"; stockId: "CTSH"} - ListElement {name: "Comcast Corporation"; stockId: "CMCSA"} - ListElement {name: "Costco Wholesale Corporation"; stockId: "COST"} - ListElement {name: "Ctrip.com International, Ltd."; stockId: "CTRP"} - ListElement {name: "Dell Inc."; stockId: "DELL"} - ListElement {name: "DENTSPLY International Inc."; stockId: "XRAY"} - ListElement {name: "DirecTV"; stockId: "DTV"} - ListElement {name: "Dollar Tree, Inc."; stockId: "DLTR"} - ListElement {name: "eBay Inc."; stockId: "EBAY"} - ListElement {name: "Electronic Arts Inc."; stockId: "ERTS"} - ListElement {name: "Expedia, Inc."; stockId: "EXPE"} - ListElement {name: "Expeditors International of Washington, Inc."; stockId: "EXPD"} - ListElement {name: "Express Scripts, Inc."; stockId: "ESRX"} - ListElement {name: "F5 Networks, Inc."; stockId: "FFIV"} - ListElement {name: "Fastenal Company"; stockId: "FAST"} - ListElement {name: "First Solar, Inc."; stockId: "FSLR"} - ListElement {name: "Fiserv, Inc."; stockId: "FISV"} - ListElement {name: "Flextronics International Ltd."; stockId: "FLEX"} - ListElement {name: "FLIR Systems, Inc."; stockId: "FLIR"} - ListElement {name: "Garmin Ltd."; stockId: "GRMN"} - ListElement {name: "Gilead Sciences, Inc."; stockId: "GILD"} - ListElement {name: "Google Inc."; stockId: "GOOG"} - ListElement {name: "Green Mountain Coffee Roasters, Inc."; stockId: "GMCR"} - ListElement {name: "Henry Schein, Inc."; stockId: "HSIC"} - ListElement {name: "Illumina, Inc."; stockId: "ILMN"} - ListElement {name: "Infosys Technologies"; stockId: "INFY"} - ListElement {name: "Intel Corporation"; stockId: "INTC"} - ListElement {name: "Intuit, Inc."; stockId: "INTU"} - ListElement {name: "Intuitive Surgical Inc."; stockId: "ISRG"} - ListElement {name: "Joy Global Inc."; stockId: "JOYG"} - ListElement {name: "KLA Tencor Corporation"; stockId: "KLAC"} - ListElement {name: "Lam Research Corporation"; stockId: "LRCX"} - ListElement {name: "Liberty Media Corporation, Interactive Series A"; stockId: "LINTA"} - ListElement {name: "Life Technologies Corporation"; stockId: "LIFE"} - ListElement {name: "Linear Technology Corporation"; stockId: "LLTC"} - ListElement {name: "Marvell Technology Group, Ltd."; stockId: "MRVL"} - ListElement {name: "Mattel, Inc."; stockId: "MAT"} - ListElement {name: "Maxim Integrated Products"; stockId: "MXIM"} - ListElement {name: "Microchip Technology Incorporated"; stockId: "MCHP"} - ListElement {name: "Micron Technology, Inc."; stockId: "MU"} - ListElement {name: "Microsoft Corporation"; stockId: "MSFT"} - ListElement {name: "Mylan, Inc."; stockId: "MYL"} - ListElement {name: "NetApp, Inc."; stockId: "NTAP"} - ListElement {name: "Netflix, Inc."; stockId: "NFLX"} - ListElement {name: "News Corporation, Ltd."; stockId: "NWSA"} - ListElement {name: "NII Holdings, Inc."; stockId: "NIHD"} - ListElement {name: "NVIDIA Corporation"; stockId: "NVDA"} - ListElement {name: "O'Reilly Automotive, Inc."; stockId: "ORLY"} - ListElement {name: "Oracle Corporation"; stockId: "ORCL"} - ListElement {name: "PACCAR Inc."; stockId: "PCAR"} - ListElement {name: "Paychex, Inc."; stockId: "PAYX"} - ListElement {name: "Priceline.com, Incorporated"; stockId: "PCLN"} - ListElement {name: "Qiagen N.V."; stockId: "QGEN"} - ListElement {name: "QUALCOMM Incorporated"; stockId: "QCOM"} - ListElement {name: "Research in Motion Limited"; stockId: "RIMM"} - ListElement {name: "Ross Stores Inc."; stockId: "ROST"} - ListElement {name: "SanDisk Corporation"; stockId: "SNDK"} - ListElement {name: "Seagate Technology Holdings"; stockId: "STX"} - ListElement {name: "Sears Holdings Corporation"; stockId: "SHLD"} - ListElement {name: "Sigma-Aldrich Corporation"; stockId: "SIAL"} - ListElement {name: "Staples Inc."; stockId: "SPLS"} - ListElement {name: "Starbucks Corporation"; stockId: "SBUX"} - ListElement {name: "Stericycle, Inc"; stockId: "SRCL"} - ListElement {name: "Symantec Corporation"; stockId: "SYMC"} - ListElement {name: "Teva Pharmaceutical Industries Ltd."; stockId: "TEVA"} - ListElement {name: "Urban Outfitters, Inc."; stockId: "URBN"} - ListElement {name: "VeriSign, Inc."; stockId: "VRSN"} - ListElement {name: "Vertex Pharmaceuticals"; stockId: "VRTX"} - ListElement {name: "Virgin Media, Inc."; stockId: "VMED"} - ListElement {name: "Vodafone Group, plc."; stockId: "VOD"} - ListElement {name: "Warner Chilcott, Ltd."; stockId: "WCRX"} - ListElement {name: "Whole Foods Market, Inc."; stockId: "WFM"} - ListElement {name: "Wynn Resorts Ltd."; stockId: "WYNN"} - ListElement {name: "Xilinx, Inc."; stockId: "XLNX"} - ListElement {name: "Yahoo! Inc."; stockId: "YHOO"} + ListElement {name: "Apple Inc."; stockId: "AAPL"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Adobe Systems Inc."; stockId: "ADBE"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Analog Devices, Inc."; stockId: "ADI"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Automatic Data Processing, Inc."; stockId: "ADP"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Autodesk, Inc."; stockId: "ADSK"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Akamai Technologies, Inc."; stockId: "AKAM"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Altera Corp."; stockId: "ALTR"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Alexion Pharmaceuticals, Inc."; stockId: "ALXN"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Applied Materials, Inc."; stockId: "AMAT"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Amgen Inc."; stockId: "AMGN"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Amazon.com Inc."; stockId: "AMZN"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Activision Blizzard, Inc."; stockId: "ATVI"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Avago Technologies Limited"; stockId: "AVGO"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Bed Bath & Beyond Inc."; stockId: "BBBY"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Baidu, Inc."; stockId: "BIDU"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Biogen Idec Inc."; stockId: "BIIB"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Broadcom Corp."; stockId: "BRCM"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "CA Technologies"; stockId: "CA"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Celgene Corporation"; stockId: "CELG"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Cerner Corporation"; stockId: "CERN"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Check Point Software Technologies Ltd."; stockId: "CHKP"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "CH Robinson Worldwide Inc."; stockId: "CHRW"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Charter Communications, Inc."; stockId: "CHTR"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Comcast Corporation"; stockId: "CMCSA"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Costco Wholesale Corporation"; stockId: "COST"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Cisco Systems, Inc."; stockId: "CSCO"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Catamaran Corporation"; stockId: "CTRX"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Cognizant Technology Solutions Corporation"; stockId: "CTSH"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Citrix Systems, Inc."; stockId: "CTXS"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Discovery Communications, Inc."; stockId: "DISCA"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Dish Network Corp."; stockId: "DISH"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Dollar Tree, Inc."; stockId: "DLTR"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "DIRECTV"; stockId: "DTV"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "eBay Inc."; stockId: "EBAY"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Equinix, Inc."; stockId: "EQIX"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Express Scripts Holding Company"; stockId: "ESRX"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Expeditors International of Washington Inc."; stockId: "EXPD"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Expedia Inc."; stockId: "EXPE"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Fastenal Company"; stockId: "FAST"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Facebook, Inc."; stockId: "FB"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "F5 Networks, Inc."; stockId: "FFIV"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Fiserv, Inc."; stockId: "FISV"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Twenty-First Century Fox, Inc."; stockId: "FOXA"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Gilead Sciences Inc."; stockId: "GILD"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Keurig Green Mountain, Inc."; stockId: "GMCR"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Google Inc."; stockId: "GOOG"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Google Inc."; stockId: "GOOGL"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Garmin Ltd."; stockId: "GRMN"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Henry Schein, Inc."; stockId: "HSIC"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Illumina Inc."; stockId: "ILMN"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Intel Corporation"; stockId: "INTC"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Intuit Inc."; stockId: "INTU"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Intuitive Surgical, Inc."; stockId: "ISRG"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "KLA-Tencor Corporation"; stockId: "KLAC"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Kraft Foods Group, Inc."; stockId: "KRFT"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Liberty Global plc"; stockId: "LBTYA"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Liberty Interactive Corporation"; stockId: "LINTA"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Linear Technology Corporation"; stockId: "LLTC"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Liberty Media Corporation"; stockId: "LMCA"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Marriott International, Inc."; stockId: "MAR"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Mattel, Inc"; stockId: "MAT"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Mondelez International, Inc."; stockId: "MDLZ"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Monster Beverage Corporation"; stockId: "MNST"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Microsoft Corporation"; stockId: "MSFT"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Micron Technology Inc."; stockId: "MU"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Maxim Integrated Products, Inc."; stockId: "MXIM"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Mylan, Inc."; stockId: "MYL"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Netflix, Inc."; stockId: "NFLX"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "NetApp, Inc."; stockId: "NTAP"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "NVIDIA Corporation"; stockId: "NVDA"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "NXP Semiconductors NV"; stockId: "NXPI"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "O'Reilly Automotive Inc."; stockId: "ORLY"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Paychex, Inc."; stockId: "PAYX"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "PACCAR Inc."; stockId: "PCAR"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "The Priceline Group Inc."; stockId: "PCLN"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "QUALCOMM Incorporated"; stockId: "QCOM"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Regeneron Pharmaceuticals, Inc."; stockId: "REGN"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Ross Stores Inc."; stockId: "ROST"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "SBA Communications Corp."; stockId: "SBAC"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Starbucks Corporation"; stockId: "SBUX"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Sigma-Aldrich Corporation"; stockId: "SIAL"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Sirius XM Holdings Inc."; stockId: "SIRI"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "SanDisk Corp."; stockId: "SNDK"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Staples, Inc."; stockId: "SPLS"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Stericycle, Inc."; stockId: "SRCL"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Seagate Technology Public Limited Company"; stockId: "STX"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Symantec Corporation"; stockId: "SYMC"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "TripAdvisor Inc."; stockId: "TRIP"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Tractor Supply Company"; stockId: "TSCO"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Tesla Motors, Inc."; stockId: "TSLA"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Texas Instruments Inc."; stockId: "TXN"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Viacom, Inc."; stockId: "VIAB"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "VimpelCom Ltd."; stockId: "VIP"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Vodafone Group Public Limited Company"; stockId: "VOD"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Verisk Analytics, Inc."; stockId: "VRSK"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Vertex Pharmaceuticals Incorporated"; stockId: "VRTX"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Western Digital Corporation"; stockId: "WDC"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Whole Foods Market, Inc."; stockId: "WFM"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Wynn Resorts Ltd."; stockId: "WYNN"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} + ListElement {name: "Xilinx Inc."; stockId: "XLNX"; value: "0.0"; change: "0.0"; changePercentage: "0.0"} } diff --git a/examples/quick/demos/stocqt/content/StockListView.qml b/examples/quick/demos/stocqt/content/StockListView.qml index 3345e5d804..72d8df2440 100644 --- a/examples/quick/demos/stocqt/content/StockListView.qml +++ b/examples/quick/demos/stocqt/content/StockListView.qml @@ -43,8 +43,10 @@ import QtQuick 2.0 Rectangle { id: root width: 320 - height: 480 - color: "#423A2F" + height: 410 + anchors.top: parent.top + anchors.bottom: parent.bottom + color: "white" property string currentStockId: "" property string currentStockName: "" @@ -52,39 +54,196 @@ Rectangle { ListView { id: view anchors.fill: parent + width: parent.width + clip: true keyNavigationWraps: true + highlightMoveDuration: 0 focus: true snapMode: ListView.SnapToItem model: StockListModel{} + function requestUrl(stockId) { + var endDate = new Date(""); //today + var startDate = new Date() + startDate.setDate(startDate.getDate() - 5); + + var request = "http://ichart.finance.yahoo.com/table.csv?"; + request += "s=" + stockId; + request += "&g=d"; + request += "&a=" + startDate.getMonth(); + request += "&b=" + startDate.getDate(); + request += "&c=" + startDate.getFullYear(); + request += "&d=" + endDate.getMonth(); + request += "&e=" + endDate.getDate(); + request += "&f=" + endDate.getFullYear(); + request += "&g=d"; + request += "&ignore=.csv"; + return request; + } + + function getCloseValue(index) { + var req = requestUrl(model.get(index).stockId); + + if (!req) + return; + + var xhr = new XMLHttpRequest; + + xhr.open("GET", req, true); + + xhr.onreadystatechange = function() { + if (xhr.readyState === XMLHttpRequest.LOADING || xhr.readyState === XMLHttpRequest.DONE) { + var records = xhr.responseText.split('\n'); + if (records.length > 0) { + var r = records[1].split(','); + model.setProperty(index, "value", r[4]); + + var today = parseFloat(r[4]); + r = records[2].split(','); + var yesterday = parseFloat(r[4]); + var change = today - yesterday; + if (change >= 0.0) + model.setProperty(index, "change", "+" + change.toFixed(2)); + else + model.setProperty(index, "change", change.toFixed(2)); + + var changePercentage = (change / yesterday) * 100.0; + if (changePercentage >= 0.0) + model.setProperty(index, "changePercentage", "+" + changePercentage.toFixed(2) + "%"); + else + model.setProperty(index, "changePercentage", changePercentage.toFixed(2) + "%"); + } + } + } + xhr.send() + } + onCurrentIndexChanged: { + mainRect.listViewActive = 0; root.currentStockId = model.get(currentIndex).stockId; root.currentStockName = model.get(currentIndex).name; - console.log("current stock:" + root.currentStockId + " - " + root.currentStockName); } delegate: Rectangle { - height: 30 + height: 102 width: parent.width color: "transparent" MouseArea { anchors.fill: parent; - onClicked:view.currentIndex = index; + onClicked: { + view.currentIndex = index; + } } Text { - anchors.verticalCenter: parent.top - anchors.verticalCenterOffset : 15 - color: index == view.currentIndex ? "#ECC089" : "#A58963" - font.pointSize: 12 + id: stockIdText + anchors.top: parent.top + anchors.topMargin: 15 + anchors.left: parent.left + anchors.leftMargin: 15 + width: 125 + height: 40 + color: "#000000" + font.family: "Open Sans" + font.pointSize: 20 + font.weight: Font.Bold + verticalAlignment: Text.AlignVCenter + text: stockId + } + + Text { + id: stockValueText + anchors.top: parent.top + anchors.topMargin: 15 + anchors.right: parent.right + anchors.rightMargin: 0.31 * parent.width + width: 190 + height: 40 + color: "#000000" + font.family: "Open Sans" + font.pointSize: 20 font.bold: true - text:" " + stockId + " - " + name + horizontalAlignment: Text.AlignRight + verticalAlignment: Text.AlignVCenter + text: value + Component.onCompleted: view.getCloseValue(index); + } + + Text { + id: stockValueChangeText + anchors.top: parent.top + anchors.topMargin: 15 + anchors.right: parent.right + anchors.rightMargin: 20 + width: 135 + height: 40 + color: "#328930" + font.family: "Open Sans" + font.pointSize: 20 + font.bold: true + horizontalAlignment: Text.AlignRight + verticalAlignment: Text.AlignVCenter + text: change + onTextChanged: { + if (parseFloat(text) >= 0.0) + color = "#328930"; + else + color = "#d40000"; + } + } + + Text { + id: stockNameText + anchors.top: stockIdText.bottom + anchors.left: parent.left + anchors.leftMargin: 15 + width: 330 + height: 30 + color: "#000000" + font.family: "Open Sans" + font.pointSize: 16 + font.bold: false + elide: Text.ElideRight + maximumLineCount: 1 + verticalAlignment: Text.AlignVCenter + text: name + } + + Text { + id: stockValueChangePercentageText + anchors.top: stockIdText.bottom + anchors.right: parent.right + anchors.rightMargin: 20 + width: 120 + height: 30 + color: "#328930" + font.family: "Open Sans" + font.pointSize: 18 + font.bold: false + horizontalAlignment: Text.AlignRight + verticalAlignment: Text.AlignVCenter + text: changePercentage + onTextChanged: { + if (parseFloat(text) >= 0.0) + color = "#328930"; + else + color = "#d40000"; + } + } + + Rectangle { + id: endingLine + anchors.bottom: parent.bottom + anchors.left: parent.left + height: 1 + width: parent.width + color: "#d7d7d7" } } highlight: Rectangle { width: parent.width - color: "#662" + color: "#eeeeee" } } } diff --git a/examples/quick/demos/stocqt/content/StockModel.qml b/examples/quick/demos/stocqt/content/StockModel.qml index f9ed9c87d4..682c96bb53 100644 --- a/examples/quick/demos/stocqt/content/StockModel.qml +++ b/examples/quick/demos/stocqt/content/StockModel.qml @@ -44,8 +44,6 @@ ListModel { id: model property string stockId: "" property string stockName: "" - property var startDate - property var endDate property string stockDataCycle: "d" property bool ready: false property real stockPrice: 0.0 @@ -56,19 +54,28 @@ ListModel { signal dataReady function indexOf(date) { - var end = new Date(model.get(0).date); - var start = new Date(model.get(model.count - 1).date); - if (end <= date) - return model.count -1; + var newest = new Date(model.get(0).date); + var oldest = new Date(model.get(model.count - 1).date); + if (newest <= date) + return -1; - if (start >= date) - return 0; + if (oldest >= date) + return model.count - 1; + var currDiff = 0; + var bestDiff = Math.abs(date.getTime() - newest.getTime()); + var retval = 0; for (var i = 0; i < model.count; i++) { var d = new Date(model.get(i).date); - if ( d === date) - return i; + currDiff = Math.abs(d.getTime() - date.getTime()); + if (currDiff < bestDiff) { + bestDiff = currDiff; + retval = i; + } + if (currDiff > bestDiff) + return retval; } + return -1; } @@ -76,11 +83,9 @@ ListModel { if (stockId === "") return; - if (startDate === undefined) - startDate = new Date(1995, 3, 25); //default: 25 April 1995 + var startDate = new Date(2011, 4, 25); - if (endDate === undefined) - endDate = new Date(); //today + var endDate = new Date(); //today if (stockDataCycle !== "d" && stockDataCycle !== "w" && stockDataCycle !== "m") stockDataCycle = "d"; @@ -94,11 +99,11 @@ ListModel { */ var request = "http://ichart.finance.yahoo.com/table.csv?"; request += "s=" + stockId; - request += "&a=" + startDate.getDate(); - request += "&b=" + startDate.getMonth(); + request += "&a=" + startDate.getMonth(); + request += "&b=" + startDate.getDate(); request += "&c=" + startDate.getFullYear(); - request += "&d=" + endDate.getDate(); - request += "&e=" + endDate.getMonth(); + request += "&d=" + endDate.getMonth(); + request += "&e=" + endDate.getDate(); request += "&f=" + endDate.getFullYear(); request += "&g=" + stockDataCycle; request += "&ignore=.csv"; @@ -133,6 +138,10 @@ ListModel { model.ready = false; model.clear(); + + highestPrice = 0; + highestVolume = 0; + var i = 1; //skip the first line xhr.onreadystatechange = function() { if (xhr.readyState === XMLHttpRequest.LOADING || xhr.readyState === XMLHttpRequest.DONE) { diff --git a/examples/quick/demos/stocqt/content/StockSettings.qml b/examples/quick/demos/stocqt/content/StockSettings.qml deleted file mode 100644 index 07152410fa..0000000000 --- a/examples/quick/demos/stocqt/content/StockSettings.qml +++ /dev/null @@ -1,216 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies). -** Contact: http://www.qt-project.org/legal -** -** 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 Digia Plc 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 - -Rectangle { - id: root - width: 320 - height: 480 - color: "#423A2F" - property var startDate : startDatePicker.date - property var endDate : endDatePicker.date - - property bool drawHighPrice: highButton.buttonEnabled - property bool drawLowPrice: lowButton.buttonEnabled - property bool drawOpenPrice: openButton.buttonEnabled - property bool drawClosePrice: closeButton.buttonEnabled - property bool drawVolume: volumeButton.buttonEnabled - property bool drawKLine: klineButton.buttonEnabled - - property color highColor: Qt.rgba(1, 0, 0, 1) - property color lowColor: Qt.rgba(0, 1, 0, 1) - property color openColor: Qt.rgba(0, 0, 1, 1) - property color volumeColor: Qt.rgba(0.3, 0.5, 0.7, 1) - property color closeColor: "#ecc088" - - property string chartType: "year" - - Image { - id: logo - source: "images/logo.png" - anchors.horizontalCenter : parent.horizontalCenter - anchors.top: parent.top - anchors.topMargin: 15 - } - - Text { - id: startDateText - text: "START DATE:" - color: "#76644A" - font.pointSize: 15 - anchors.left: parent.left - anchors.leftMargin: 20 - anchors.top: logo.bottom - anchors.topMargin: 20 - } - - DatePicker { - id: startDatePicker - anchors.left: parent.left - anchors.leftMargin: 30 - anchors.top: startDateText.bottom - anchors.topMargin: 8 - } - - Text { - id: endDateText - text: "END DATE:" - color: "#76644A" - font.pointSize: 15 - anchors.left: parent.left - anchors.leftMargin: 20 - anchors.top: startDatePicker.bottom - anchors.topMargin: 20 - } - - DatePicker { - id: endDatePicker - anchors.left: parent.left - anchors.leftMargin: 30 - anchors.top: endDateText.bottom - anchors.topMargin: 8 - } - - Text { - id: drawOptionsText - text: "DRAW OPTIONS:" - color: "#76644A" - font.pointSize: 15 - anchors.left: parent.left - anchors.leftMargin: 20 - anchors.top: endDatePicker.bottom - anchors.topMargin: 20 - } - Column { - id: drawOptions - anchors.top: drawOptionsText.bottom - anchors.topMargin: 8 - anchors.left: parent.left - anchors.leftMargin: 30 - spacing: 2 - - Row { - spacing: 10 - - CheckBox { - id: highButton - text: "High" - buttonEnabled: false - } - CheckBox { - id: lowButton - text: "Low" - buttonEnabled: false - } - } - Row { - spacing: 10 - CheckBox { - id: openButton - text: "Open" - buttonEnabled: false - } - CheckBox { - text: "Close" - id: closeButton - buttonEnabled: true - } - - } - Row { - spacing: 10 - CheckBox { - id: volumeButton - text: "Volume" - buttonEnabled: true - } - CheckBox { - id: klineButton - text: "K Line" - buttonEnabled: false - } - } - } - - Text { - id: chartTypeText - text: "SHOW PREVIOUS:" - color: "#76644A" - font.pointSize: 15 - anchors.left: parent.left - anchors.leftMargin: 20 - anchors.top: drawOptions.bottom - anchors.topMargin: 20 - } - Row { - anchors.left: parent.left - anchors.leftMargin: 20 - anchors.top: chartTypeText.bottom - anchors.topMargin: 8 - spacing: -1 - Button { - id: yearView - text: "YEAR" - buttonEnabled: root.chartType == "year" - onClicked: root.chartType = "year" - } - Button { - id: monthView - text: "MONTH" - buttonEnabled: root.chartType == "month" - onClicked: root.chartType = "month" - } - Button { - id: weekView - text: "WEEK" - buttonEnabled: root.chartType == "week" - onClicked: root.chartType = "week" - } - Button { - id: allView - text: "ALL" - buttonEnabled: root.chartType == "all" - onClicked: root.chartType = "all" - } - } - - Component.onCompleted: startDatePicker.date = new Date(1995, 3, 25) -} diff --git a/examples/quick/demos/stocqt/content/StockSettingsPanel.qml b/examples/quick/demos/stocqt/content/StockSettingsPanel.qml new file mode 100644 index 0000000000..055d15e1b1 --- /dev/null +++ b/examples/quick/demos/stocqt/content/StockSettingsPanel.qml @@ -0,0 +1,174 @@ +/**************************************************************************** +** +** Copyright (C) 2014 Digia Plc and/or its subsidiary(-ies). +** Contact: http://www.qt-project.org/legal +** +** 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 Digia Plc 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 + +Rectangle { + id: root + width: 440 + height: 160 + color: "transparent" + + property bool drawOpenPrice: openButton.buttonEnabled + property bool drawClosePrice: closeButton.buttonEnabled + property bool drawHighPrice: highButton.buttonEnabled + property bool drawLowPrice: lowButton.buttonEnabled + + property string openColor: "#face20" + property string closeColor: "#14aaff" + property string highColor: "#80c342" + property string lowColor: "#f30000" + property string volumeColor: "#14aaff" + + Text { + id: openText + anchors.left: root.left + anchors.top: root.top + color: "#000000" + font.family: "Open Sans" + font.pointSize: 19 + text: "Open" + } + + Text { + id: closeText + anchors.left: root.left + anchors.top: openText.bottom + anchors.topMargin: 10 + color: "#000000" + font.family: "Open Sans" + font.pointSize: 19 + text: "Close" + } + + Text { + id: highText + anchors.left: root.left + anchors.top: closeText.bottom + anchors.topMargin: 10 + color: "#000000" + font.family: "Open Sans" + font.pointSize: 19 + text: "High" + } + + Text { + id: lowText + anchors.left: root.left + anchors.top: highText.bottom + anchors.topMargin: 10 + color: "#000000" + font.family: "Open Sans" + font.pointSize: 19 + text: "Low" + } + + Rectangle { + height: 4 + anchors.left: root.left + anchors.leftMargin: 114 + anchors.right: openButton.left + anchors.rightMargin: 65 + anchors.verticalCenter: openText.verticalCenter + color: openColor + } + + Rectangle { + height: 4 + anchors.left: root.left + anchors.leftMargin: 114 + anchors.right: closeButton.left + anchors.rightMargin: 65 + anchors.verticalCenter: closeText.verticalCenter + color: closeColor + } + + Rectangle { + height: 4 + anchors.left: root.left + anchors.leftMargin: 114 + anchors.right: highButton.left + anchors.rightMargin: 65 + anchors.verticalCenter: highText.verticalCenter + color: highColor + } + + Rectangle { + height: 4 + anchors.left: root.left + anchors.leftMargin: 114 + anchors.right: lowButton.left + anchors.rightMargin: 65 + anchors.verticalCenter: lowText.verticalCenter + color: lowColor + } + + CheckBox { + id: openButton + buttonEnabled: false + anchors.verticalCenter: openText.verticalCenter + anchors.right: root.right + anchors.rightMargin: 40 + } + + CheckBox { + id: closeButton + buttonEnabled: false + anchors.verticalCenter: closeText.verticalCenter + anchors.right: root.right + anchors.rightMargin: 40 + } + + CheckBox { + id: highButton + buttonEnabled: true + anchors.verticalCenter: highText.verticalCenter + anchors.right: root.right + anchors.rightMargin: 40 + } + + CheckBox { + id: lowButton + buttonEnabled: true + anchors.verticalCenter: lowText.verticalCenter + anchors.right: root.right + anchors.rightMargin: 40 + } +} diff --git a/examples/quick/demos/stocqt/content/StockView.qml b/examples/quick/demos/stocqt/content/StockView.qml index ce55fdf3d3..e503cbea04 100644 --- a/examples/quick/demos/stocqt/content/StockView.qml +++ b/examples/quick/demos/stocqt/content/StockView.qml @@ -39,95 +39,63 @@ ****************************************************************************/ import QtQuick 2.0 +import QtQuick.Window 2.1 Rectangle { id: root width: 320 height: 480 - color: "#423A2F" + color: "transparent" property var stock: null property var stocklist: null - property var settings: null - signal listViewClicked signal settingsClicked function update() { - if (!settings) - return; - chart.endDate = settings.endDate chart.update() } Rectangle { - color: "#272822" + id: mainRect + color: "transparent" anchors.fill: parent - radius: 20 - Image { - source: "images/icon-items.png" + StockInfo { + id: stockInfo anchors.left: parent.left anchors.leftMargin: 10 anchors.top: parent.top - anchors.topMargin: 10 - MouseArea { - anchors.fill: parent - onClicked: listViewClicked() - } - } - Image { - source: "images/icon-settings.png" - anchors.right: parent.right - anchors.rightMargin: 10 - anchors.top: parent.top - anchors.topMargin: 10 - MouseArea { - anchors.fill: parent - onClicked: settingsClicked() - } - } - - Text { - id: desc - anchors.left: parent.left - anchors.leftMargin: 20 - anchors.top: parent.top - anchors.topMargin: 40 - color: "#564c3A" - font.pointSize: 15 - text: root.stock.stockId + " - " + root.stock.stockName + anchors.topMargin: 15 + height: 160 + anchors.right: Screen.primaryOrientation === Qt.PortraitOrientation ? parent.right : chart.left + anchors.rightMargin: 20 + stock: root.stock } - Text { - id: price - anchors.left: parent.left - anchors.leftMargin: 20 - anchors.top: desc.bottom - anchors.topMargin: 5 - color: "#ECC089" - font.pointSize: 30 - text: root.stock.stockPrice + StockChart { + id: chart + anchors.bottom: Screen.primaryOrientation === Qt.PortraitOrientation ? settingsPanel.top : parent.bottom + anchors.bottomMargin: 20 + anchors.top : Screen.primaryOrientation === Qt.PortraitOrientation ? stockInfo.bottom : parent.top + anchors.topMargin: 20 + anchors.right: parent.right + anchors.rightMargin: 20 + width: Screen.primaryOrientation === Qt.PortraitOrientation ? parent.width - 40 : 0.6 * parent.width + stockModel: root.stock + settings: settingsPanel } - Text { - id: priceChange + StockSettingsPanel { + id: settingsPanel anchors.left: parent.left anchors.leftMargin: 20 - anchors.top: price.bottom - anchors.topMargin: 5 - color: root.stock.stockPriceChanged < 0 ? "#A43D3D" : "#679B3A" - font.pointSize: 25 - text: root.stock.stockPriceChanged + " (" + Math.abs(Math.round(root.stock.stockPriceChanged/(root.stock.stockPrice - root.stock.stockPriceChanged) * 100))/100 +"%)" - } - - StockChart { - id: chart + anchors.right: Screen.primaryOrientation === Qt.PortraitOrientation ? parent.right : chart.left + anchors.rightMargin: 20 anchors.bottom: parent.bottom - anchors.top : priceChange.bottom - anchors.topMargin: 30 - width: parent.width - stockModel: root.stock - settings: root.settings + onDrawOpenPriceChanged: root.update() + onDrawClosePriceChanged: root.update(); + onDrawHighPriceChanged: root.update(); + onDrawLowPriceChanged: root.update(); } } } diff --git a/examples/quick/demos/stocqt/content/images/icon-calendar-anim.png b/examples/quick/demos/stocqt/content/images/icon-calendar-anim.png deleted file mode 100644 index c5164d5183..0000000000 Binary files a/examples/quick/demos/stocqt/content/images/icon-calendar-anim.png and /dev/null differ diff --git a/examples/quick/demos/stocqt/content/images/icon-calendar.png b/examples/quick/demos/stocqt/content/images/icon-calendar.png deleted file mode 100644 index bd2857470b..0000000000 Binary files a/examples/quick/demos/stocqt/content/images/icon-calendar.png and /dev/null differ diff --git a/examples/quick/demos/stocqt/content/images/icon-items.png b/examples/quick/demos/stocqt/content/images/icon-items.png deleted file mode 100644 index f951aa5009..0000000000 Binary files a/examples/quick/demos/stocqt/content/images/icon-items.png and /dev/null differ diff --git a/examples/quick/demos/stocqt/content/images/icon-left-arrow.png b/examples/quick/demos/stocqt/content/images/icon-left-arrow.png new file mode 100644 index 0000000000..7868e8ab31 Binary files /dev/null and b/examples/quick/demos/stocqt/content/images/icon-left-arrow.png differ diff --git a/examples/quick/demos/stocqt/content/images/icon-settings.png b/examples/quick/demos/stocqt/content/images/icon-settings.png deleted file mode 100644 index 222d998289..0000000000 Binary files a/examples/quick/demos/stocqt/content/images/icon-settings.png and /dev/null differ diff --git a/examples/quick/demos/stocqt/content/images/logo.png b/examples/quick/demos/stocqt/content/images/logo.png deleted file mode 100644 index 90c7c3ba3d..0000000000 Binary files a/examples/quick/demos/stocqt/content/images/logo.png and /dev/null differ diff --git a/examples/quick/demos/stocqt/doc/images/qtquick-demo-stocqt.png b/examples/quick/demos/stocqt/doc/images/qtquick-demo-stocqt.png index 1783881e1f..550c2a8a22 100644 Binary files a/examples/quick/demos/stocqt/doc/images/qtquick-demo-stocqt.png and b/examples/quick/demos/stocqt/doc/images/qtquick-demo-stocqt.png differ diff --git a/examples/quick/demos/stocqt/stocqt.pro b/examples/quick/demos/stocqt/stocqt.pro index efe37cb722..0e89a30050 100644 --- a/examples/quick/demos/stocqt/stocqt.pro +++ b/examples/quick/demos/stocqt/stocqt.pro @@ -3,6 +3,7 @@ TEMPLATE = app QT += qml quick SOURCES += main.cpp RESOURCES += stocqt.qrc +OTHER_FILES += *.qml content/*.qml content/images/*.png target.path = $$[QT_INSTALL_EXAMPLES]/quick/demos/stocqt INSTALLS += target diff --git a/examples/quick/demos/stocqt/stocqt.qml b/examples/quick/demos/stocqt/stocqt.qml index 3e231ab8bf..d4a188d0d2 100644 --- a/examples/quick/demos/stocqt/stocqt.qml +++ b/examples/quick/demos/stocqt/stocqt.qml @@ -42,67 +42,103 @@ import QtQuick 2.0 import QtQml.Models 2.1 import "./content" -ListView { - id: root - width: 320 - height: 480 - snapMode: ListView.SnapOneItem - focus: false - orientation: ListView.Horizontal - boundsBehavior: Flickable.StopAtBounds - currentIndex: 1 +Rectangle { + id: mainRect + width: 1000 + height: 700 - Timer { - id: updateTimer - interval: 500 - onTriggered: stock.updateStock() - } + property int listViewActive: 0 + + Rectangle { + id: banner + height: 80 + anchors.top: parent.top + width: parent.width + color: "#000000" - StockModel { - id: stock - stockId: listView.currentStockId - stockName: listView.currentStockName - startDate: settings.startDate - endDate: settings.endDate - onStockIdChanged: updateTimer.restart() - onStartDateChanged: updateTimer.restart() - onEndDateChanged: updateTimer.restart() - onDataReady: { - root.positionViewAtIndex(1, ListView.SnapPosition) - stockView.update() + Image { + id: arrow + source: "./content/images/icon-left-arrow.png" + anchors.left: banner.left + anchors.leftMargin: 20 + anchors.verticalCenter: banner.verticalCenter + visible: root.currentIndex == 1 ? true : false + + MouseArea { + anchors.fill: parent + onClicked: listViewActive = 1; + } } - } - model: ObjectModel { - StockListView { - id: listView - width: root.width - height: root.height + Item { + id: textItem + width: stocText.width + qtText.width + height: stocText.height + qtText.height + anchors.horizontalCenter: banner.horizontalCenter + anchors.verticalCenter: banner.verticalCenter + + Text { + id: stocText + anchors.verticalCenter: textItem.verticalCenter + color: "#ffffff" + font.family: "Abel" + font.pointSize: 40 + text: "Stoc" + } + Text { + id: qtText + anchors.verticalCenter: textItem.verticalCenter + anchors.left: stocText.right + color: "#5caa15" + font.family: "Abel" + font.pointSize: 40 + text: "Qt" + } } + } - StockView { - id: stockView - width: root.width - height: root.height - stocklist: listView - settings: settings - stock: stock + ListView { + id: root + width: parent.width + anchors.top: banner.bottom + anchors.bottom: parent.bottom + snapMode: ListView.SnapOneItem + highlightRangeMode: ListView.StrictlyEnforceRange + highlightMoveDuration: 250 + focus: false + orientation: ListView.Horizontal + boundsBehavior: Flickable.StopAtBounds + currentIndex: listViewActive == 0 ? 1 : 0 + onCurrentIndexChanged: { + if (currentIndex == 1) + listViewActive = 0; + } - onListViewClicked: root.currentIndex = 0 - onSettingsClicked: root.currentIndex = 2 + StockModel { + id: stock + stockId: listView.currentStockId + stockName: listView.currentStockName + onStockIdChanged: stock.updateStock(); + onDataReady: { + root.positionViewAtIndex(1, ListView.SnapPosition) + stockView.update() + } } - StockSettings { - id: settings - width: root.width - height: root.height - onDrawHighPriceChanged: stockView.update() - onDrawLowPriceChanged: stockView.update() - onDrawOpenPriceChanged: stockView.update() - onDrawClosePriceChanged: stockView.update() - onDrawVolumeChanged: stockView.update() - onDrawKLineChanged: stockView.update() - onChartTypeChanged: stockView.update() + model: ObjectModel { + StockListView { + id: listView + width: root.width + height: root.height + } + + StockView { + id: stockView + width: root.width + height: root.height + stocklist: listView + stock: stock + } } } } diff --git a/examples/quick/demos/stocqt/stocqt.qrc b/examples/quick/demos/stocqt/stocqt.qrc index 8885aaa807..ee5dd0c24f 100644 --- a/examples/quick/demos/stocqt/stocqt.qrc +++ b/examples/quick/demos/stocqt/stocqt.qrc @@ -3,19 +3,15 @@ stocqt.qml content/Button.qml content/CheckBox.qml - content/DatePicker.qml content/StockChart.qml content/StockListModel.qml content/StockListView.qml content/StockModel.qml - content/StockSettings.qml content/StockView.qml - content/images/icon-calendar-anim.png - content/images/icon-calendar.png - content/images/icon-items.png - content/images/icon-settings.png - content/images/logo.png content/images/wheel-touch.png content/images/wheel.png + content/images/icon-left-arrow.png + content/StockSettingsPanel.qml + content/StockInfo.qml -- cgit v1.2.3