git.iko.soy/unity8
on xenial help sign in
Added blur and darkening to wallpaper while in spread

Approved by: Lukáš Tinkl

commit6813eb0bf40cab3931492a4134422cce0bea3e5d authorMichael Zanetti <michael.zanetti@canonical.com> dateWed 9 Nov 2016, 15:05 (10 years ago) parentb343d7ed0c9ba0
2 files changed+38−42
compare with xenial
unifiedsplit
qml/Components/BlurLayer.qml+10−40 qml/Stage/Stage.qml+28−2
qml/Components/BlurLayer.qml+10−40
@@ -20,50 +20,20 @@ import QtGraphicalEffects 1.0
2020Item {
2121 id: root
2222
23− property alias source: shaderEffectSource.sourceItem
24− property alias saturation: desaturateEffect.saturationValue
25− property alias blurRadius: fastBlur.radius
26−
27− readonly property alias ready: shaderEffectSource.ready
28−
29− ShaderEffect {
30− id: desaturateEffect
31− anchors.fill: root
32−
33− property real saturationValue: 1
34−
35− property variant source: ShaderEffectSource {
36− id: shaderEffectSource
37− hideSource: root.visible
38− live: !root.visible
39− property bool ready: false;
40− onLiveChanged: {
41− if (!live) {
42− ready = false;
43− scheduleUpdate();
44− }
45− }
46− onScheduledUpdateCompleted: ready = true;
47− }
48−
49− fragmentShader: "
50− varying highp vec2 qt_TexCoord0;
51− uniform sampler2D source;
52− uniform lowp float saturationValue;
53− void main(void)
54− {
55− highp vec4 sourceColor = texture2D(source, qt_TexCoord0);
56− highp vec4 scaledColor = sourceColor * vec4(0.3, 0.59, 0.11, 1.0);
57− lowp float luminance = scaledColor.r + scaledColor.g + scaledColor.b ;
58− gl_FragColor = mix(vec4(luminance, luminance, luminance, sourceColor.a), sourceColor, saturationValue);
59− }"
60− }
23+ property alias source: fastBlur.source
24+ property real brightness: 1
25+ property real blurRadius: 0
6126
6227 FastBlur {
6328 id: fastBlur
6429 anchors.fill: parent
65− source: desaturateEffect
6630 visible: radius > 0
67− radius: 0
31+ radius: Math.max(root.blurRadius, 0)
32+ }
33+
34+ Rectangle {
35+ anchors.fill: parent
36+ color: "black"
37+ opacity: 1 - root.brightness
6838 }
6939}
qml/Stage/Stage.qml+28−2
@@ -54,7 +54,7 @@ FocusScope {
5454
5555 // Used by the tutorial code
5656 readonly property bool spreadShown: state == "spread"
57− readonly property real rightEdgeDragProgress: rightEdgeDragArea.progress // How far left the stage has been dragged
57+ readonly property real rightEdgeDragProgress: rightEdgeDragArea.dragging ? rightEdgeDragArea.progress : 0 // How far left the stage has been dragged
5858
5959 // used by the snap windows (edge maximize) feature
6060 readonly property alias previewRectangle: fakeRectangle
@@ -409,12 +409,22 @@ FocusScope {
409409 PropertyChanges { target: hoverMouseArea; enabled: true }
410410 PropertyChanges { target: rightEdgeDragArea; enabled: false }
411411 PropertyChanges { target: cancelSpreadMouseArea; enabled: true }
412+ PropertyChanges { target: blurLayer; visible: true; blurRadius: 32; brightness: .65; opacity: 1 }
413+ PropertyChanges { target: wallpaper; visible: false }
412414 },
413415 State {
414416 name: "stagedRightEdge"; when: (rightEdgeDragArea.dragging || edgeBarrier.progress > 0) && root.mode == "staged"
417+ PropertyChanges {
418+ target: blurLayer;
419+ visible: true;
420+ blurRadius: 32
421+ brightness: .65
422+ opacity: 1
423+ }
415424 },
416425 State {
417426 name: "sideStagedRightEdge"; when: (rightEdgeDragArea.dragging || edgeBarrier.progress > 0) && root.mode == "stagedWithSideStage"
427+ extend: "stagedRightEdge"
418428 PropertyChanges {
419429 target: sideStage
420430 opacity: priv.sideStageDelegate.x === sideStage.x ? 1 : 0
@@ -423,9 +433,17 @@ FocusScope {
423433 },
424434 State {
425435 name: "windowedRightEdge"; when: (rightEdgeDragArea.dragging || edgeBarrier.progress > 0) && root.mode == "windowed"
436+ PropertyChanges {
437+ target: blurLayer;
438+ visible: true
439+ blurRadius: 32
440+ brightness: .65
441+ opacity: MathUtils.linearAnimation(spreadItem.rightEdgeBreakPoint, 1, 0, 1, Math.max(rightEdgeDragArea.progress, edgeBarrier.progress))
442+ }
426443 },
427444 State {
428445 name: "staged"; when: root.mode === "staged"
446+ PropertyChanges { target: wallpaper; visible: false }
429447 },
430448 State {
431449 name: "stagedWithSideStage"; when: root.mode === "stagedWithSideStage"
@@ -440,6 +458,7 @@ FocusScope {
440458 Transition {
441459 from: "stagedRightEdge,sideStagedRightEdge,windowedRightEdge"; to: "spread"
442460 PropertyAction { target: spreadItem; property: "highlightedIndex"; value: -1 }
461+ PropertyAnimation { target: blurLayer; properties: "brightness,blurRadius"; duration: priv.animationDuration }
443462 },
444463 Transition {
445464 to: "spread"
@@ -494,6 +513,13 @@ FocusScope {
494513 z: -2
495514 }
496515
516+ BlurLayer {
517+ id: blurLayer
518+ anchors.fill: parent
519+ source: wallpaper
520+ visible: false
521+ }
522+
497523 Spread {
498524 id: spreadItem
499525 objectName: "spreadItem"
@@ -1730,7 +1756,7 @@ FocusScope {
17301756 property var gesturePoints: []
17311757 property bool cancelled: false
17321758
1733− property real progress: dragging ? -touchPosition.x / root.width : 0
1759+ property real progress: -touchPosition.x / root.width
17341760 onProgressChanged: {
17351761 if (dragging) {
17361762 draggedProgress = progress;