1
0
mirror of https://gitlab.com/kelteseth/ScreenPlay.git synced 2024-09-18 08:22:33 +02:00

Add custom background blur for popups

This commit is contained in:
Elias Steurer 2022-01-16 11:39:14 +01:00
parent 157823739d
commit 0f44db0b68
9 changed files with 135 additions and 87 deletions

View File

@ -125,6 +125,7 @@ set(QML
qml/Create/WizardsFiles/QMLWidgetMain.qml
qml/Create/WizardsFiles/QMLWallpaperMain.qml
qml/Common/LicenseSelector.qml
qml/Common/ModalBackgroundBlur.qml
qml/Common/Util.js
qml/Common/Dialogs/CriticalError.qml
qml/Common/ColorPicker.qml

View File

@ -20,14 +20,14 @@ ApplicationWindow {
function setTheme(theme) {
switch (theme) {
case Settings.System:
root.Material.theme = Material.System;
break;
root.Material.theme = Material.System
break
case Settings.Dark:
root.Material.theme = Material.Dark;
break;
root.Material.theme = Material.Dark
break
case Settings.Light:
root.Material.theme = Material.Light;
break;
root.Material.theme = Material.Light
break
}
}
@ -47,7 +47,8 @@ ApplicationWindow {
sidebar.state = "inactive"
}
color: Material.theme === Material.Dark ? Qt.darker(Material.background) : Material.background
color: Material.theme === Material.Dark ? Qt.darker(
Material.background) : Material.background
// Set visible if the -silent parameter was not set (see app.cpp end of constructor).
visible: false
width: 1400
@ -55,15 +56,14 @@ ApplicationWindow {
title: "ScreenPlay Alpha - " + ScreenPlay.version()
minimumHeight: 450
minimumWidth: 1050
flags: Qt.FramelessWindowHint |Qt.Window
flags: Qt.FramelessWindowHint | Qt.Window
// Partial workaround for
// https://bugreports.qt.io/browse/QTBUG-86047
Material.accent: Material.color(Material.Orange)
onVisibilityChanged: {
if (root.visibility === 2)
ScreenPlay.installedListModel.reset();
ScreenPlay.installedListModel.reset()
}
onClosing: {
if (ScreenPlay.screenPlayManager.activeWallpaperCounter === 0
@ -72,24 +72,22 @@ ApplicationWindow {
}
}
Component.onCompleted: {
setTheme(ScreenPlay.settings.theme);
setTheme(ScreenPlay.settings.theme)
stackView.push("qrc:/ScreenPlay/qml/Installed/Installed.qml", {
"sidebar": sidebar
})
"sidebar": sidebar
})
if (!ScreenPlay.settings.silentStart)
root.show();
root.show()
}
Item {
anchors.fill: parent
anchors.margins: 1
Item {
id: content
anchors.fill: parent
anchors.margins: 1
Connections {
function onThemeChanged(theme) {
setTheme(theme);
setTheme(theme)
}
target: ScreenPlay.settings
@ -97,7 +95,7 @@ ApplicationWindow {
Connections {
function onRequestNavigation(nav) {
switchPage(nav);
switchPage(nav)
}
target: ScreenPlay.util
@ -105,7 +103,7 @@ ApplicationWindow {
Connections {
function onRequestRaise() {
root.show();
root.show()
}
target: ScreenPlay.screenPlayManager
@ -113,13 +111,16 @@ ApplicationWindow {
Dialogs.SteamNotAvailable {
id: dialogSteam
modalSource: content
}
Dialogs.MonitorConfiguration {
modalSource: content
}
Dialogs.CriticalError {
window: root
modalSource: content
}
Common.TrayIcon {
@ -152,7 +153,6 @@ ApplicationWindow {
duration: stackView.duration
easing.type: Easing.InOutQuart
}
}
replaceExit: Transition {
@ -169,24 +169,22 @@ ApplicationWindow {
duration: stackView.duration
easing.type: Easing.InOutQuart
}
}
}
Connections {
function onSetSidebarActive(active) {
if (active)
sidebar.state = "active";
sidebar.state = "active"
else
sidebar.state = "inactive";
sidebar.state = "inactive"
}
function onSetNavigationItem(pos) {
if (pos === 0)
nav.onPageChanged("Create");
nav.onPageChanged("Create")
else
nav.onPageChanged("Workshop");
nav.onPageChanged("Workshop")
}
target: stackView.currentItem
@ -203,79 +201,75 @@ ApplicationWindow {
right: parent.right
bottom: parent.bottom
}
}
Navigation.Navigation {
id: nav
window: root
width:parent.width
width: parent.width
modalSource: content
anchors {
top: parent.top
right: parent.right
left: parent.left
}
onChangePage: (name)=> {
monitors.close();
switchPage(name);
onChangePage: function (name) {
monitors.close()
switchPage(name)
}
}
Monitors.Monitors {
id: monitors
modalSource: content
}
}
Rectangle {
height: 1
color:"#222"
anchors{
top:parent.top
right:parent.right
left:parent.left
color: "#222"
anchors {
top: parent.top
right: parent.right
left: parent.left
}
}
Rectangle {
height: 1
color:"#222"
anchors{
bottom:parent.bottom
right:parent.right
left:parent.left
color: "#222"
anchors {
bottom: parent.bottom
right: parent.right
left: parent.left
}
}
Rectangle {
width: 1
color:"#222"
anchors{
left:parent.left
bottom:parent.bottom
top:parent.top
color: "#222"
anchors {
left: parent.left
bottom: parent.bottom
top: parent.top
}
}
Rectangle {
width: 1
color:"#222"
anchors{
right:parent.right
bottom:parent.bottom
top:parent.top
color: "#222"
anchors {
right: parent.right
bottom: parent.bottom
top: parent.top
}
}
Rectangle {
width: 15
height:width
color:"#555"
anchors{
right:parent.right
bottom:parent.bottom
height: width
color: "#555"
anchors {
right: parent.right
bottom: parent.bottom
margins: 1
}
MouseArea {
@ -285,24 +279,24 @@ ApplicationWindow {
property point clickPosition
property size originalSize
onPressed: {
maResize.clickPosition = Qt.point(maResize.mouseX, maResize.mouseY);
maResize.clickPosition = maResize.mapToGlobal(maResize.clickPosition.x , maResize.clickPosition.y )
maResize.clickPosition = Qt.point(maResize.mouseX,
maResize.mouseY)
maResize.clickPosition = maResize.mapToGlobal(
maResize.clickPosition.x, maResize.clickPosition.y)
maResize.originalSize = Qt.size(root.width, root.height)
}
onPositionChanged: {
if (maResize.pressed){
let newPos = maResize.mapToGlobal(maResize.mouseX, maResize.mouseY)
if (maResize.pressed) {
let newPos = maResize.mapToGlobal(maResize.mouseX,
maResize.mouseY)
let newPosX = newPos.x - maResize.clickPosition.x
let newPosY = newPos.y - maResize.clickPosition.y
root.setGeometry(root.x,root.y, maResize.originalSize.width + newPosX,
root.setGeometry(root.x, root.y,
maResize.originalSize.width + newPosX,
maResize.originalSize.height + newPosY)
}
}
}
}
}

View File

@ -5,14 +5,18 @@ import QtQuick.Controls.Material
import QtQuick.Window
import Qt5Compat.GraphicalEffects
import ScreenPlay 1.0
import "../"
Dialog {
id: root
property ApplicationWindow window
property string message
property var modalSource
modal: true
Overlay.modal: ModalBackgroundBlur {
sourceItem: root.modalSource
}
anchors.centerIn: Overlay.overlay
standardButtons: Dialog.Ok | Dialog.Help
onHelpRequested: {

View File

@ -3,15 +3,22 @@ import QtQuick.Controls
import QtQuick.Layouts
import QtQuick.Controls.Material
import ScreenPlay 1.0
import "../"
Dialog {
id: dialogMonitorConfigurationChanged
property var modalSource
modal: true
anchors.centerIn: Overlay.overlay
standardButtons: Dialog.Ok
contentHeight: 250
Overlay.modal: ModalBackgroundBlur {
sourceItem: root.modalSource
}
Connections {
function onMonitorConfigurationChanged() {
dialogMonitorConfigurationChanged.open();
@ -50,3 +57,4 @@ Dialog {
}
}

View File

@ -1,12 +1,18 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import "../"
Dialog {
id: dialogSteam
id: root
property var modalSource
modal: true
anchors.centerIn: Overlay.overlay
standardButtons: Dialog.Ok
title: qsTr("Could not load steam integration!")
Overlay.modal: ModalBackgroundBlur {
sourceItem: root.modalSource
}
}

View File

@ -0,0 +1,24 @@
import QtQuick
import Qt5Compat.GraphicalEffects
FastBlur {
id: root
property var sourceItem
source: ShaderEffectSource {
sourceItem: root.sourceItem
live: false
}
radius: 64
transparentBorder: true
Rectangle {
anchors.fill: parent
opacity: 0.5
color: "black"
}
Image {
anchors.fill: parent
opacity: 0.1
source: "qrc:/assets/images/noisy-texture-3.png"
fillMode: Image.Tile
}
}

View File

@ -9,7 +9,7 @@ import ScreenPlay.Enums.SearchType 1.0
import "../Common" as Common
Item {
id: navWrapper
id: root
state: "out"
height: 52
@ -182,7 +182,7 @@ Item {
name: "out"
PropertyChanges {
target: navWrapper
target: root
anchors.topMargin: -115
}
@ -191,7 +191,7 @@ Item {
name: "in"
PropertyChanges {
target: navWrapper
target: root
anchors.topMargin: 0
}
@ -203,7 +203,7 @@ Item {
to: "in"
NumberAnimation {
target: navWrapper
target: root
property: "anchors.topMargin"
duration: 400
easing.type: Easing.InOutQuart

View File

@ -9,10 +9,15 @@ import ScreenPlay.Enums.InstalledType 1.0
import "../Common/" as SP
Popup {
id: monitors
id: root
property string activeMonitorName: ""
property int activeMonitorIndex
property var modalSource
Overlay.modal: SP.ModalBackgroundBlur {
sourceItem: root.modalSource
}
width: 1000
height: 500
@ -26,7 +31,7 @@ Popup {
Connections {
function onRequestToggleWallpaperConfiguration() {
monitors.open();
root.open();
}
target: ScreenPlay.util
@ -152,7 +157,7 @@ Popup {
if (!ScreenPlay.screenPlayManager.removeAllWallpapers())
print("Unable to close all wallpaper!");
monitors.close();
root.close();
}
}
@ -169,7 +174,7 @@ Popup {
if (!ScreenPlay.screenPlayManager.removeAllWidgets())
print("Unable to close all widgets!");
monitors.close();
root.close();
}
}
@ -195,7 +200,7 @@ Popup {
DefaultVideoControls {
id: videoControlWrapper
activeMonitorIndex: monitors.activeMonitorIndex
activeMonitorIndex: root.activeMonitorIndex
state: "hidden"
anchors.fill: parent
anchors.margins: 10
@ -246,7 +251,7 @@ Popup {
icon.height: 16
icon.source: "qrc:/assets/icons/font-awsome/close.svg"
icon.color: Material.iconColor
onClicked: monitors.close()
onClicked: root.close()
anchors {
top: parent.top
@ -262,7 +267,7 @@ Popup {
Connections {
function onProfilesSaved() {
if (monitors.opened)
if (root.opened)
saveNotification.open();
}

View File

@ -16,9 +16,11 @@ Rectangle {
property var navArray: [navCreate, navWorkshop, navInstalled, navSettings, navCommunity]
property bool navActive: true
property ApplicationWindow window
property var modalSource
property int iconWidth: 16
property int iconHeight: iconWidth
signal changePage(string name)
function setActive(active) {
@ -345,6 +347,10 @@ Rectangle {
Dialog {
id: dialog
anchors.centerIn: Overlay.overlay
Overlay.modal: ModalBackgroundBlur {
sourceItem: root.modalSource
}
title: qsTr("Are you sure you want to exit ScreenPlay? \nThis will shut down all Wallpaper and Widgets.")
standardButtons: Dialog.Ok | Dialog.Cancel
onAccepted: Qt.quit()