##// END OF EJS Templates
Improving QML chart properties tester usability
Tero Ahola -
r1930:54618a4a89cc
parent child
Show More
@@ -0,0 +1,35
1 /****************************************************************************
2 **
3 ** Copyright (C) 2012 Digia Plc
4 ** All rights reserved.
5 ** For any questions to Digia, please use contact form at http://qt.digia.com
6 **
7 ** This file is part of the Qt Commercial Charts Add-on.
8 **
9 ** $QT_BEGIN_LICENSE$
10 ** Licensees holding valid Qt Commercial licenses may use this file in
11 ** accordance with the Qt Commercial License Agreement provided with the
12 ** Software or, alternatively, in accordance with the terms contained in
13 ** a written agreement between you and Digia.
14 **
15 ** If you have questions regarding the use of this file, please use
16 ** contact form at http://qt.digia.com
17 ** $QT_END_LICENSE$
18 **
19 ****************************************************************************/
20
21 import QtQuick 1.0
22
23 Flow {
24 property variant chart
25 anchors.fill: parent
26 flow: Flow.TopToBottom
27 spacing: 5
28
29 FontEditor {
30 fontDescription: "title"
31 function editedFont() {
32 return chart.titleFont;
33 }
34 }
35 }
@@ -23,12 +23,24 import QtQuick 1.0
23 Item {
23 Item {
24 id: chartEditor
24 id: chartEditor
25 property variant series // TODO: rename to chart
25 property variant series // TODO: rename to chart
26 onSeriesChanged: loader.item.chart = series;
26 onSeriesChanged: {
27 if (loader.item != undefined)
28 loader.item.chart = series;
29 }
30
31 function selectButton(button) {
32 chartButton.color = "#79bd8f";
33 titleButton.color = "#79bd8f";
34 legendButton.color = "#79bd8f";
35 axisXButton.color = "#79bd8f";
36 axisYButton.color = "#79bd8f";
37 button.color = "#00a388";
38 }
27
39
28 Flow {
40 Flow {
29 id: selectorFlow
41 id: selectorFlow
30 anchors.top: parent.top
42 anchors.top: parent.top
31 height: 60
43 height: 90
32 anchors.left: parent.left
44 anchors.left: parent.left
33 anchors.right: parent.right
45 anchors.right: parent.right
34 spacing: 5
46 spacing: 5
@@ -39,11 +51,18 Item {
39 text: "Chart properties"
51 text: "Chart properties"
40 unpressedColor: "#79bd8f"
52 unpressedColor: "#79bd8f"
41 onClicked: {
53 onClicked: {
42 color = "#00a388";
54 selectButton(chartButton);
43 legendButton.color = "#79bd8f";
55 loader.source = "ChartEditorProperties.qml";
44 axisXButton.color = "#79bd8f";
56 loader.item.chart = series;
45 axisYButton.color = "#79bd8f";
57 }
46 loader.source = "ChartEditor1.qml";
58 }
59 Button {
60 id: titleButton
61 text: "Title properties"
62 unpressedColor: "#79bd8f"
63 onClicked: {
64 selectButton(titleButton);
65 loader.source = "ChartEditorTitle.qml";
47 loader.item.chart = series;
66 loader.item.chart = series;
48 }
67 }
49 }
68 }
@@ -52,11 +71,8 Item {
52 text: "Legend properties"
71 text: "Legend properties"
53 unpressedColor: "#79bd8f"
72 unpressedColor: "#79bd8f"
54 onClicked: {
73 onClicked: {
55 color = "#00a388";
74 selectButton(legendButton);
56 chartButton.color = "#79bd8f";
75 loader.source = "ChartEditorLegend.qml";
57 axisXButton.color = "#79bd8f";
58 axisYButton.color = "#79bd8f";
59 loader.source = "ChartEditor2.qml";
60 loader.item.chartLegend = series.legend;
76 loader.item.chartLegend = series.legend;
61 }
77 }
62 }
78 }
@@ -65,11 +81,8 Item {
65 text: "Axis X properties"
81 text: "Axis X properties"
66 unpressedColor: "#79bd8f"
82 unpressedColor: "#79bd8f"
67 onClicked: {
83 onClicked: {
68 color = "#00a388";
84 selectButton(axisXButton);
69 chartButton.color = "#79bd8f";
85 loader.source = "ChartEditorAxis.qml";
70 legendButton.color = "#79bd8f";
71 axisYButton.color = "#79bd8f";
72 loader.source = "ChartEditor3.qml";
73 loader.item.axis = series.axisX;
86 loader.item.axis = series.axisX;
74 }
87 }
75 }
88 }
@@ -78,11 +91,8 Item {
78 text: "Axis Y properties"
91 text: "Axis Y properties"
79 unpressedColor: "#79bd8f"
92 unpressedColor: "#79bd8f"
80 onClicked: {
93 onClicked: {
81 color = "#00a388";
94 selectButton(axisYButton);
82 chartButton.color = "#79bd8f";
95 loader.source = "ChartEditorAxis.qml";
83 legendButton.color = "#79bd8f";
84 axisXButton.color = "#79bd8f";
85 loader.source = "ChartEditor3.qml";
86 loader.item.axis = series.axisY;
96 loader.item.axis = series.axisY;
87 }
97 }
88 }
98 }
@@ -95,5 +105,4 Item {
95 anchors.left: parent.left
105 anchors.left: parent.left
96 anchors.right: parent.right
106 anchors.right: parent.right
97 }
107 }
98
99 }
108 }
@@ -26,7 +26,6 Row {
26 property variant axis
26 property variant axis
27
27
28 Flow {
28 Flow {
29 id: flow
30 spacing: 5
29 spacing: 5
31 flow: Flow.TopToBottom
30 flow: Flow.TopToBottom
32
31
1 NO CONTENT: file renamed from tests/qmlchartproperties/qml/qmlchartproperties/ChartEditor2.qml to tests/qmlchartproperties/qml/qmlchartproperties/ChartEditorLegend.qml
NO CONTENT: file renamed from tests/qmlchartproperties/qml/qmlchartproperties/ChartEditor2.qml to tests/qmlchartproperties/qml/qmlchartproperties/ChartEditorLegend.qml
@@ -20,113 +20,101
20
20
21 import QtQuick 1.0
21 import QtQuick 1.0
22
22
23 Row {
23 Flow {
24 anchors.fill: parent
24 anchors.fill: parent
25 spacing: 5
26 property variant chart
25 property variant chart
27
26 flow: Flow.TopToBottom
28 Flow {
27 spacing: 5
29 flow: Flow.TopToBottom
28 Button {
30 spacing: 5
29 text: "visible"
31 Button {
30 onClicked: chart.visible = !chart.visible;
32 text: "visible"
33 onClicked: chart.visible = !chart.visible;
34 }
35 Button {
36 text: "theme +"
37 onClicked: chart.theme++;
38 }
39 Button {
40 text: "theme -"
41 onClicked: chart.theme--;
42 }
43 Button {
44 text: "animation opt +"
45 onClicked: chart.animationOptions++;
46 }
47 Button {
48 text: "animation opt -"
49 onClicked: chart.animationOptions--;
50 }
51 Button {
52 text: "background color"
53 onClicked: chart.backgroundColor = main.nextColor();
54 }
55 Button {
56 text: "drop shadow enabled"
57 onClicked: chart.dropShadowEnabled = !chart.dropShadowEnabled;
58 }
59 Button {
60 text: "zoom +"
61 onClicked: chart.zoom(2);
62 }
63 Button {
64 text: "zoom -"
65 onClicked: chart.zoom(0.5);
66 }
67 Button {
68 text: "scroll left"
69 onClicked: chart.scrollLeft(10);
70 }
71 Button {
72 text: "scroll right"
73 onClicked: chart.scrollRight(10);
74 }
75 Button {
76 text: "scroll up"
77 onClicked: chart.scrollUp(10);
78 }
79 Button {
80 text: "scroll down"
81 onClicked: chart.scrollDown(10);
82 }
83 Button {
84 text: "title color"
85 onClicked: chart.titleColor = main.nextColor();
86 }
87 Button {
88 text: "zoom -"
89 onClicked: chart.zoom(0.5);
90 }
91 Button {
92 text: "top min margin +"
93 onClicked: chart.minimumMargins.top += 5;
94 }
95 Button {
96 text: "top min margin -"
97 onClicked: chart.minimumMargins.top -= 5;
98 }
99 Button {
100 text: "bottom min margin +"
101 onClicked: chart.minimumMargins.bottom += 5;
102 }
103 Button {
104 text: "bottom min margin -"
105 onClicked: chart.minimumMargins.bottom -= 5;
106 }
107 Button {
108 text: "left min margin +"
109 onClicked: chart.minimumMargins.left += 5;
110 }
111 Button {
112 text: "left min margin -"
113 onClicked: chart.minimumMargins.left -= 5;
114 }
115 Button {
116 text: "right min margin +"
117 onClicked: chart.minimumMargins.right += 5;
118 }
119 Button {
120 text: "right min margin -"
121 onClicked: chart.minimumMargins.right -= 5;
122 }
123 }
31 }
124
32 Button {
125 FontEditor {
33 text: "theme +"
126 id: fontEditor
34 onClicked: chart.theme++;
127 fontDescription: "title"
35 }
128 function editedFont() {
36 Button {
129 return chart.titleFont;
37 text: "theme -"
130 }
38 onClicked: chart.theme--;
39 }
40 Button {
41 text: "animation opt +"
42 onClicked: chart.animationOptions++;
43 }
44 Button {
45 text: "animation opt -"
46 onClicked: chart.animationOptions--;
47 }
48 Button {
49 text: "background color"
50 onClicked: chart.backgroundColor = main.nextColor();
51 }
52 Button {
53 text: "drop shadow enabled"
54 onClicked: chart.dropShadowEnabled = !chart.dropShadowEnabled;
55 }
56 Button {
57 text: "zoom +"
58 onClicked: chart.zoom(2);
59 }
60 Button {
61 text: "zoom -"
62 onClicked: chart.zoom(0.5);
63 }
64 Button {
65 text: "scroll left"
66 onClicked: chart.scrollLeft(10);
67 }
68 Button {
69 text: "scroll right"
70 onClicked: chart.scrollRight(10);
71 }
72 Button {
73 text: "scroll up"
74 onClicked: chart.scrollUp(10);
75 }
76 Button {
77 text: "scroll down"
78 onClicked: chart.scrollDown(10);
79 }
80 Button {
81 text: "title color"
82 onClicked: chart.titleColor = main.nextColor();
83 }
84 Button {
85 text: "zoom -"
86 onClicked: chart.zoom(0.5);
87 }
88 Button {
89 text: "top min margin +"
90 onClicked: chart.minimumMargins.top += 5;
91 }
92 Button {
93 text: "top min margin -"
94 onClicked: chart.minimumMargins.top -= 5;
95 }
96 Button {
97 text: "bottom min margin +"
98 onClicked: chart.minimumMargins.bottom += 5;
99 }
100 Button {
101 text: "bottom min margin -"
102 onClicked: chart.minimumMargins.bottom -= 5;
103 }
104 Button {
105 text: "left min margin +"
106 onClicked: chart.minimumMargins.left += 5;
107 }
108 Button {
109 text: "left min margin -"
110 onClicked: chart.minimumMargins.left -= 5;
111 }
112 Button {
113 text: "right min margin +"
114 onClicked: chart.minimumMargins.right += 5;
115 }
116 Button {
117 text: "right min margin -"
118 onClicked: chart.minimumMargins.right -= 5;
131 }
119 }
132 }
120 }
@@ -34,7 +34,7 Flow {
34 onClicked: editedFont().capitalization++;
34 onClicked: editedFont().capitalization++;
35 }
35 }
36 Button {
36 Button {
37 text: fontDescription + " family"
37 text: fontDescription + " font family"
38 onClicked: editedFont().family = "courier";
38 onClicked: editedFont().family = "courier";
39 }
39 }
40 Button {
40 Button {
@@ -18,12 +18,13
18 <file>qml/qmlchartproperties/PercentBarChart.qml</file>
18 <file>qml/qmlchartproperties/PercentBarChart.qml</file>
19 <file>qml/qmlchartproperties/Chart.qml</file>
19 <file>qml/qmlchartproperties/Chart.qml</file>
20 <file>qml/qmlchartproperties/ChartEditor.qml</file>
20 <file>qml/qmlchartproperties/ChartEditor.qml</file>
21 <file>qml/qmlchartproperties/ChartEditor1.qml</file>
22 <file>qml/qmlchartproperties/ChartEditor2.qml</file>
23 <file>qml/qmlchartproperties/ChartEditor3.qml</file>
24 <file>qml/qmlchartproperties/FontEditor.qml</file>
21 <file>qml/qmlchartproperties/FontEditor.qml</file>
25 <file>qml/qmlchartproperties/HorizontalBarChart.qml</file>
22 <file>qml/qmlchartproperties/HorizontalBarChart.qml</file>
26 <file>qml/qmlchartproperties/HorizontalPercentBarChart.qml</file>
23 <file>qml/qmlchartproperties/HorizontalPercentBarChart.qml</file>
27 <file>qml/qmlchartproperties/HorizontalStackedBarChart.qml</file>
24 <file>qml/qmlchartproperties/HorizontalStackedBarChart.qml</file>
25 <file>qml/qmlchartproperties/ChartEditorAxis.qml</file>
26 <file>qml/qmlchartproperties/ChartEditorLegend.qml</file>
27 <file>qml/qmlchartproperties/ChartEditorProperties.qml</file>
28 <file>qml/qmlchartproperties/ChartEditorTitle.qml</file>
28 </qresource>
29 </qresource>
29 </RCC>
30 </RCC>
General Comments 0
You need to be logged in to leave comments. Login now