From 250398dc0d005ae4ec0fe5f0840e3ef19a15065d Mon Sep 17 00:00:00 2001 From: Alexey Andreyev Date: Mon, 22 Feb 2021 04:10:45 +0300 Subject: [PATCH] Fancy effects: lightness and particle improvements Add custom images for Image Particles. Improve fireworks particle lifetime and colors. Improve snow visibility according to background color. Improve confetti animation. --- .../Component/FancyEffectsContainer.qml | 70 ++++++++++-------- imports/NeoChat/Component/confetti.png | Bin 0 -> 1052 bytes imports/NeoChat/Component/glowdot.png | Bin 0 -> 1613 bytes res.qrc | 2 + 4 files changed, 43 insertions(+), 29 deletions(-) create mode 100644 imports/NeoChat/Component/confetti.png create mode 100644 imports/NeoChat/Component/glowdot.png diff --git a/imports/NeoChat/Component/FancyEffectsContainer.qml b/imports/NeoChat/Component/FancyEffectsContainer.qml index 91d22d30e..a6d894b8c 100644 --- a/imports/NeoChat/Component/FancyEffectsContainer.qml +++ b/imports/NeoChat/Component/FancyEffectsContainer.qml @@ -14,6 +14,8 @@ Item { id: item property bool enabled: false property int effectInterval: Kirigami.Units.veryLongDuration*10; + property color darkSnowColor: "grey" + property bool isThemeDark: Kirigami.Theme.backgroundColor.hslLightness <= darkSnowColor.hslLightness function showConfettiEffect() { confettiTimer.start() @@ -61,12 +63,13 @@ Item { } } - ItemParticle { - delegate: Rectangle { - width: Kirigami.Units.iconSizes.small - height: Kirigami.Units.iconSizes.smallMedium - color: Qt.hsla(Math.random(), 0.5, 0.6, 1) - } + ImageParticle { + source: "qrc:/imports/NeoChat/Component/confetti.png" + entryEffect: ImageParticle.Scale + rotationVariation: 360 + rotationVelocity: 90 + color: Qt.hsla(Math.random(), 0.5, 0.6, 1) + colorVariation: 1 } Emitter { @@ -76,9 +79,9 @@ Item { top: parent.top } - sizeVariation: Kirigami.Units.iconSizes.medium + sizeVariation: Kirigami.Units.iconSizes.small/2 lifeSpan: Kirigami.Units.veryLongDuration*10 - size: Kirigami.Units.iconSizes.large + size: Kirigami.Units.iconSizes.small velocity: AngleDirection { angle: 90 @@ -127,7 +130,7 @@ Item { width: 10 height: width radius: width - color: "white" + color: item.isThemeDark ? "white" : darkSnowColor scale: Math.random() opacity: Math.random() } @@ -175,8 +178,11 @@ Item { running: false repeat: true onTriggered: { - customEmit(Math.random() * parent.width, - Math.random() * parent.height) + var x = Math.random() * parent.width + var y = Math.random() * parent.height + customEmit(x, y) + customEmit(x, y) + customEmit(x, y) } } @@ -202,44 +208,49 @@ Item { ImageParticle { id: fireworksParticleA system: fireworksSystem - source: "qrc:///particleresources/glowdot.png" - alphaVariation: 0.1 - alpha: 0.1 + source: "qrc:/imports/NeoChat/Component/glowdot.png" + alphaVariation: item.isThemeDark ? 0.1 : 0.1 + alpha: item.isThemeDark ? 0.5 : 1 groups: ["a"] opacity: fireworksSystem.opacity + entryEffect: ImageParticle.Scale + rotationVariation: 360 } ImageParticle { system: fireworksSystem - source: "qrc:///particleresources/glowdot.png" - color: "white" - alphaVariation: 0.1 - alpha: 0.1 - groups: ["white"] + source: "qrc:/imports/NeoChat/Component/glowdot.png" + color: item.isThemeDark ? "white" : "gold" + alphaVariation: item.isThemeDark ? 0.1 : 0.1 + alpha: item.isThemeDark ? 0.5 : 1 + groups: ["light"] opacity: fireworksSystem.opacity + entryEffect: ImageParticle.Scale + rotationVariation: 360 } ImageParticle { id: fireworksParticleB system: fireworksSystem - source: "qrc:///particleresources/glowdot.png" - alphaVariation: 0.1 - alpha: 0.1 + source: "qrc:/imports/NeoChat/Component/glowdot.png" + alphaVariation: item.isThemeDark ? 0.1 : 0.1 + alpha: item.isThemeDark ? 0.5 : 1 groups: ["b"] opacity: fireworksSystem.opacity + entryEffect: ImageParticle.Scale + rotationVariation: 360 } Component { id: emitterComp Emitter { id: container - property int life: 2600 + property int life: 23 property real targetX: 0 property real targetY: 0 width: 1 height: 1 system: fireworksSystem - emitRate: 100 size: 16 endSize: 8 sizeVariation: 5 @@ -249,8 +260,9 @@ Item { onTriggered: { container.destroy(); var randomHue = Math.random() - fireworksParticleA.color = Qt.hsla(randomHue, 0.8, 0.5, 1) - fireworksParticleA.color = Qt.hsla(1-randomHue, 0.8, 0.5, 1) + var lightness = item.isThemeDark ? 0.8 : 0.7 + fireworksParticleA.color = Qt.hsla(randomHue, 0.8, lightness, 1) + fireworksParticleB.color = Qt.hsla(1-randomHue, 0.8, lightness, 1) } } velocity: AngleDirection {angleVariation:360; magnitude: 200} @@ -266,13 +278,13 @@ Item { obj.y = y obj.targetX = Math.random() * currentSize - currentSize/2 + obj.x obj.targetY = Math.random() * currentSize - currentSize/2 + obj.y - obj.life = Math.round(Math.random() * 2400) + 200 - obj.emitRate = Math.round(Math.random() * 32) + 32 + obj.life = Math.round(Math.random() * 23) + 150 + obj.emitRate = Math.round(Math.random() * 32) + 5 obj.lifeSpan = currentLifeSpan const group = Math.round(Math.random() * 3); switch (group) { case 0: - obj.group = "white"; + obj.group = "light"; break; case 1: obj.group = "a"; diff --git a/imports/NeoChat/Component/confetti.png b/imports/NeoChat/Component/confetti.png new file mode 100644 index 0000000000000000000000000000000000000000..ee4e08af850fbc8934268b5c6d4db3b374ecf4b4 GIT binary patch literal 1052 zcmV+%1mpXOP)28E^$tdfIC8LpqZ)LvsPoN_f@N z@{WrhdKqLYqFcty!a|U`Cn(BJfRzAPIy{4xS2B)?+SP8 z$w*ZAMA&P}0fldst~vasIN|V@Vsj}p3og~ulc-{?iuI(K79JHIN~iLA`8?_-9kI;v zqSStw16YKZBY+2uJR79Q;ggz?%xe4mCEq+*@#yk5C}4^sK~lV4QS;I@CN(a4OuiHa zmHYoZt@!wu)4d}A&9AooISeiPP~5Za-&5NzoIw0cd!2eF`H;1 zQK62g00009a7bBm000XT000XT0n*)m`~Uy~Qb|NXR9M5sm%U3IK^Vq&&qEOofM(-}%mv=jP zUU&wEacA#l-8*0Sv3GmBGtayqGw+3grzxfM#}&{7OXlxk7zRBx5kS6!OYjan)c1RC zoaixVfQVd!6)?~*0lSs}#jAK^-tf{bvJfy1s>bA6fELjLM_{5?0zPn(IE$>XY=Ys; z1Ym$?pc%7rm)(FvFq@Ttw;q#g0g@M2;Psu76fcj0KOU3YA^8HP>~V7*8kWJR>@^pxCcJCYm>lyLh3PW`(&s>e=9a-vU=bKP)D$Yv4rx6S@xpa%|6}O|t*7 W4d1yu&SIAU000028E^$tdfIC8LpqZ)LvsPoN_f@N z@{WrhdKqLYqFcty!a|U`Cn(BJfRzAPIy{4xS2B)?+SP8 z$w*ZAMA&P}0fldst~vasIN|V@Vsj}p3og~ulc-{?iuI(K79JHIN~iLA`8?_-9kI;v zqSStw16YKZBY+2uJR79Q;ggz?%xe4mCEq+*@#yk5C}4^sK~lV4QS;I@CN(a4OuiHa zmHYoZt@!wu)4d}A&9AooISeiPP~5Za-&5NzoIw0cd!2eF`H;1 zQK62g00009a7bBm000XT000XT0n*)m`~Uz1gGod|R9M5cm&tA%RTPF()$Q1B&vpg~ zAp$}m6DW{?#5`nUu>m2$jz{1P*doLeuwa!Z$btom5+MW8 z920hKRY-M<=X!)Ugja-aVL~`9tlhT(3bCWIU0A<|Kr0;=jtgBx;5*@ZAw_-$g+y4j z_+pBx1?7G}EF2VW2|wvTvxEbVz<}@w!k-pKg*o_;KQ`<+!7?uJS#E#?+q7N63E_3& znlPpH8@67CWWl)u!aiXK~^lZL~P?XCnm9T^_l z<41)W5%B(#!tcE2vimV`Ian_@z#dA8LpUSc;P7jBYCc>S{vy;Ks)CXg1dnkp zAwo6I^a*bYi^39X_I$oT;LSTB2d)UeA|#`p2k>lws0=~g+yImDRrp~pE!<0aTLUOb zds!DQk>ftR?*pOonEe%^;@W?PJ)O-0I^hV!+ez+M@oJ2GC!iIei#=7|U6!9n-ndY6 zlSB5#XcxNRD9T;`&y#aA{wQ8YaA6T5_Ls=|*-eM{VT}KS688Fp(z3dNgi>yjJt^#m zcpnNcLcS$6r;P4>+hcnUsBqMJ7d(Q46XPh;XP_QXMc?H zYLJG|fSAuLShL~<;gs;1+kI&jlo-)ZXZx6t=D8o^GcH6Rm$l3c$ScOP zgaa9}9;UnY;%w=ia1B9Uk%AeNhyM?ziOL@4#tzVJTjS|%!IC_NK$-Farh4$~LXpi!;mJSe*puJHA8n+j?2+a>yed;M>$ zErl%S``m;0Z@9=`u|1?imports/NeoChat/Menu/Timeline/MessageSourceSheet.qml imports/NeoChat/Menu/RoomListContextMenu.qml qtquickcontrols2.conf + imports/NeoChat/Component/glowdot.png + imports/NeoChat/Component/confetti.png