feat: 💄 make the popup more consistent with the Plasma OSDs

Now the popup spawns a little bit lower the center of the screen, with
smaller text and constant width.
This commit is contained in:
Mikhail Zolotukhin 2021-10-22 22:07:45 +03:00
parent c7e272af82
commit 8d6a3747e6
2 changed files with 29 additions and 18 deletions

View File

@ -22,7 +22,7 @@ Item {
function show(text) {
var area = workspace.clientArea(KWin.FullScreenArea, workspace.activeScreen, workspace.currentDesktop);
this.item.show(text, area, 1000);
this.item.show(text, area);
}
}

View File

@ -1,17 +1,20 @@
// SPDX-FileCopyrightText: 2018-2019 Eon S. Jeon <esjeon@hyunmu.am>
// SPDX-FileCopyrightText: 2021 Mikhail Zolotukhin <mail@genda.life>
//
// SPDX-License-Identifier: MIT
import QtQuick 2.0
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.15
import org.kde.plasma.core 2.0 as PlasmaCore;
import org.kde.plasma.components 3.0 as PC3
/*
* Component Documentation
* - PlasmaCore global `theme` object:
* https://techbase.kde.org/Development/Tutorials/Plasma2/QML2/API#Plasma_Themes
* https://api.kde.org/frameworks/plasma-framework/html/classPlasma_1_1Theme.html
* - PlasmaCore.Dialog:
* https://techbase.kde.org/Development/Tutorials/Plasma2/QML2/API#Top_Level_windows
* https://api.kde.org/frameworks/plasma-framework/html/classPlasmaQuick_1_1Dialog.html
*/
PlasmaCore.Dialog {
@ -23,20 +26,21 @@ PlasmaCore.Dialog {
visible: false
mainItem: Item {
width: messageLabel.implicitWidth
height: messageLabel.implicitHeight
mainItem: RowLayout {
id: main
// Make popup size consistent with the other Plasma OSD (e.g. PulseAudio one)
Layout.minimumWidth: Math.max(messageLabel.implicitWidth, PlasmaCore.Units.gridUnit * 15)
Layout.minimumHeight: PlasmaCore.Units.gridUnit * 1.35
Label {
PC3.Label {
id: messageLabel
padding: 10
// TODO: customizable font & size ????
font.pointSize: Math.round(theme.defaultFont.pointSize * 2)
font.weight: Font.Bold
anchors.fill: parent
// This font size matches the one from Pulse Audio OSD for consistency
font.pointSize: PlasmaCore.Theme.defaultFont.pointSize * 1.2
horizontalAlignment: Text.AlignHCenter
}
/* hides the popup window when triggered */
// Hides the popup window when triggered
Timer {
id: hideTimer
repeat: false
@ -48,20 +52,27 @@ PlasmaCore.Dialog {
}
Component.onCompleted: {
/* NOTE: IDK what this is, but this is necessary to keep the window working. */
// NOTE: IDK what this is, but this is necessary to keep the window working.
KWin.registerWindow(this);
}
function show(text, area, duration) {
function show(text, area) {
// Abort any previous timers
hideTimer.stop();
// Set the text for the popup
messageLabel.text = text;
this.x = (area.x + area.width / 2) - this.width / 2;
this.y = (area.y + area.height / 2) - this.height / 2;
// Width and height are not computed before the popup is visible
// therefore we need to make is visible sooner
this.visible = true;
hideTimer.interval = duration;
// Spawn popup a little bit lower than the center of the screen for consistency
this.x = (area.x + area.width / 2) - this.width / 2;
this.y = (area.y + area.height * 2 / 3) - this.height / 2;
// Start popup hide timer
hideTimer.interval = 3000;
hideTimer.start();
}
}