on xenial help sign in
Hide the preview review input field when a rating is required Fixes: #1541971
6e3c4b2Andrea Cimitan
qml/Components/Rating.qml+1
@@ -21,6 +21,7 @@ import Ubuntu.Components 1.3
21
21
22StyledItem {
22StyledItem {
23 id: root
23 id: root
24+ implicitHeight: units.gu(2)
24
25
25 //! True if it accepts user input.
26 //! True if it accepts user input.
26 property bool interactive: true
27 property bool interactive: true
qml/Components/RatingStyle.qml+3
@@ -36,6 +36,9 @@ Row {
36 property url urlIconHalf: styledItem.urlIconHalf || "graphics/icon_star_half.png"
36 property url urlIconHalf: styledItem.urlIconHalf || "graphics/icon_star_half.png"
37
37
38 Image {
38 Image {
39+ height: parent.height
40+ fillMode: Image.PreserveAspectFit
41+ sourceSize.height: height
39 opacity: styledItem.value < 0 ? 0.4 : 1 // Let's make the stars look inactive for a not-set value
42 opacity: styledItem.value < 0 ? 0.4 : 1 // Let's make the stars look inactive for a not-set value
40 source: {
43 source: {
41 if (index === repeater.indexHalfValue) return repeater.urlIconHalf;
44 if (index === repeater.indexHalfValue) return repeater.urlIconHalf;
qml/Dash/Previews/PreviewRatingInput.qml+41−42
@@ -40,14 +40,16 @@ PreviewWidget {
40 switch(widgetData["visible"]) {
40 switch(widgetData["visible"]) {
41 default:
41 default:
42 case "both":
42 case "both":
43− return ratingLabelAndWidgetContainer.implicitHeight + reviewContainer.implicitHeight;
43+ return ratingLabelAndWidgetContainer.implicitHeight + (reviewContainer.visible ? reviewContainer.implicitHeight : 0);
44 case "rating":
44 case "rating":
45 return ratingLabelAndWidgetContainer.implicitHeight;
45 return ratingLabelAndWidgetContainer.implicitHeight;
46 case "review":
46 case "review":
47 return reviewContainer.implicitHeight;
47 return reviewContainer.implicitHeight;
48− }
48+ }
49 }
49 }
50
50
51+ clip: reviewContainer.visible
52+
51 property alias ratingValue: rating.value
53 property alias ratingValue: rating.value
52 property alias reviewText: reviewTextArea.text
54 property alias reviewText: reviewTextArea.text
53
55
@@ -64,21 +66,17 @@ PreviewWidget {
64 triggered(root.widgetId, "rated", data);
66 triggered(root.widgetId, "rated", data);
65 }
67 }
66
68
67− Item {
69+ Column {
68 id: ratingLabelAndWidgetContainer
70 id: ratingLabelAndWidgetContainer
69− anchors {
70− left: parent.left
71− right: parent.right
71+ anchors { left: parent.left; right: parent.right; }
72− }
72+ spacing: units.gu(0.5)
73− implicitHeight: rating.height
74 visible: widgetData["visible"] !== "review"
73 visible: widgetData["visible"] !== "review"
75
74
76 Label {
75 Label {
76+ id: ratingLabel
77 objectName: "ratingLabel"
77 objectName: "ratingLabel"
78− anchors {
78+ anchors { left: parent.left; right: parent.right; }
79− verticalCenter: parent.verticalCenter
79+ fontSize: "large"
80− left: parent.left
81− }
82 color: root.scopeStyle ? root.scopeStyle.foreground : theme.palette.normal.baseText
80 color: root.scopeStyle ? root.scopeStyle.foreground : theme.palette.normal.baseText
83 opacity: .8
81 opacity: .8
84 text: widgetData["rating-label"] || i18n.tr("Rate this")
82 text: widgetData["rating-label"] || i18n.tr("Rate this")
@@ -87,23 +85,22 @@ PreviewWidget {
87 Rating {
85 Rating {
88 id: rating
86 id: rating
89 objectName: "rating"
87 objectName: "rating"
90− anchors {
88+ anchors.left: parent.left
91− verticalCenter: parent.verticalCenter
92− right: parent.right
93− }
94 size: 5
89 size: 5
90+ height: units.gu(4)
95 onValueChanged: {
91 onValueChanged: {
96 if (widgetData["visible"] === "rating") root.submit();
92 if (widgetData["visible"] === "rating") root.submit();
97 }
93 }
98
94
99− property var urlIconEmpty: widgetData["rating-icon-empty"]
95+ property var urlIconEmpty: widgetData["rating-icon-empty"] || "image://theme/non-starred"
100− property var urlIconFull: widgetData["rating-icon-full"]
96+ property var urlIconFull: widgetData["rating-icon-full"] || "image://theme/starred"
101 }
97 }
102 }
98 }
103
99
104 Item {
100 Item {
105 id: reviewContainer
101 id: reviewContainer
102+ objectName: "reviewContainer"
106− implicitHeight: reviewLabel.implicitHeight + reviewSubmitContainer.implicitHeight + anchors.topMargin
103+ implicitHeight: visible ? reviewSubmitContainer.implicitHeight + anchors.topMargin : 0
107
104
108 readonly property real innerMargin: units.gu(1)
105 readonly property real innerMargin: units.gu(1)
109
106
@@ -112,32 +109,31 @@ PreviewWidget {
112 right: parent.right
109 right: parent.right
113 top: ratingLabelAndWidgetContainer.visible ? ratingLabelAndWidgetContainer.bottom : parent.top
110 top: ratingLabelAndWidgetContainer.visible ? ratingLabelAndWidgetContainer.bottom : parent.top
114 bottom: parent.bottom
111 bottom: parent.bottom
115− topMargin: ratingLabelAndWidgetContainer.visible ? reviewContainer.innerMargin : 0
112+ topMargin: ratingLabelAndWidgetContainer.visible ? innerMargin : 0
113+ }
114+ visible: {
115+ switch(widgetData["visible"]) {
116+ default:
117+ case "both":
118+ return widgetData["required"] === "review" || rating.value > 0;
119+ case "rating":
120+ return false;
121+ case "review":
122+ return true;
123+ }
116 }
124 }
117− visible: widgetData["visible"] !== "rating"
118
125
119− Label {
126+ Behavior on implicitHeight {
120− objectName: "reviewLabel"
127+ UbuntuNumberAnimation {
121− id: reviewLabel
128+ duration: UbuntuAnimation.FastDuration
122− anchors {
129+ easing.type: Easing.OutCubic
123− top: parent.top
124− left: parent.left
125− right: parent.right
126 }
130 }
127− color: root.scopeStyle ? root.scopeStyle.foreground : theme.palette.normal.baseText
128− opacity: .8
129− text: widgetData["review-label"] || i18n.tr("Add a review")
130 }
131 }
131
132
132 Item {
133 Item {
133 id: reviewSubmitContainer
134 id: reviewSubmitContainer
135+ objectName: "reviewSubmitContainer"
134− anchors {
136+ anchors.fill: parent
135− top: reviewLabel.bottom
136− left: parent.left
137− right: parent.right
138− bottom: parent.bottom
139− topMargin: reviewContainer.innerMargin
140− }
141 implicitHeight: reviewTextArea.implicitHeight + anchors.topMargin
137 implicitHeight: reviewTextArea.implicitHeight + anchors.topMargin
142
138
143 TextArea {
139 TextArea {
@@ -148,12 +144,17 @@ PreviewWidget {
148 if(inputMethodVisible && activeFocus)
144 if(inputMethodVisible && activeFocus)
149 root.makeSureVisible(reviewTextArea);
145 root.makeSureVisible(reviewTextArea);
150 }
146 }
147+ onVisibleChanged: {
148+ if (visible && widgetData["visible"] !== "review")
149+ focus = true;
150+ }
151 anchors {
151 anchors {
152 top: parent.top
152 top: parent.top
153 left: parent.left
153 left: parent.left
154 right: submitButton.left
154 right: submitButton.left
155 rightMargin: reviewContainer.innerMargin
155 rightMargin: reviewContainer.innerMargin
156 }
156 }
157+ placeholderText: widgetData["review-label"] || i18n.tr("Add a review")
157 }
158 }
158
159
159 Button {
160 Button {
@@ -170,11 +171,9 @@ PreviewWidget {
170 top: parent.top
171 top: parent.top
171 right: parent.right
172 right: parent.right
172 }
173 }
173− color: readyToSubmit ? theme.palette.selected.base : theme.palette.normal.base
174+ enabled: readyToSubmit
174 text: widgetData["submit-label"] || i18n.tr("Send")
175 text: widgetData["submit-label"] || i18n.tr("Send")
175− onClicked: {
176+ onClicked: root.submit()
176− if (readyToSubmit) root.submit()
177− }
178 }
177 }
179 }
178 }
180 }
179 }
tests/qmltests/Dash/Previews/tst_PreviewRatingEdit.qml+5−1
@@ -50,7 +50,8 @@ Rectangle {
50
50
51 var authorLabel = findChild(previewRatingEdit, "authorLabel");
51 var authorLabel = findChild(previewRatingEdit, "authorLabel");
52 var reviewTextArea = findChild(previewRatingEdit, "reviewTextArea");
52 var reviewTextArea = findChild(previewRatingEdit, "reviewTextArea");
53− var inputRating = findChild(findChild(previewRatingEdit, "input"), "rating");
53+ var ratingInput = findChild(previewRatingEdit, "input");
54+ var inputRating = findChild(ratingInput, "rating");
54 verify(authorLabel.visible)
55 verify(authorLabel.visible)
55 verify(!reviewTextArea.visible)
56 verify(!reviewTextArea.visible)
56
57
@@ -65,6 +66,9 @@ Rectangle {
65 reviewTextArea.text = "Ho Ho";
66 reviewTextArea.text = "Ho Ho";
66 inputRating.value = 3;
67 inputRating.value = 3;
67
68
69+ var reviewContainer = findChild(ratingInput, "reviewContainer");
70+ var reviewSubmitContainer = findChild(ratingInput, "reviewSubmitContainer");
71+ tryCompare(reviewContainer, "implicitHeight", reviewSubmitContainer.implicitHeight + reviewContainer.anchors.topMargin);
68 var submitButton = findChild(previewRatingEdit, "submitButton")
72 var submitButton = findChild(previewRatingEdit, "submitButton")
69 mouseClick(submitButton);
73 mouseClick(submitButton);
70
74
tests/qmltests/Dash/Previews/tst_PreviewRatingInput.qml+18−6
@@ -73,11 +73,10 @@ Rectangle {
73
73
74 function test_labels() {
74 function test_labels() {
75 var ratingLabel = findChild(previewRatingInput, "ratingLabel");
75 var ratingLabel = findChild(previewRatingInput, "ratingLabel");
76− var reviewLabel = findChild(previewRatingInput, "reviewLabel");
77
76
78 previewRatingInput.widgetData = widgetDataNewLabels;
77 previewRatingInput.widgetData = widgetDataNewLabels;
79 compare(ratingLabel.text, widgetDataNewLabels["rating-label"]);
78 compare(ratingLabel.text, widgetDataNewLabels["rating-label"]);
80− compare(reviewLabel.text, widgetDataNewLabels["review-label"]);
79+ compare(reviewTextArea.placeholderText, widgetDataNewLabels["review-label"]);
81 compare(submitButton.text, widgetDataNewLabels["submit-label"]);
80 compare(submitButton.text, widgetDataNewLabels["submit-label"]);
82 }
81 }
83
82
@@ -120,10 +119,17 @@ Rectangle {
120
119
121 previewRatingInput.widgetData = data.widgetData;
120 previewRatingInput.widgetData = data.widgetData;
122
121
122+ if (data.widgetData["visible"] === "both" && data.widgetData["required"] === "both")
123+ compare(reviewTextArea.visible, false);
124+
123 if (data.widgetData["visible"] !== "review") {
125 if (data.widgetData["visible"] !== "review") {
124− verify(rating.visible === true);
126+ compare(rating.visible, true);
125
127
126 rating.value = data.inputRating;
128 rating.value = data.inputRating;
129+
130+ if (data.inputRating > 0 && data.widgetData["visible"] === "both")
131+ compare(reviewTextArea.visible, true);
132+
127 if (data.widgetData["required"] !== "rating" ||
133 if (data.widgetData["required"] !== "rating" ||
128 data.widgetData["visible"] !== "rating" ||
134 data.widgetData["visible"] !== "rating" ||
129 data.inputRating < 0) {
135 data.inputRating < 0) {
@@ -132,13 +138,19 @@ Rectangle {
132 compare(spy.count, 1);
138 compare(spy.count, 1);
133 }
139 }
134 } else {
140 } else {
135− verify(rating.visible === false);
141+ compare(rating.visible, false);
136 }
142 }
137
143
138 if (data.widgetData["visible"] !== "rating") {
144 if (data.widgetData["visible"] !== "rating") {
145+ if (data.widgetData["visible"] === "review" || data.widgetData["required"] === "review")
139− verify(reviewTextArea.visible === true);
146+ compare(reviewTextArea.visible, true);
140
147
141 reviewTextArea.text = data.inputText;
148 reviewTextArea.text = data.inputText;
149+ var reviewContainer = findChild(previewRatingInput, "reviewContainer");
150+ if (reviewContainer.visible) {
151+ var reviewSubmitContainer = findChild(previewRatingInput, "reviewSubmitContainer");
152+ tryCompare(reviewContainer, "implicitHeight", reviewSubmitContainer.implicitHeight + reviewContainer.anchors.topMargin);
153+ }
142 mouseClick(submitButton);
154 mouseClick(submitButton);
143 switch (data.widgetData["required"]) {
155 switch (data.widgetData["required"]) {
144 case "rating": {
156 case "rating": {
@@ -164,7 +176,7 @@ Rectangle {
164 }
176 }
165 }
177 }
166 } else {
178 } else {
167− verify(reviewTextArea.visible === false);
179+ compare(reviewTextArea.visible, false);
168 }
180 }
169
181
170 compare(spy.count === 1, data.emitted);
182 compare(spy.count === 1, data.emitted);