Created
June 20, 2017 23:45
-
-
Save Zren/8515913f9de052e4f219700fb2c0525a to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import QtQuick 2.5 | |
Item { | |
id: root | |
width: 720 | |
height: 480 | |
property Item currentImage: imageB | |
property Item otherImage: imageA | |
property bool ready: false | |
property int fillMode: Image.PreserveAspectCrop | |
readonly property var wallpapers: [ | |
'/home/chris/Pictures/Wallpapers/Current/alena-aenami-over-the-city1k.jpg', | |
'/home/chris/Pictures/Wallpapers/Current/alena-aenami-million-little-pieces-1k.jpg', | |
] | |
readonly property int wallpaperIndex: 0 | |
readonly property string modelImage: wallpapers[wallpaperIndex] | |
Timer { | |
interval: 5000 | |
running: true | |
repeat: true | |
onTriggered: wallpaperIndex = (wallpaperIndex + 1) % wallpapers.length | |
} | |
onModelImageChanged: { | |
console.log('onModelImageChanged', modelImage) | |
fadeWallpaper(); | |
} | |
function fadeWallpaper() { | |
console.log('fadeWallpaper') | |
if (!ready && width > 0 && height > 0) { // shell startup, setup immediately | |
currentImage.sourceSize = Qt.size(root.width, root.height) | |
currentImage.source = modelImage | |
ready = true | |
return | |
} | |
fadeAnim.running = false | |
swapImages() | |
currentImage.source = modelImage | |
currentImage.sourceSize = Qt.size(root.width, root.height) | |
// Prevent source size change when image has just been setup anyway | |
sourceSizeTimer.stop() | |
currentImage.opacity = 0 | |
otherImage.z = 0 | |
currentImage.z = 1 | |
// only cross-fade if the new image could be smaller than the old one | |
fadeOtherAnimator.enabled = Qt.binding(function() { | |
console.log('fadeOtherAnimator.enabled in fadeWallpaper', currentImage.paintedWidth, otherImage.paintedWidth, currentImage.paintedHeight, otherImage.paintedHeight) | |
return currentImage.paintedWidth < otherImage.paintedWidth || currentImage.paintedHeight < otherImage.paintedHeight | |
}) | |
// Alleviate stuttering by waiting with the fade animation until the image is loaded (or failed to) | |
fadeAnim.running = Qt.binding(function() { | |
console.log('fadeAnim.running in fadeWallpaper', currentImage.status, otherImage.status) | |
return currentImage.status !== Image.Loading && otherImage.status !== Image.Loading | |
}) | |
} | |
function swapImages() { | |
if (currentImage == imageA) { | |
console.log('swapImages imageA=>imageB', imageB.source) | |
currentImage = imageB | |
otherImage = imageA | |
} else { | |
console.log('swapImages imageB=>imageA', imageA.source) | |
currentImage = imageA | |
otherImage = imageB | |
} | |
} | |
Timer { | |
id: sourceSizeTimer | |
interval: 1000 // always delay reloading the image even when animations are turned off | |
onTriggered: fadeSourceSize() | |
} | |
function fadeSourceSize() { | |
if (currentImage.sourceSize === Qt.size(root.width, root.height)) { | |
return | |
} | |
fadeAnim.running = false | |
swapImages() | |
currentImage.sourceSize = Qt.size(root.width, root.height) | |
currentImage.opacity = 0 | |
currentImage.source = otherImage.source | |
otherImage.z = 0 | |
currentImage.z = 1 | |
fadeOtherAnimator.enabled = false // the image size didn't change, avoid cross-dissolve | |
fadeAnim.running = Qt.binding(function() { | |
console.log('fadeAnim.running in fadeSourceSize', currentImage.status, otherImage.status) | |
return currentImage.status !== Image.Loading && otherImage.status !== Image.Loading | |
}) | |
} | |
SequentialAnimation { | |
id: fadeAnim | |
running: false | |
ParallelAnimation { | |
OpacityAnimator { | |
target: currentImage | |
from: 0 | |
to: 1 | |
duration: fadeOtherAnimator.duration | |
} | |
OpacityAnimator { | |
id: fadeOtherAnimator | |
property bool enabled: true | |
target: otherImage | |
from: 1 | |
// cannot disable an animation individually, so we just fade from 1 to 1 | |
to: enabled ? 0 : 1 | |
//use configured duration if animations are enabled | |
duration: 1000 | |
} | |
} | |
ScriptAction { | |
script: { | |
otherImage.fillMode = fillMode; | |
otherImage.source = ""; | |
console.log('ScriptAction.done') | |
} | |
} | |
} | |
Rectangle { | |
id: backgroundColor | |
anchors.fill: parent | |
visible: ready && (currentImage.status === Image.Ready || otherImage.status === Image.Ready) | |
color: "black" | |
Behavior on color { | |
ColorAnimation { duration: 400 } | |
} | |
} | |
Image { | |
id: imageA | |
anchors.fill: parent | |
asynchronous: true | |
cache: false | |
fillMode: root.fillMode | |
autoTransform: true //new API in Qt 5.5, do not backport into Plasma 5.4. | |
} | |
Image { | |
id: imageB | |
anchors.fill: parent | |
asynchronous: true | |
cache: false | |
fillMode: root.fillMode | |
autoTransform: true //new API in Qt 5.5, do not backport into Plasma 5.4. | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment