Merge lp:~sil2100/ubuntu-ui-toolkit/scrollbar_moreHoverFixesAndTests-ota14 into lp:~ubuntu-sdk-team/ubuntu-ui-toolkit/trunk-ota14
- scrollbar_moreHoverFixesAndTests-ota14
- Merge into trunk-ota14
Proposed by
Łukasz Zemczak
Status: | Needs review |
---|---|
Proposed branch: | lp:~sil2100/ubuntu-ui-toolkit/scrollbar_moreHoverFixesAndTests-ota14 |
Merge into: | lp:~ubuntu-sdk-team/ubuntu-ui-toolkit/trunk-ota14 |
Diff against target: |
662 lines (+290/-154) 3 files modified
src/Ubuntu/Components/Themes/Ambiance/1.3/ScrollbarStyle.qml (+49/-28) tests/unit/visual/ScrollbarTestCase13.qml (+3/-0) tests/unit/visual/tst_scrollbar.13.qml (+238/-126) |
To merge this branch: | bzr merge lp:~sil2100/ubuntu-ui-toolkit/scrollbar_moreHoverFixesAndTests-ota14 |
Related bugs: |
Reviewer | Review Type | Date Requested | Status |
---|---|---|---|
Ubuntu SDK team | Pending | ||
Review via email: mp+310459@code.launchpad.net |
Description of the change
Cherry-pick Andrea's fix from trunk for OTA-14: Scrollbar: more hover related bugfixes and unit tests. (LP: #1616926 and LP: #1616868)
Original MP: https:/
To post a comment you must log in.
Unmerged revisions
- 1353. By Łukasz Zemczak
-
Cherry-pick Andrea's fix from trunk for OTA-14: Scrollbar: more hover related bugfixes and unit tests. (LP: #1616926 and LP: #1616868)
Preview Diff
[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk
1 | === modified file 'src/Ubuntu/Components/Themes/Ambiance/1.3/ScrollbarStyle.qml' | |||
2 | --- src/Ubuntu/Components/Themes/Ambiance/1.3/ScrollbarStyle.qml 2016-08-02 11:18:34 +0000 | |||
3 | +++ src/Ubuntu/Components/Themes/Ambiance/1.3/ScrollbarStyle.qml 2016-11-09 16:44:56 +0000 | |||
4 | @@ -316,7 +316,9 @@ | |||
5 | 316 | property string propPosRatio: (isVertical) ? "yPosition" : "xPosition" | 316 | property string propPosRatio: (isVertical) ? "yPosition" : "xPosition" |
6 | 317 | property string propSizeRatio: (isVertical) ? "heightRatio" : "widthRatio" | 317 | property string propSizeRatio: (isVertical) ? "heightRatio" : "widthRatio" |
7 | 318 | property string propCoordinate: (isVertical) ? "y" : "x" | 318 | property string propCoordinate: (isVertical) ? "y" : "x" |
8 | 319 | property string otherPropCoordinate: (isVertical) ? "x" : "y" | ||
9 | 319 | property string propSize: (isVertical) ? "height" : "width" | 320 | property string propSize: (isVertical) ? "height" : "width" |
10 | 321 | property string otherPropSize: (isVertical) ? "width" : "height" | ||
11 | 320 | property string propAtBeginning: (isVertical) ? "atYBeginning" : "atXBeginning" | 322 | property string propAtBeginning: (isVertical) ? "atYBeginning" : "atXBeginning" |
12 | 321 | property string propAtEnd: (isVertical) ? "atYEnd" : "atXEnd" | 323 | property string propAtEnd: (isVertical) ? "atYEnd" : "atXEnd" |
13 | 322 | 324 | ||
14 | @@ -622,8 +624,6 @@ | |||
15 | 622 | property bool lockDrag: false | 624 | property bool lockDrag: false |
16 | 623 | 625 | ||
17 | 624 | property bool hoveringThumb: false | 626 | property bool hoveringThumb: false |
18 | 625 | property string scrollingProp: isVertical ? "y" : "x" | ||
19 | 626 | property string sizeProp: isVertical ? "height" : "width" | ||
20 | 627 | 627 | ||
21 | 628 | function initDrag(isMouse) { | 628 | function initDrag(isMouse) { |
22 | 629 | __disableStateBinding = true | 629 | __disableStateBinding = true |
23 | @@ -648,20 +648,29 @@ | |||
24 | 648 | if (!thumbArea.pressed) return | 648 | if (!thumbArea.pressed) return |
25 | 649 | 649 | ||
26 | 650 | var mouseScrollingProp = isVertical ? mouseY : mouseX | 650 | var mouseScrollingProp = isVertical ? mouseY : mouseX |
28 | 651 | if (mouseScrollingProp < slider[scrollingProp]) { | 651 | if (mouseScrollingProp < slider[scrollbarUtils.propCoordinate]) { |
29 | 652 | scrollBy(-pageSize*visuals.longScrollingRatio, true) | 652 | scrollBy(-pageSize*visuals.longScrollingRatio, true) |
31 | 653 | } else if (mouseScrollingProp > slider[scrollingProp] + slider[sizeProp]) { | 653 | } else if (mouseScrollingProp > slider[scrollbarUtils.propCoordinate] + slider[scrollbarUtils.propSize]) { |
32 | 654 | scrollBy(pageSize*visuals.longScrollingRatio, true) | 654 | scrollBy(pageSize*visuals.longScrollingRatio, true) |
33 | 655 | } | 655 | } |
34 | 656 | } | 656 | } |
35 | 657 | 657 | ||
36 | 658 | //we consider hover if it's inside the TROUGH along the scrolling axis | ||
37 | 659 | //and inside the THUMB along the non-scrolling axis | ||
38 | 660 | //NOTE: mouseX and mouseY are assumed to be relative to thumbArea | ||
39 | 658 | function handleHover(mouseX, mouseY) { | 661 | function handleHover(mouseX, mouseY) { |
40 | 662 | //NOTE: we're assuming thumbArea has same size/position as the trough. | ||
41 | 663 | //Use mapToItem to map the coordinates if that assumption falls (i.e. to implement | ||
42 | 664 | //a larger touch detection area around the thumb) | ||
43 | 659 | var mouseScrollingProp = isVertical ? mouseY : mouseX | 665 | var mouseScrollingProp = isVertical ? mouseY : mouseX |
46 | 660 | //don't count as hover if the user is already press-and-holding the trough to | 666 | var otherProp = isVertical ? mouseX : mouseY |
47 | 661 | //scroll page by page | 667 | |
48 | 668 | //don't count as hover if the user is already press-and-holding | ||
49 | 669 | //the trough to scroll page by page | ||
50 | 662 | hoveringThumb = !(pressHoldTimer.running && pressHoldTimer.startedBy === thumbArea) | 670 | hoveringThumb = !(pressHoldTimer.running && pressHoldTimer.startedBy === thumbArea) |
53 | 663 | && mouseScrollingProp >= slider[scrollingProp] && | 671 | && mouseScrollingProp >= slider[scrollbarUtils.propCoordinate] && |
54 | 664 | mouseScrollingProp <= slider[scrollingProp] + slider[sizeProp] | 672 | mouseScrollingProp <= slider[scrollbarUtils.propCoordinate] + slider[scrollbarUtils.propSize] && |
55 | 673 | otherProp >= 0 && otherProp <= trough[scrollbarUtils.otherPropSize] | ||
56 | 665 | } | 674 | } |
57 | 666 | 675 | ||
58 | 667 | function saveFlickableScrollingState() { | 676 | function saveFlickableScrollingState() { |
59 | @@ -691,14 +700,9 @@ | |||
60 | 691 | previousY = mouse.y | 700 | previousY = mouse.y |
61 | 692 | } | 701 | } |
62 | 693 | 702 | ||
71 | 694 | anchors { | 703 | //NOTE: remember to update the handleHover check if you add anchor margins |
72 | 695 | fill: trough | 704 | anchors.fill: trough |
73 | 696 | // set margins adding 2 dp for error area | 705 | |
66 | 697 | leftMargin: (!isVertical || frontAligned) ? 0 : units.dp(-2) | ||
67 | 698 | rightMargin: (!isVertical || rearAligned) ? 0 : units.dp(-2) | ||
68 | 699 | topMargin: (isVertical || topAligned) ? 0 : units.dp(-2) | ||
69 | 700 | bottomMargin: (isVertical || bottomAligned) ? 0 : units.dp(-2) | ||
70 | 701 | } | ||
74 | 702 | enabled: isScrollable && interactive && __canFitSteppersAndShorterThumb | 706 | enabled: isScrollable && interactive && __canFitSteppersAndShorterThumb |
75 | 703 | onPressed: { | 707 | onPressed: { |
76 | 704 | cacheMousePosition(mouse) | 708 | cacheMousePosition(mouse) |
77 | @@ -710,8 +714,8 @@ | |||
78 | 710 | if (firstStepper.visible) { | 714 | if (firstStepper.visible) { |
79 | 711 | var mouseScrollingProp = isVertical ? mouseY : mouseX | 715 | var mouseScrollingProp = isVertical ? mouseY : mouseX |
80 | 712 | //don't start the press and hold timer to avoid conflicts with the drag | 716 | //don't start the press and hold timer to avoid conflicts with the drag |
83 | 713 | if (mouseScrollingProp < slider[scrollingProp] || | 717 | if (mouseScrollingProp < slider[scrollbarUtils.propCoordinate] || |
84 | 714 | mouseScrollingProp > (slider[scrollingProp] + slider[sizeProp])) { | 718 | mouseScrollingProp > (slider[scrollbarUtils.propCoordinate] + slider[scrollbarUtils.propSize])) { |
85 | 715 | handlePress(mouseX, mouseY) | 719 | handlePress(mouseX, mouseY) |
86 | 716 | pressHoldTimer.startTimer(thumbArea) | 720 | pressHoldTimer.startTimer(thumbArea) |
87 | 717 | } else { | 721 | } else { |
88 | @@ -761,7 +765,8 @@ | |||
89 | 761 | pressHoldTimer.stop() | 765 | pressHoldTimer.stop() |
90 | 762 | } | 766 | } |
91 | 763 | onReleased: { | 767 | onReleased: { |
93 | 764 | handleHover(mouseX, mouseY) | 768 | //don't call handleHover here as touch release also triggers this handler |
94 | 769 | //see bug #1616868 | ||
95 | 765 | resetDrag() | 770 | resetDrag() |
96 | 766 | pressHoldTimer.stop() | 771 | pressHoldTimer.stop() |
97 | 767 | } | 772 | } |
98 | @@ -797,18 +802,29 @@ | |||
99 | 797 | 802 | ||
100 | 798 | //logic to support different colour on hovering | 803 | //logic to support different colour on hovering |
101 | 799 | hoverEnabled: true | 804 | hoverEnabled: true |
102 | 805 | //This means this mouse filter will only handle real mouse events! | ||
103 | 806 | //i.e. the synthesized mouse events created when you use | ||
104 | 807 | //touchscreen will not trigger it! This way we can have logic that | ||
105 | 808 | //will not trigger when using touch | ||
106 | 809 | Mouse.ignoreSynthesizedEvents: true | ||
107 | 800 | Mouse.enabled: true | 810 | Mouse.enabled: true |
108 | 801 | Mouse.ignoreSynthesizedEvents: true | ||
109 | 802 | Mouse.onEntered: { | 811 | Mouse.onEntered: { |
110 | 803 | hoveringThumb = false | 812 | hoveringThumb = false |
111 | 804 | handleHover(event.x, event.y) | 813 | handleHover(event.x, event.y) |
112 | 805 | } | 814 | } |
113 | 806 | Mouse.onPositionChanged: { | 815 | Mouse.onPositionChanged: { |
114 | 816 | //We need to update the hover state also onPosChanged because this area | ||
115 | 817 | //covers the whole trough, not just the thumb, so entered/exited are not enough | ||
116 | 818 | //e.g. when mouse moves from inside the thumb to inside the trough, or when you | ||
117 | 819 | //click on the trough and the thumb scrolls and goes under the mouse cursor | ||
118 | 807 | handleHover(mouse.x, mouse.y) | 820 | handleHover(mouse.x, mouse.y) |
119 | 808 | } | 821 | } |
120 | 809 | Mouse.onExited: { | 822 | Mouse.onExited: { |
121 | 810 | hoveringThumb = false | 823 | hoveringThumb = false |
122 | 811 | } | 824 | } |
123 | 825 | Mouse.onReleased: { | ||
124 | 826 | handleHover(mouse.x, mouse.y) | ||
125 | 827 | } | ||
126 | 812 | 828 | ||
127 | 813 | Timer { | 829 | Timer { |
128 | 814 | id: pressHoldTimer | 830 | id: pressHoldTimer |
129 | @@ -845,6 +861,7 @@ | |||
130 | 845 | 861 | ||
131 | 846 | MouseArea { | 862 | MouseArea { |
132 | 847 | id: steppersMouseArea | 863 | id: steppersMouseArea |
133 | 864 | objectName: "steppersMouseArea" | ||
134 | 848 | //size is handled by the states | 865 | //size is handled by the states |
135 | 849 | 866 | ||
136 | 850 | property bool hoveringFirstStepper: false | 867 | property bool hoveringFirstStepper: false |
137 | @@ -897,12 +914,7 @@ | |||
138 | 897 | hoveringFirstStepper = false | 914 | hoveringFirstStepper = false |
139 | 898 | hoveringSecondStepper = false | 915 | hoveringSecondStepper = false |
140 | 899 | } | 916 | } |
147 | 900 | 917 | Mouse.onPressed: { | |
142 | 901 | //We don't change the size of the images because we let the image reader figure the size out, | ||
143 | 902 | //though that means we have to hide the images somehow while the mousearea is visible but has | ||
144 | 903 | //null size. We choose to enable clipping here instead of creating bindings on images' visible prop | ||
145 | 904 | clip: true | ||
146 | 905 | onPressed: { | ||
148 | 906 | //This additional trigger of the hovering logic is useful especially in testing | 918 | //This additional trigger of the hovering logic is useful especially in testing |
149 | 907 | //environments, where simulating a click on the first stepper will generate onEntered, | 919 | //environments, where simulating a click on the first stepper will generate onEntered, |
150 | 908 | //but then clicking on the second one (without a mouseMove) won't, because they're | 920 | //but then clicking on the second one (without a mouseMove) won't, because they're |
151 | @@ -910,7 +922,16 @@ | |||
152 | 910 | //we ensure that the hovering logic is correct even when there are no mouse moves between | 922 | //we ensure that the hovering logic is correct even when there are no mouse moves between |
153 | 911 | //clicks on different steppers (like it happens in tst_actionSteppers test). | 923 | //clicks on different steppers (like it happens in tst_actionSteppers test). |
154 | 912 | handleHover(mouse) | 924 | handleHover(mouse) |
155 | 925 | } | ||
156 | 926 | Mouse.onReleased: { | ||
157 | 927 | handleHover(mouse) | ||
158 | 928 | } | ||
159 | 913 | 929 | ||
160 | 930 | //We don't change the size of the images because we let the image reader figure the size out, | ||
161 | 931 | //though that means we have to hide the images somehow while the mousearea is visible but has | ||
162 | 932 | //null size. We choose to enable clipping here instead of creating bindings on images' visible prop | ||
163 | 933 | clip: true | ||
164 | 934 | onPressed: { | ||
165 | 914 | handlePress() | 935 | handlePress() |
166 | 915 | pressHoldTimer.startTimer(steppersMouseArea) | 936 | pressHoldTimer.startTimer(steppersMouseArea) |
167 | 916 | } | 937 | } |
168 | @@ -952,7 +973,7 @@ | |||
169 | 952 | anchors.centerIn: parent | 973 | anchors.centerIn: parent |
170 | 953 | width: __stepperAssetWidth | 974 | width: __stepperAssetWidth |
171 | 954 | rotation: isVertical ? 180 : 90 | 975 | rotation: isVertical ? 180 : 90 |
173 | 955 | //NOTE: Qt.resolvedUrl was removed because it does not seem to be needed and | 976 | //NOTE: Qt.resolvedUrl was removed because it does not seem to be needed and |
174 | 956 | //the QML profiler showed it's relatively expensive | 977 | //the QML profiler showed it's relatively expensive |
175 | 957 | source: visible ? "../artwork/toolkit_scrollbar-stepper.svg" : "" | 978 | source: visible ? "../artwork/toolkit_scrollbar-stepper.svg" : "" |
176 | 958 | asynchronous: true | 979 | asynchronous: true |
177 | @@ -998,7 +1019,7 @@ | |||
178 | 998 | anchors.centerIn: parent | 1019 | anchors.centerIn: parent |
179 | 999 | width: __stepperAssetWidth | 1020 | width: __stepperAssetWidth |
180 | 1000 | rotation: isVertical ? 0 : -90 | 1021 | rotation: isVertical ? 0 : -90 |
182 | 1001 | //NOTE: Qt.resolvedUrl was removed because it does not seem to be needed and | 1022 | //NOTE: Qt.resolvedUrl was removed because it does not seem to be needed and |
183 | 1002 | //the QML profiler showed it's relatively expensive | 1023 | //the QML profiler showed it's relatively expensive |
184 | 1003 | source: visible ? "../artwork/toolkit_scrollbar-stepper.svg" : "" | 1024 | source: visible ? "../artwork/toolkit_scrollbar-stepper.svg" : "" |
185 | 1004 | asynchronous: true | 1025 | asynchronous: true |
186 | 1005 | 1026 | ||
187 | === modified file 'tests/unit/visual/ScrollbarTestCase13.qml' | |||
188 | --- tests/unit/visual/ScrollbarTestCase13.qml 2016-06-08 11:36:03 +0000 | |||
189 | +++ tests/unit/visual/ScrollbarTestCase13.qml 2016-11-09 16:44:56 +0000 | |||
190 | @@ -242,6 +242,9 @@ | |||
191 | 242 | function getThumbArea(scrollbar) { | 242 | function getThumbArea(scrollbar) { |
192 | 243 | return findChildAndCheckValidInstance(scrollbar.__styleInstance, "thumbArea") | 243 | return findChildAndCheckValidInstance(scrollbar.__styleInstance, "thumbArea") |
193 | 244 | } | 244 | } |
194 | 245 | function getSteppersMouseArea(scrollbar) { | ||
195 | 246 | return findChildAndCheckValidInstance(scrollbar.__styleInstance, "steppersMouseArea") | ||
196 | 247 | } | ||
197 | 245 | function getScrollAnimation(scrollbar) { | 248 | function getScrollAnimation(scrollbar) { |
198 | 246 | var anim = findInvisibleChild(scrollbar.__styleInstance, "scrollAnimation") | 249 | var anim = findInvisibleChild(scrollbar.__styleInstance, "scrollAnimation") |
199 | 247 | verify(anim !== null, "Returning a valid reference to scrollAnimation.") | 250 | verify(anim !== null, "Returning a valid reference to scrollAnimation.") |
200 | 248 | 251 | ||
201 | === modified file 'tests/unit/visual/tst_scrollbar.13.qml' | |||
202 | --- tests/unit/visual/tst_scrollbar.13.qml 2016-08-02 13:43:39 +0000 | |||
203 | +++ tests/unit/visual/tst_scrollbar.13.qml 2016-11-09 16:44:56 +0000 | |||
204 | @@ -250,7 +250,7 @@ | |||
205 | 250 | nullFlickableScrollbar.destroy() | 250 | nullFlickableScrollbar.destroy() |
206 | 251 | } | 251 | } |
207 | 252 | 252 | ||
209 | 253 | //no need to test the anchors values when flickable is not set because we already | 253 | //no need to test the anchors values when flickable is not set because we already |
210 | 254 | //test that the scrollbar is hidden when there's no flickable set | 254 | //test that the scrollbar is hidden when there's no flickable set |
211 | 255 | function test_bottomAlign_anchors() { | 255 | function test_bottomAlign_anchors() { |
212 | 256 | compare(scrollbar_bottomAlign_anchors.flickableItem, | 256 | compare(scrollbar_bottomAlign_anchors.flickableItem, |
213 | @@ -438,40 +438,101 @@ | |||
214 | 438 | } | 438 | } |
215 | 439 | } | 439 | } |
216 | 440 | 440 | ||
222 | 441 | function test_checkStepperStatesStyling(data) { | 441 | function checkSteppersColour(scrollbar, firstStepperStateString, secondStepperStateString, testDescription) { |
218 | 442 | var freshTestItem = getFreshFlickable(data.alignment) | ||
219 | 443 | var flickable = freshTestItem.flickable | ||
220 | 444 | var scrollbar = freshTestItem.scrollbar | ||
221 | 445 | var style = scrollbar.__styleInstance | ||
223 | 446 | var firstStepper = getFirstStepper(scrollbar) | 442 | var firstStepper = getFirstStepper(scrollbar) |
224 | 447 | var secondStepper = getSecondStepper(scrollbar) | 443 | var secondStepper = getSecondStepper(scrollbar) |
225 | 448 | |||
226 | 449 | triggerSteppersMode(scrollbar) | ||
227 | 450 | |||
228 | 451 | //the following tests are assuming that the steppers are not disabled | ||
229 | 452 | compare(style.isScrollable, true, "Scrollbar is not scrollable, cannot test steppers hover/pressed state.") | ||
230 | 453 | |||
231 | 454 | var firstStepperIcon = getFirstStepperIcon(scrollbar) | 444 | var firstStepperIcon = getFirstStepperIcon(scrollbar) |
232 | 455 | var secondStepperIcon = getSecondStepperIcon(scrollbar) | 445 | var secondStepperIcon = getSecondStepperIcon(scrollbar) |
233 | 446 | var style = scrollbar.__styleInstance | ||
234 | 456 | 447 | ||
235 | 457 | //bg color on hover/pressed. Otherwise it should be transparent so that it shows the same bg as the trough | ||
236 | 458 | var stepperBgColorBase = style.stepperBgColor | 448 | var stepperBgColorBase = style.stepperBgColor |
237 | 459 | |||
238 | 460 | var stepperImgColor = style.sliderColor | 449 | var stepperImgColor = style.sliderColor |
239 | 450 | |||
240 | 451 | var stepperBgColorDisabled = "transparent" | ||
241 | 452 | var stepperImgColorDisabled = Qt.rgba(stepperImgColor.r, stepperImgColor.g, stepperImgColor.b, | ||
242 | 453 | stepperImgColor.a * style.__stepperImgOpacityDisabled) | ||
243 | 454 | var stepperBgColorNormal = "transparent" | ||
244 | 455 | var stepperImgColorNormal = Qt.rgba(stepperImgColor.r, stepperImgColor.g, stepperImgColor.b, | ||
245 | 456 | stepperImgColor.a * style.__stepperImgOpacityNormal) | ||
246 | 457 | var stepperBgColorOnHover = Qt.rgba(stepperBgColorBase.r, stepperBgColorBase.g, stepperBgColorBase.b, | ||
247 | 458 | stepperBgColorBase.a * style.__stepperBgOpacityOnHover) | ||
248 | 461 | var stepperImgColorOnHover = Qt.rgba(stepperImgColor.r, stepperImgColor.g, stepperImgColor.b, | 459 | var stepperImgColorOnHover = Qt.rgba(stepperImgColor.r, stepperImgColor.g, stepperImgColor.b, |
249 | 462 | stepperImgColor.a * style.__stepperImgOpacityOnHover) | 460 | stepperImgColor.a * style.__stepperImgOpacityOnHover) |
252 | 463 | var stepperBgColorOnHover = Qt.rgba(stepperBgColorBase.r, stepperBgColorBase.g, stepperBgColorBase.b, | 461 | var stepperBgColorOnPressed = Qt.rgba(stepperBgColorBase.r, stepperBgColorBase.g, stepperBgColorBase.b, |
253 | 464 | stepperBgColorBase.a * style.__stepperBgOpacityOnHover) | 462 | stepperBgColorBase.a * style.__stepperBgOpacityOnPressed) |
254 | 465 | var stepperImgColorOnPressed = Qt.rgba(stepperImgColor.r, stepperImgColor.g, stepperImgColor.b, | 463 | var stepperImgColorOnPressed = Qt.rgba(stepperImgColor.r, stepperImgColor.g, stepperImgColor.b, |
255 | 466 | stepperImgColor.a * style.__stepperImgOpacityOnPressed) | 464 | stepperImgColor.a * style.__stepperImgOpacityOnPressed) |
264 | 467 | var stepperBgColorOnPressed = Qt.rgba(stepperBgColorBase.r, stepperBgColorBase.g, stepperBgColorBase.b, | 465 | |
265 | 468 | stepperBgColorBase.a * style.__stepperBgOpacityOnPressed) | 466 | switch (firstStepperStateString) { |
266 | 469 | var stepperBgColorNormal = "transparent" | 467 | case "disabled": |
267 | 470 | var stepperImgColorNormal = Qt.rgba(stepperImgColor.r, stepperImgColor.g, stepperImgColor.b, | 468 | var expectedFirstStepperColour = stepperBgColorDisabled |
268 | 471 | stepperImgColor.a * style.__stepperImgOpacityNormal) | 469 | var expectedFirstStepperIconColour = stepperImgColorDisabled |
269 | 472 | var stepperBgColorDisabled = "transparent" | 470 | break |
270 | 473 | var stepperImgColorDisabled = Qt.rgba(stepperImgColor.r, stepperImgColor.g, stepperImgColor.b, | 471 | case "normal": |
271 | 474 | stepperImgColor.a * style.__stepperImgOpacityDisabled) | 472 | var expectedFirstStepperColour = stepperBgColorNormal |
272 | 473 | var expectedFirstStepperIconColour = stepperImgColorNormal | ||
273 | 474 | break | ||
274 | 475 | case "hovered": | ||
275 | 476 | var expectedFirstStepperColour = stepperBgColorOnHover | ||
276 | 477 | var expectedFirstStepperIconColour = stepperImgColorOnHover | ||
277 | 478 | break | ||
278 | 479 | case "pressed": | ||
279 | 480 | var expectedFirstStepperColour = stepperBgColorOnPressed | ||
280 | 481 | var expectedFirstStepperIconColour = stepperImgColorOnPressed | ||
281 | 482 | break | ||
282 | 483 | default: | ||
283 | 484 | fail("Invalid stepper state string") | ||
284 | 485 | } | ||
285 | 486 | |||
286 | 487 | switch (secondStepperStateString) { | ||
287 | 488 | case "disabled": | ||
288 | 489 | var expectedSecondStepperColour = stepperBgColorDisabled | ||
289 | 490 | var expectedSecondStepperIconColour = stepperImgColorDisabled | ||
290 | 491 | break | ||
291 | 492 | case "normal": | ||
292 | 493 | var expectedSecondStepperColour = stepperBgColorNormal | ||
293 | 494 | var expectedSecondStepperIconColour = stepperImgColorNormal | ||
294 | 495 | break | ||
295 | 496 | case "hovered": | ||
296 | 497 | var expectedSecondStepperColour = stepperBgColorOnHover | ||
297 | 498 | var expectedSecondStepperIconColour = stepperImgColorOnHover | ||
298 | 499 | break | ||
299 | 500 | case "pressed": | ||
300 | 501 | var expectedSecondStepperColour = stepperBgColorOnPressed | ||
301 | 502 | var expectedSecondStepperIconColour = stepperImgColorOnPressed | ||
302 | 503 | break | ||
303 | 504 | default: | ||
304 | 505 | fail("Invalid stepper state string") | ||
305 | 506 | } | ||
306 | 507 | |||
307 | 508 | var msg = "First stepper expected state: " + firstStepperStateString + "." | ||
308 | 509 | + " Second stepper expected state: " + secondStepperStateString + ". " | ||
309 | 510 | + " Test description: " + testDescription + ". " | ||
310 | 511 | + " Error encountered: " | ||
311 | 512 | |||
312 | 513 | //compare() returns pass on different colours, see https://bugreports.qt.io/browse/QTBUG-34878 | ||
313 | 514 | compare(Qt.colorEqual(firstStepper.color, expectedFirstStepperColour), true, | ||
314 | 515 | msg + "wrong first stepper background color.") | ||
315 | 516 | compare(Qt.colorEqual(firstStepperIcon.color, expectedFirstStepperIconColour), true, | ||
316 | 517 | msg + "wrong first stepper icon color.") | ||
317 | 518 | compare(Qt.colorEqual(secondStepper.color, expectedSecondStepperColour), true, | ||
318 | 519 | msg + "wrong second stepper background color.") | ||
319 | 520 | compare(Qt.colorEqual(secondStepperIcon.color, expectedSecondStepperIconColour), true, | ||
320 | 521 | msg + "wrong second stepper icon color.") | ||
321 | 522 | } | ||
322 | 523 | |||
323 | 524 | function test_checkStepperStatesStyling(data) { | ||
324 | 525 | var freshTestItem = getFreshFlickable(data.alignment) | ||
325 | 526 | var flickable = freshTestItem.flickable | ||
326 | 527 | var scrollbar = freshTestItem.scrollbar | ||
327 | 528 | var style = scrollbar.__styleInstance | ||
328 | 529 | var firstStepper = getFirstStepper(scrollbar) | ||
329 | 530 | var secondStepper = getSecondStepper(scrollbar) | ||
330 | 531 | |||
331 | 532 | triggerSteppersMode(scrollbar) | ||
332 | 533 | |||
333 | 534 | //the following tests are assuming that the steppers are not disabled | ||
334 | 535 | compare(style.isScrollable, true, "Scrollbar is not scrollable, cannot test steppers hover/pressed state.") | ||
335 | 475 | 536 | ||
336 | 476 | if (style.isVertical) { | 537 | if (style.isVertical) { |
337 | 477 | compare(style.flickableItem.atYBeginning, true, "View not scrolled to the beginning as expected.") | 538 | compare(style.flickableItem.atYBeginning, true, "View not scrolled to the beginning as expected.") |
338 | @@ -482,38 +543,17 @@ | |||
339 | 482 | } | 543 | } |
340 | 483 | 544 | ||
341 | 484 | //Check that the first stepper is disabled and the second one is in normal state | 545 | //Check that the first stepper is disabled and the second one is in normal state |
350 | 485 | compare(Qt.colorEqual(firstStepper.color, stepperBgColorDisabled), true, | 546 | checkSteppersColour(scrollbar, "disabled", "normal", "default state before moving mouse") |
351 | 486 | "Wrong first stepper bg color in disabled state.") | 547 | |
352 | 487 | compare(Qt.colorEqual(firstStepperIcon.color, stepperImgColorDisabled), true, | 548 | //Check that hovering on a disabled stepper does not change its colour |
353 | 488 | "Wrong first stepper img color in disabled state.") | 549 | mouseMove(firstStepper, firstStepper.width/2, firstStepper.height/2) |
354 | 489 | compare(Qt.colorEqual(secondStepper.color, stepperBgColorNormal), true, | 550 | checkSteppersColour(scrollbar, "disabled", "normal", "mouse hovered to disabled first stepper") |
347 | 490 | "Wrong second stepper bg color when it should be in normal state.") | ||
348 | 491 | compare(Qt.colorEqual(secondStepperIcon.color, stepperImgColorNormal), true, | ||
349 | 492 | "Wrong second stepper img color when it should be in normal state.") | ||
355 | 493 | 551 | ||
356 | 494 | //Check that tapping on a disabled stepper does not change its colour | 552 | //Check that tapping on a disabled stepper does not change its colour |
357 | 495 | mousePress(firstStepper, firstStepper.width/2, firstStepper.height/2) | 553 | mousePress(firstStepper, firstStepper.width/2, firstStepper.height/2) |
366 | 496 | compare(Qt.colorEqual(firstStepper.color, stepperBgColorDisabled), true, | 554 | checkSteppersColour(scrollbar, "disabled", "normal", "mouse pressed on disabled first stepper") |
359 | 497 | "Pressing first stepper changes its bg colour even when it's disabled.") | ||
360 | 498 | compare(Qt.colorEqual(firstStepperIcon.color, stepperImgColorDisabled), true, | ||
361 | 499 | "Pressing first stepper changes its img colour even when it's disabled.") | ||
362 | 500 | compare(Qt.colorEqual(secondStepper.color, stepperBgColorNormal), true, | ||
363 | 501 | "Wrong second stepper bg color when it should be in normal state.") | ||
364 | 502 | compare(Qt.colorEqual(secondStepperIcon.color, stepperImgColorNormal), true, | ||
365 | 503 | "Wrong second stepper img color when it should be in normal state.") | ||
367 | 504 | mouseRelease(firstStepper, firstStepper.width/2, firstStepper.height/2) | 555 | mouseRelease(firstStepper, firstStepper.width/2, firstStepper.height/2) |
368 | 505 | 556 | ||
369 | 506 | //Check that hovering on a disabled stepper does not change its colour | ||
370 | 507 | mouseMove(firstStepper, firstStepper.width/2, firstStepper.height/2) | ||
371 | 508 | compare(Qt.colorEqual(firstStepper.color, stepperBgColorDisabled), true, | ||
372 | 509 | "Hovering on first stepper changes its bg colour even when it's disabled.") | ||
373 | 510 | compare(Qt.colorEqual(firstStepperIcon.color, stepperImgColorDisabled), true, | ||
374 | 511 | "Hovering on first stepper changes its img colour even when it's disabled.") | ||
375 | 512 | compare(Qt.colorEqual(secondStepper.color, stepperBgColorNormal), true, | ||
376 | 513 | "Wrong second stepper bg color when it should be in normal state.") | ||
377 | 514 | compare(Qt.colorEqual(secondStepperIcon.color, stepperImgColorNormal), true, | ||
378 | 515 | "Wrong second stepper img color when it should be in normal state.") | ||
379 | 516 | |||
380 | 517 | //move mouse away from the steppers | 557 | //move mouse away from the steppers |
381 | 518 | mouseMove(scrollbar, 0, 0) | 558 | mouseMove(scrollbar, 0, 0) |
382 | 519 | 559 | ||
383 | @@ -533,44 +573,23 @@ | |||
384 | 533 | } | 573 | } |
385 | 534 | 574 | ||
386 | 535 | 575 | ||
396 | 536 | //Check that the first stepper is disabled and the second one is in normal state | 576 | //Check that the first stepper is normal and the second one is in disable state |
397 | 537 | compare(Qt.colorEqual(firstStepper.color, stepperBgColorNormal), true, | 577 | checkSteppersColour(scrollbar, "normal", "disabled", "after thumb dragged to bottom and mouse moved away from steppers.") |
398 | 538 | "Wrong first stepper bg color when it should be in normal state.") | 578 | |
399 | 539 | compare(Qt.colorEqual(firstStepperIcon.color, stepperImgColorNormal), true, | 579 | //Check that hovering on a disabled stepper does not change its colour |
400 | 540 | "Wrong first stepper img color when it should be in normal state.") | 580 | mouseMove(secondStepper, secondStepper.width/2, secondStepper.height/2) |
401 | 541 | compare(Qt.colorEqual(secondStepper.color, stepperBgColorDisabled), true, | 581 | checkSteppersColour(scrollbar, "normal", "disabled", "thumb at the bottom, mouse hovered on disabled second stepper") |
393 | 542 | "Wrong second stepper bg color in disabled state.") | ||
394 | 543 | compare(Qt.colorEqual(secondStepperIcon.color, stepperImgColorDisabled), true, | ||
395 | 544 | "Wrong second stepper img color in disabled state.") | ||
402 | 545 | 582 | ||
403 | 546 | //Check that tapping on a disabled stepper does not change its colour | 583 | //Check that tapping on a disabled stepper does not change its colour |
404 | 547 | mousePress(secondStepper, secondStepper.width/2, secondStepper.height/2) | 584 | mousePress(secondStepper, secondStepper.width/2, secondStepper.height/2) |
413 | 548 | compare(Qt.colorEqual(firstStepper.color, stepperBgColorNormal), true, | 585 | checkSteppersColour(scrollbar, "normal", "disabled", "thumb at the bottom, mouse pressed on disabled second stepper") |
406 | 549 | "Wrong first stepper bg color when it should be in normal state.") | ||
407 | 550 | compare(Qt.colorEqual(firstStepperIcon.color, stepperImgColorNormal), true, | ||
408 | 551 | "Wrong first stepper img color when it should be in normal state.") | ||
409 | 552 | compare(Qt.colorEqual(secondStepper.color, stepperBgColorDisabled), true, | ||
410 | 553 | "Pressing second stepper changes its bg colour even when it's disabled.") | ||
411 | 554 | compare(Qt.colorEqual(secondStepperIcon.color, stepperImgColorDisabled), true, | ||
412 | 555 | "Pressing second stepper changes its img colour even when it's disabled.") | ||
414 | 556 | mouseRelease(secondStepper, secondStepper.width/2, secondStepper.height/2) | 586 | mouseRelease(secondStepper, secondStepper.width/2, secondStepper.height/2) |
415 | 557 | 587 | ||
416 | 558 | //Check that hovering on a disabled stepper does not change its colour | ||
417 | 559 | mouseMove(secondStepper, secondStepper.width/2, secondStepper.height/2) | ||
418 | 560 | compare(Qt.colorEqual(firstStepper.color, stepperBgColorNormal), true, | ||
419 | 561 | "Wrong first stepper bg color when it should be in normal state.") | ||
420 | 562 | compare(Qt.colorEqual(firstStepperIcon.color, stepperImgColorNormal), true, | ||
421 | 563 | "Wrong first stepper img color when it should be in normal state.") | ||
422 | 564 | compare(Qt.colorEqual(secondStepper.color, stepperBgColorDisabled), true, | ||
423 | 565 | "Hovering on second stepper changes its bg colour even when it's disabled.") | ||
424 | 566 | compare(Qt.colorEqual(secondStepperIcon.color, stepperImgColorDisabled), true, | ||
425 | 567 | "Hovering on second stepper changes its img colour even when it's disabled.") | ||
426 | 568 | |||
427 | 569 | //move mouse away from the steppers | 588 | //move mouse away from the steppers |
428 | 570 | mouseMove(scrollbar, 0, 0) | 589 | mouseMove(scrollbar, 0, 0) |
429 | 571 | 590 | ||
432 | 572 | //trigger first stepper to scroll down a bit, so that they're both not disabled | 591 | //trigger first stepper to scroll up a bit, so that they're both not disabled |
433 | 573 | //scrolling down with a stepper should not scroll to the top, unless there's a bug somewhere else | 592 | //scrolling up with a stepper should not scroll to the top, unless there's a bug somewhere else |
434 | 574 | //or the flickable test item gets changed | 593 | //or the flickable test item gets changed |
435 | 575 | clickInTheMiddle(firstStepper) | 594 | clickInTheMiddle(firstStepper) |
436 | 576 | checkScrolling(flickable, style.flickableItem.contentX, style.flickableItem.contentY, style, | 595 | checkScrolling(flickable, style.flickableItem.contentX, style.flickableItem.contentY, style, |
437 | @@ -589,65 +608,46 @@ | |||
438 | 589 | mouseMove(scrollbar, 0, 0) | 608 | mouseMove(scrollbar, 0, 0) |
439 | 590 | 609 | ||
440 | 591 | //Check colours in normal state | 610 | //Check colours in normal state |
449 | 592 | compare(Qt.colorEqual(firstStepper.color, stepperBgColorNormal), true, | 611 | checkSteppersColour(scrollbar, "normal", "normal", "mouse moved away from steppers") |
442 | 593 | "Wrong first stepper bg color in normal state.") | ||
443 | 594 | compare(Qt.colorEqual(firstStepperIcon.color, stepperImgColorNormal), true, | ||
444 | 595 | "Wrong first stepper img color in normal state.") | ||
445 | 596 | compare(Qt.colorEqual(secondStepper.color, stepperBgColorNormal), true, | ||
446 | 597 | "Wrong second stepper bg color in normal state.") | ||
447 | 598 | compare(Qt.colorEqual(secondStepperIcon.color, stepperImgColorNormal), true, | ||
448 | 599 | "Wrong second stepper img color in normal state.") | ||
450 | 600 | 612 | ||
451 | 601 | //Hover on first stepper and check colour of both steppers | 613 | //Hover on first stepper and check colour of both steppers |
452 | 602 | mouseMove(firstStepper, firstStepper.width/2, firstStepper.height/2) | 614 | mouseMove(firstStepper, firstStepper.width/2, firstStepper.height/2) |
462 | 603 | //compare() returns pass on different colours, see https://bugreports.qt.io/browse/QTBUG-34878 | 615 | checkSteppersColour(scrollbar, "hovered", "normal", "mouse hovered on first stepper") |
454 | 604 | compare(Qt.colorEqual(firstStepper.color, stepperBgColorOnHover), true, | ||
455 | 605 | "Wrong first stepper bg color on hover.") | ||
456 | 606 | compare(Qt.colorEqual(firstStepperIcon.color, stepperImgColorOnHover), true, | ||
457 | 607 | "Wrong first stepper img color on hover.") | ||
458 | 608 | compare(Qt.colorEqual(secondStepper.color, stepperBgColorNormal), true, | ||
459 | 609 | "Wrong second stepper bg color when hovering on first stepper.") | ||
460 | 610 | compare(Qt.colorEqual(secondStepperIcon.color, stepperImgColorNormal), true, | ||
461 | 611 | "Wrong second stepper img color when hovering on first stepper.") | ||
463 | 612 | 616 | ||
464 | 613 | //Press on first stepper and check colour of both steppers | 617 | //Press on first stepper and check colour of both steppers |
465 | 614 | mousePress(firstStepper, firstStepper.width/2, firstStepper.height/2) | 618 | mousePress(firstStepper, firstStepper.width/2, firstStepper.height/2) |
474 | 615 | compare(Qt.colorEqual(firstStepper.color, stepperBgColorOnPressed), true, | 619 | checkSteppersColour(scrollbar, "pressed", "normal", "mouse pressed on first stepper") |
467 | 616 | "Wrong first stepper bg color on pressed.") | ||
468 | 617 | compare(Qt.colorEqual(firstStepperIcon.color, stepperImgColorOnPressed), true, | ||
469 | 618 | "Wrong first stepper img color on pressed.") | ||
470 | 619 | compare(Qt.colorEqual(secondStepper.color, stepperBgColorNormal), true, | ||
471 | 620 | "Wrong second stepper bg color when pressing on first stepper.") | ||
472 | 621 | compare(Qt.colorEqual(secondStepperIcon.color, stepperImgColorNormal), true, | ||
473 | 622 | "Wrong second stepper img color when pressing on first stepper.") | ||
475 | 623 | mouseRelease(firstStepper, firstStepper.width/2, firstStepper.height/2) | 620 | mouseRelease(firstStepper, firstStepper.width/2, firstStepper.height/2) |
476 | 624 | 621 | ||
477 | 625 | //Hover on second stepper and check colour of both steppers | 622 | //Hover on second stepper and check colour of both steppers |
478 | 626 | mouseMove(secondStepper, secondStepper.width/2, secondStepper.height/2) | 623 | mouseMove(secondStepper, secondStepper.width/2, secondStepper.height/2) |
487 | 627 | compare(Qt.colorEqual(firstStepper.color, stepperBgColorNormal), true, | 624 | checkSteppersColour(scrollbar, "normal", "hovered", "mouse hovered on second stepper") |
480 | 628 | "Wrong first stepper bg color when hovering on second stepper.") | ||
481 | 629 | compare(Qt.colorEqual(firstStepperIcon.color, stepperImgColorNormal), true, | ||
482 | 630 | "Wrong first stepper img color when hovering on second stepper.") | ||
483 | 631 | compare(Qt.colorEqual(secondStepper.color, stepperBgColorOnHover), true, | ||
484 | 632 | "Wrong second stepper bg color on hover.") | ||
485 | 633 | compare(Qt.colorEqual(secondStepperIcon.color, stepperImgColorOnHover), true, | ||
486 | 634 | "Wrong second stepper img color on hover.") | ||
488 | 635 | 625 | ||
489 | 636 | //Press on second stepper and check colour of both steppers | 626 | //Press on second stepper and check colour of both steppers |
490 | 637 | mousePress(secondStepper, secondStepper.width/2, secondStepper.height/2) | 627 | mousePress(secondStepper, secondStepper.width/2, secondStepper.height/2) |
500 | 638 | compare(Qt.colorEqual(firstStepper.color, stepperBgColorNormal), true, | 628 | checkSteppersColour(scrollbar, "normal", "pressed", "mouse pressed on second stepper") |
501 | 639 | "Wrong first stepper bg color when pressing on second stepper.") | 629 | mouseRelease(secondStepper, secondStepper.width/2, secondStepper.height/2) |
502 | 640 | compare(Qt.colorEqual(firstStepperIcon.color, stepperImgColorNormal), true, | 630 | |
503 | 641 | "Wrong first stepper img color when pressing on second stepper.") | 631 | //Check that pressing on a stepper (mouse-only) will activate the hover state |
504 | 642 | compare(Qt.colorEqual(secondStepper.color, stepperBgColorOnPressed), true, | 632 | //even without a mouse move (i.e. without onEntered/onExited, which can often |
505 | 643 | "Wrong second stepper bg color on pressed.") | 633 | //happen in unit tests) |
506 | 644 | compare(Qt.colorEqual(secondStepperIcon.color, stepperImgColorOnPressed), true, | 634 | |
507 | 645 | "Wrong second stepper img color on pressed.") | 635 | //Press on first stepper without first firing mouseMove and check colour of both steppers |
508 | 646 | mouseRelease(secondStepper, secondStepper.width/2, secondStepper.height/2) | 636 | mousePress(firstStepper, firstStepper.width/2, firstStepper.height/2) |
509 | 637 | checkSteppersColour(scrollbar, "pressed", "normal", "mouse pressed on first stepper without sending mouseMove before") | ||
510 | 638 | mouseRelease(firstStepper, firstStepper.width/2, firstStepper.height/2) | ||
511 | 639 | checkSteppersColour(scrollbar, "hovered", "normal", "after mouse released while on first stepper") | ||
512 | 640 | |||
513 | 641 | //Press on second stepper without first firing mouseMove and check colour of both steppers | ||
514 | 642 | mousePress(secondStepper, secondStepper.width/2, secondStepper.height/2) | ||
515 | 643 | checkSteppersColour(scrollbar, "normal", "pressed", "mouse pressed on second stepper without sending mouseMove before") | ||
516 | 644 | mouseRelease(secondStepper, secondStepper.width/2, secondStepper.height/2) | ||
517 | 645 | checkSteppersColour(scrollbar, "normal", "hovered", "after mouse released while on second stepper") | ||
518 | 647 | } | 646 | } |
519 | 648 | 647 | ||
522 | 649 | //test dragging the thumb and relative visual changes due to hover/pressed states | 648 | |
523 | 650 | function test_dragThumbAndCheckStyling(data) { | 649 | //test that moving the mouse inside and outside any of the hover area borders has the expected effect |
524 | 650 | function test_thumbHoverArea(data) { | ||
525 | 651 | var freshTestItem = getFreshFlickable(data.alignment) | 651 | var freshTestItem = getFreshFlickable(data.alignment) |
526 | 652 | var flickable = freshTestItem.flickable | 652 | var flickable = freshTestItem.flickable |
527 | 653 | var scrollbar = freshTestItem.scrollbar | 653 | var scrollbar = freshTestItem.scrollbar |
528 | @@ -673,7 +673,7 @@ | |||
529 | 673 | //check colour of the thumb in normal state | 673 | //check colour of the thumb in normal state |
530 | 674 | compare(Qt.colorEqual(thumb.color, thumbNormalColor), true, "Wrong thumb color in normal state.") | 674 | compare(Qt.colorEqual(thumb.color, thumbNormalColor), true, "Wrong thumb color in normal state.") |
531 | 675 | 675 | ||
533 | 676 | //check hovered colour | 676 | //hover on the middle |
534 | 677 | mouseMove(thumb, thumb.width/2, thumb.height/2) | 677 | mouseMove(thumb, thumb.width/2, thumb.height/2) |
535 | 678 | compare(Qt.colorEqual(thumb.color, thumbHoveredColor), true, "Wrong thumb color in hover state.") | 678 | compare(Qt.colorEqual(thumb.color, thumbHoveredColor), true, "Wrong thumb color in hover state.") |
536 | 679 | 679 | ||
537 | @@ -695,6 +695,102 @@ | |||
538 | 695 | compare(Qt.colorEqual(thumb.color, thumbHoveredColor), true, | 695 | compare(Qt.colorEqual(thumb.color, thumbHoveredColor), true, |
539 | 696 | "Thumb does not show as hovered after mouse press-release inside it.") | 696 | "Thumb does not show as hovered after mouse press-release inside it.") |
540 | 697 | 697 | ||
541 | 698 | //depending on how the implementation of the scrollbar evolves, the input area | ||
542 | 699 | //may become bigger than the trough on one or both sides, so we map the coords | ||
543 | 700 | //to know where to send events relative to the thumb so that they hit the trough | ||
544 | 701 | //(which is part of the hover area, along the scrolling axis, i.e. x-axis for vert.scrollbar) | ||
545 | 702 | var mappedCoords = thumb.mapToItem(trough, 0, 0) | ||
546 | 703 | |||
547 | 704 | //mouseMove seem to deliver events at pixel bound, so we have to take the floor of the sizes | ||
548 | 705 | //otherwise if thumb has width 50.6, mouseMove(thumb, 50.6, 0) will send an event to x==51 and that | ||
549 | 706 | //will cause the logic to assume the mouse is outside the hover area while it's on the border | ||
550 | 707 | var floorThumbWidth = Math.floor(thumb.width) | ||
551 | 708 | var floorThumbHeight = Math.floor(thumb.height) | ||
552 | 709 | var floorTroughWidth = Math.floor(trough.width) | ||
553 | 710 | var floorTroughHeight = Math.floor(trough.height) | ||
554 | 711 | |||
555 | 712 | //top-left and bottom-right coords of the rectangle defining the thumb hover area | ||
556 | 713 | //we need different handling of vertical/horizontal because the hover area is defined | ||
557 | 714 | //as the whole trough along the scrolling axis (e.g. whole trough width for the vert. scrollbar) | ||
558 | 715 | //and exactly the thumb along the non-scrolling axis (e.g. thumb's height for vert. scrollbar | ||
559 | 716 | if (style.isVertical) { | ||
560 | 717 | var insideTopLeft = [-mappedCoords.x , 0 ] | ||
561 | 718 | var insideBottomRight = [-mappedCoords.x + floorTroughWidth, floorThumbHeight] | ||
562 | 719 | } else { | ||
563 | 720 | var insideTopLeft = [0 , -mappedCoords.y ] | ||
564 | 721 | var insideBottomRight = [floorThumbWidth, -mappedCoords.y + floorTroughHeight] | ||
565 | 722 | } | ||
566 | 723 | mouseMove(thumb, insideTopLeft[0], insideTopLeft[1]) | ||
567 | 724 | compare(Qt.colorEqual(thumb.color, thumbHoveredColor), true, | ||
568 | 725 | "Thumb does not show as hovered after mouse moved to the top-left corner of the hover area.") | ||
569 | 726 | mouseMove(thumb, insideBottomRight[0], insideBottomRight[1]) | ||
570 | 727 | compare(Qt.colorEqual(thumb.color, thumbHoveredColor), true, | ||
571 | 728 | "Thumb does not show as hovered after mouse moved to the bottom-right corner of the hover area.") | ||
572 | 729 | |||
573 | 730 | //right outside the hover area | ||
574 | 731 | var outsideTopBorder = [insideTopLeft[0] , insideTopLeft[1] - 1] //move 1 up | ||
575 | 732 | var outsideLeftBorder = [insideTopLeft[0] - 1 , insideTopLeft[1]] //move 1 left | ||
576 | 733 | var outsideBottomBorder = [insideBottomRight[0] , insideBottomRight[1] + 1] //move 1 down | ||
577 | 734 | var outsideRightBorder = [insideBottomRight[0] + 1 , insideBottomRight[1]] //move 1 right | ||
578 | 735 | |||
579 | 736 | //check that when the mouse is right outside the borders of the hover area the thumb will use the non-hover colour | ||
580 | 737 | mouseMove(thumb, outsideTopBorder[0], outsideTopBorder[1]) | ||
581 | 738 | compare(Qt.colorEqual(thumb.color, thumbNormalColor), true, | ||
582 | 739 | "Thumb does not show as NOT-hovered after mouse moved outside the top border of the hover area.") | ||
583 | 740 | mouseMove(thumb, outsideBottomBorder[0], outsideBottomBorder[1]) | ||
584 | 741 | compare(Qt.colorEqual(thumb.color, thumbNormalColor), true, | ||
585 | 742 | "Thumb does not show as NOT-hovered after mouse moved outside the bottom border of the hover area.") | ||
586 | 743 | mouseMove(thumb, outsideLeftBorder[0], outsideLeftBorder[1]) | ||
587 | 744 | compare(Qt.colorEqual(thumb.color, thumbNormalColor), true, | ||
588 | 745 | "Thumb does not show as NOT-hovered after mouse moved outside the left border of the hover area.") | ||
589 | 746 | mouseMove(thumb, outsideRightBorder[0], outsideRightBorder[1]) | ||
590 | 747 | compare(Qt.colorEqual(thumb.color, thumbNormalColor), true, | ||
591 | 748 | "Thumb does not show as NOT-hovered after mouse moved outside the right border of the hover area.") | ||
592 | 749 | |||
593 | 750 | //BUG #1616926 | ||
594 | 751 | //check pressind on the THUMB and releasing mouse outside the TROUGH resets it to normal state | ||
595 | 752 | //press thumb, move mouse outside the trough and check that the thumb is not showing as hovered | ||
596 | 753 | //The broken logic was just checking if mouse was inside the thumb | ||
597 | 754 | //on the same axis as the scrolling one (so y for vertical scrollbar, x for horizontal) so we move | ||
598 | 755 | //mouse in the opposite axis (i.e. along x if vertical scrollbar) to check that the bug is fixed | ||
599 | 756 | mousePress(thumb, thumb.width/2, thumb.height/2) | ||
600 | 757 | if (style.isVertical) { | ||
601 | 758 | mouseMove(thumb, outsideLeftBorder[0], outsideLeftBorder[1]) | ||
602 | 759 | compare(Qt.colorEqual(thumb.color, thumbPressedColor), true, "Wrong THUMB color in pressed state.") | ||
603 | 760 | mouseRelease(thumb, outsideLeftBorder[0], outsideLeftBorder[1]) | ||
604 | 761 | compare(Qt.colorEqual(thumb.color, thumbNormalColor), true, "Wrong THUMB color after releasing mouse with x outside TROUGH.") | ||
605 | 762 | } else { | ||
606 | 763 | mouseMove(thumb, outsideTopBorder[0], outsideTopBorder[1]) | ||
607 | 764 | compare(Qt.colorEqual(thumb.color, thumbPressedColor), true, "Wrong THUMB color in pressed state.") | ||
608 | 765 | mouseRelease(thumb, outsideTopBorder[0], outsideTopBorder[1]) | ||
609 | 766 | compare(Qt.colorEqual(thumb.color, thumbNormalColor), true, "Wrong THUMB color after releasing mouse with y outside TROUGH.") | ||
610 | 767 | } | ||
611 | 768 | } | ||
612 | 769 | |||
613 | 770 | //test dragging the thumb and relative visual changes due to hover/pressed states | ||
614 | 771 | function test_dragThumbAndCheckStyling(data) { | ||
615 | 772 | var freshTestItem = getFreshFlickable(data.alignment) | ||
616 | 773 | var flickable = freshTestItem.flickable | ||
617 | 774 | var scrollbar = freshTestItem.scrollbar | ||
618 | 775 | var thumb = getThumb(scrollbar) | ||
619 | 776 | var thumbArea = getThumbArea(scrollbar) | ||
620 | 777 | var trough = getTrough(scrollbar) | ||
621 | 778 | var style = freshTestItem.scrollbar.__styleInstance | ||
622 | 779 | var scrollbarUtils = getScrollbarUtils(scrollbar) | ||
623 | 780 | var secondStepper = getSecondStepper(scrollbar) | ||
624 | 781 | var thumbNormalColor = Qt.rgba(style.sliderColor.r, style.sliderColor.g, style.sliderColor.b, | ||
625 | 782 | style.sliderColor.a * 0.4) | ||
626 | 783 | var thumbHoveredColor = Qt.rgba(style.sliderColor.r, style.sliderColor.g, style.sliderColor.b, | ||
627 | 784 | style.sliderColor.a * 0.7) | ||
628 | 785 | var thumbPressedColor = Qt.rgba(style.sliderColor.r, style.sliderColor.g, style.sliderColor.b, | ||
629 | 786 | style.sliderColor.a * 1.0) | ||
630 | 787 | |||
631 | 788 | addContentMargins(flickable) | ||
632 | 789 | |||
633 | 790 | setContentPositionToTopLeft(flickable) | ||
634 | 791 | |||
635 | 792 | triggerSteppersMode(scrollbar) | ||
636 | 793 | |||
637 | 698 | if (style.isVertical) { | 794 | if (style.isVertical) { |
638 | 699 | mouseDrag(thumb, thumb.width/2, thumb.height/2, 0, trough.height) | 795 | mouseDrag(thumb, thumb.width/2, thumb.height/2, 0, trough.height) |
639 | 700 | compare(flickable[scrollbarUtils.propContent], | 796 | compare(flickable[scrollbarUtils.propContent], |
640 | @@ -1072,6 +1168,22 @@ | |||
641 | 1072 | 1168 | ||
642 | 1073 | } | 1169 | } |
643 | 1074 | 1170 | ||
644 | 1171 | //check that the mouse filters handling the interactions with the thumb and steppers | ||
645 | 1172 | //ignore the synthesized events. This is required to have the correct hover handling, | ||
646 | 1173 | //because it's the way we make sure that the hover logic is only called for real mouse | ||
647 | 1174 | //events, and not touch-to-mouse synthesized events | ||
648 | 1175 | function test_ignoreSynthesizedEventsInMouseFilters() { | ||
649 | 1176 | var scrollbar = defaultValuesScrollbar | ||
650 | 1177 | var style = scrollbar.__styleInstance | ||
651 | 1178 | var thumbArea = getThumbArea(scrollbar) | ||
652 | 1179 | var steppersMouseArea = getSteppersMouseArea(scrollbar) | ||
653 | 1180 | |||
654 | 1181 | compare(thumbArea.Mouse.ignoreSynthesizedEvents, true, | ||
655 | 1182 | "The mouse filter in the thumb MouseArea does not ignore synthesized events. Hover state logic may be affected.") | ||
656 | 1183 | compare(steppersMouseArea.Mouse.ignoreSynthesizedEvents, true, | ||
657 | 1184 | "The mouse filter in the steppers MouseArea does not ignore synthesized events. Hover state logic may be affected.") | ||
658 | 1185 | } | ||
659 | 1186 | |||
660 | 1075 | function test_defaultStylingValues() { | 1187 | function test_defaultStylingValues() { |
661 | 1076 | var scrollbar = defaultValuesScrollbar | 1188 | var scrollbar = defaultValuesScrollbar |
662 | 1077 | var style = scrollbar.__styleInstance | 1189 | var style = scrollbar.__styleInstance |