diff --git a/dots/.config/quickshell/ii/modules/common/widgets/ChoreographerGridLayout.qml b/dots/.config/quickshell/ii/modules/common/widgets/ChoreographerGridLayout.qml index 97223d904..b723cc27e 100644 --- a/dots/.config/quickshell/ii/modules/common/widgets/ChoreographerGridLayout.qml +++ b/dots/.config/quickshell/ii/modules/common/widgets/ChoreographerGridLayout.qml @@ -14,7 +14,7 @@ GridLayout { readonly property int count: choreographableChildren.length children: choreographableChildren - property bool shown: true + property bool shown: false onShownChanged: { // When hiding, hide all at once if (!shown) { diff --git a/dots/.config/quickshell/ii/modules/common/widgets/ChoreographerLoader.qml b/dots/.config/quickshell/ii/modules/common/widgets/ChoreographerLoader.qml new file mode 100644 index 000000000..c2950146f --- /dev/null +++ b/dots/.config/quickshell/ii/modules/common/widgets/ChoreographerLoader.qml @@ -0,0 +1,7 @@ +pragma ComponentBehavior: Bound +import QtQuick + +FadeLoader { + id: root + onActiveChanged: item.shown = true +} diff --git a/dots/.config/quickshell/ii/modules/common/widgets/VisuallyCenteredStyledText.qml b/dots/.config/quickshell/ii/modules/common/widgets/VisuallyCenteredStyledText.qml index 77e353ce6..1390d2caa 100644 --- a/dots/.config/quickshell/ii/modules/common/widgets/VisuallyCenteredStyledText.qml +++ b/dots/.config/quickshell/ii/modules/common/widgets/VisuallyCenteredStyledText.qml @@ -5,6 +5,7 @@ import QtQuick.Layouts Item { id: root + property alias textWidget: textWidget property alias text: textWidget.text property alias horizontalAlignment: textWidget.horizontalAlignment property alias verticalAlignment: textWidget.verticalAlignment @@ -27,7 +28,10 @@ Item { StyledText { id: textWidget - anchors.horizontalCenter: parent.horizontalCenter + anchors { + left: parent.left + right: parent.right + } y: { const value = (parent.height - textMetrics.height) / 2; return root.lowerBias ? Math.ceil(value) : Math.round(value); diff --git a/dots/.config/quickshell/ii/modules/hefty/topLayer/bar/widgets/HSystemInfo.qml b/dots/.config/quickshell/ii/modules/hefty/topLayer/bar/widgets/HSystemInfo.qml index 62fa558c1..64966abda 100644 --- a/dots/.config/quickshell/ii/modules/hefty/topLayer/bar/widgets/HSystemInfo.qml +++ b/dots/.config/quickshell/ii/modules/hefty/topLayer/bar/widgets/HSystemInfo.qml @@ -29,19 +29,17 @@ HBarWidgetWithPopout { onClicked: root.showPopup = !root.showPopup property var activeItem: vertical ? verticalContent : horizontalContent - W.FadeLoader { + Loader { id: horizontalContent anchors.fill: parent - shown: !contentRoot.vertical - + active: !contentRoot.vertical sourceComponent: HorizontalSysInfo {} } - W.FadeLoader { + Loader { id: verticalContent anchors.fill: parent - shown: contentRoot.vertical - + active: contentRoot.vertical sourceComponent: HorizontalSysInfo {} } @@ -135,43 +133,46 @@ HBarWidgetWithPopout { } } - component SysInfoPopupContent: W.ChoreographerGridLayout { - id: popupRoot - rowSpacing: 8 + component SysInfoPopupContent: W.ChoreographerLoader { + sourceComponent: W.ChoreographerGridLayout { + id: popupRoot + rowSpacing: 8 - onShownChanged: { - if (shown) { - powerProfileSelection.focusSelectedChild() + onShownChanged: { + if (shown) { + powerProfileSelection.focusSelectedChild(); + } } - } - W.FlyFadeEnterChoreographable { - Layout.fillWidth: true + W.FlyFadeEnterChoreographable { + Layout.fillWidth: true - RowLayout { - spacing: 10 + RowLayout { + spacing: 10 + width: parent.width - W.CircularProgress { - implicitSize: 46 - lineWidth: 3 - value: S.Battery.percentage - W.MaterialSymbol { - anchors.centerIn: parent - iconSize: 22 - text: { - if (root.chargingAndNotFull) - return "battery_android_plus"; - if (root.powerSaving) - return "energy_savings_leaf"; - return "battery_android_full"; + W.CircularProgress { + implicitSize: notSoImportantBatteryStats.implicitHeight + lineWidth: 3 + value: S.Battery.percentage + W.MaterialSymbol { + anchors.centerIn: parent + iconSize: 22 + fill: 1 + animateChange: true + text: { + if (root.chargingAndNotFull) + return "bolt"; + if (root.powerSaving) + return "energy_savings_leaf"; + if (PowerProfiles.profile == PowerProfile.Performance) + return "local_fire_department"; + return "battery_android_full"; + } } } - } - ColumnLayout { - Layout.fillWidth: true - spacing: 0 RowLayout { - Layout.fillWidth: true + Layout.fillWidth: false spacing: 4 W.StyledText { Layout.alignment: Qt.AlignBaseline @@ -182,55 +183,59 @@ HBarWidgetWithPopout { W.StyledText { Layout.alignment: Qt.AlignBaseline text: { - if (!S.Battery.knownEnergyRate) + if (!S.Battery.knownEnergyRate) return S.Battery.isCharging ? S.Translation.tr("Charging") : S.Translation.tr("Discharging"); return S.Battery.isCharging ? S.Translation.tr("to full") : S.Translation.tr("remaining"); } } } - RowLayout { + Item { Layout.fillWidth: true + } + ColumnLayout { + id: notSoImportantBatteryStats + Layout.fillWidth: false + spacing: 4 StatWithIcon { visible: S.Battery.knownEnergyRate - Layout.fillWidth: true + Layout.alignment: Qt.AlignLeft icon: "bolt" - value: `${S.Battery.energyRate.toFixed(2)}W` + value: `${S.Battery.energyRate.toFixed(1)}W` + longestValueString: "69.0W" } StatWithIcon { - Layout.fillWidth: true - icon: "heart_check" - value: `${(S.Battery.health).toFixed(1)}%` + Layout.alignment: Qt.AlignLeft + icon: "favorite" + value: `${(S.Battery.health).toFixed(1 * (S.Battery.health < 100))}%` + longestValueString: "69.0%" } } } } - } - W.FlyFadeEnterChoreographable { - Layout.fillWidth: true - W.ConfigSelectionArray { - id: powerProfileSelection - currentValue: PowerProfiles.profile - onSelected: newValue => { - PowerProfiles.profile = newValue - } - options: [ - { - displayName: S.Translation.tr("Power saver"), - // icon: "line_curve", - value: PowerProfile.PowerSaver - }, - { - displayName: S.Translation.tr("Balanced"), - // icon: "page_header", - value: PowerProfile.Balanced - }, - { - displayName: S.Translation.tr("Performance"), - // icon: "toolbar", - value: PowerProfile.Performance + W.FlyFadeEnterChoreographable { + Layout.fillWidth: true + W.ConfigSelectionArray { + id: powerProfileSelection + currentValue: PowerProfiles.profile + onSelected: newValue => { + PowerProfiles.profile = newValue; } - ] + options: [ + { + displayName: S.Translation.tr("Power saver"), + value: PowerProfile.PowerSaver + }, + { + displayName: S.Translation.tr("Balanced"), + value: PowerProfile.Balanced + }, + { + displayName: S.Translation.tr("Performance"), + value: PowerProfile.Performance + } + ] + } } } } @@ -239,6 +244,7 @@ HBarWidgetWithPopout { id: statItem required property string icon required property string value + property string longestValueString implicitWidth: statRow.implicitWidth implicitHeight: statRow.implicitHeight RowLayout { @@ -249,11 +255,16 @@ HBarWidgetWithPopout { Layout.fillWidth: false Layout.alignment: Qt.AlignVCenter text: statItem.icon + fill: 1 + iconSize: 16 } - W.VisuallyCenteredStyledText { - Layout.fillWidth: false - Layout.fillHeight: true - text: statItem.value + W.FixedWidthTextContainer { + longestText: statItem.longestValueString + W.VisuallyCenteredStyledText { + anchors.fill: parent + horizontalAlignment: Text.AlignLeft + text: statItem.value + } } Item { Layout.fillWidth: true diff --git a/dots/.config/quickshell/ii/modules/hefty/topLayer/bar/widgets/HTime.qml b/dots/.config/quickshell/ii/modules/hefty/topLayer/bar/widgets/HTime.qml index 1de60905a..7f754722b 100644 --- a/dots/.config/quickshell/ii/modules/hefty/topLayer/bar/widgets/HTime.qml +++ b/dots/.config/quickshell/ii/modules/hefty/topLayer/bar/widgets/HTime.qml @@ -34,20 +34,18 @@ HBarWidgetWithPopout { property Item activeItem: vertical ? verticalContent : horizontalContent // When horizontal - W.FadeLoader { + Loader { id: horizontalContent anchors.fill: parent - shown: !contentRoot.vertical - + active: !contentRoot.vertical sourceComponent: HorizontalClock {} } // When vertical - W.FadeLoader { + Loader { id: verticalContent anchors.fill: parent - shown: contentRoot.vertical - + active: contentRoot.vertical sourceComponent: VerticalClock {} } @@ -155,124 +153,126 @@ HBarWidgetWithPopout { } } - component PopupContent: W.ChoreographerGridLayout { - id: popupRoot + component PopupContent: W.ChoreographerLoader { + sourceComponent: W.ChoreographerGridLayout { + id: popupRoot - property real buttonSize: C.Appearance.rounding.normal * 2 - property real buttonSpacing: 4 + property real buttonSize: C.Appearance.rounding.normal * 2 + property real buttonSpacing: 4 - rowSpacing: 2 + rowSpacing: 2 - W.FlyFadeEnterChoreographable { - Layout.fillWidth: true - Layout.bottomMargin: 6 + W.FlyFadeEnterChoreographable { + Layout.fillWidth: true + Layout.bottomMargin: 6 - RowLayout { - width: parent.width - spacing: 0 + RowLayout { + width: parent.width + spacing: 0 - W.StyledText { - Layout.leftMargin: 6 - Layout.alignment: Qt.AlignVCenter - Layout.fillWidth: true - text: calendarView.title - font.pixelSize: C.Appearance.font.pixelSize.larger - elide: Text.ElideRight - color: C.Appearance.colors.colSecondary - } - W.StyledIconButton { - implicitSize: 30 - text: "chevron_left" - iconSize: 20 - onClicked: calendarView.scrollMonthsAndSnap(-1) - colForeground: C.Appearance.colors.colPrimary - } - W.StyledIconButton { - implicitSize: 30 - text: "chevron_right" - iconSize: 20 - onClicked: calendarView.scrollMonthsAndSnap(1) - colForeground: C.Appearance.colors.colPrimary - } - W.StyledIconButton { - implicitSize: 30 - text: "rotate_left" - iconSize: 20 - onClicked: calendarView.scrollToToday() - colForeground: C.Appearance.colors.colPrimary - enabled: calendarView.targetWeekDiff != 0 + W.StyledText { + Layout.leftMargin: 6 + Layout.alignment: Qt.AlignVCenter + Layout.fillWidth: true + text: calendarView.title + font.pixelSize: C.Appearance.font.pixelSize.larger + elide: Text.ElideRight + color: C.Appearance.colors.colSecondary + } + W.StyledIconButton { + implicitSize: 30 + text: "chevron_left" + iconSize: 20 + onClicked: calendarView.scrollMonthsAndSnap(-1) + colForeground: C.Appearance.colors.colPrimary + } + W.StyledIconButton { + implicitSize: 30 + text: "chevron_right" + iconSize: 20 + onClicked: calendarView.scrollMonthsAndSnap(1) + colForeground: C.Appearance.colors.colPrimary + } + W.StyledIconButton { + implicitSize: 30 + text: "rotate_left" + iconSize: 20 + onClicked: calendarView.scrollToToday() + colForeground: C.Appearance.colors.colPrimary + enabled: calendarView.targetWeekDiff != 0 + } } } - } - W.FlyFadeEnterChoreographable { - Layout.alignment: Qt.AlignHCenter + W.FlyFadeEnterChoreographable { + Layout.alignment: Qt.AlignHCenter - W.CalendarDaysOfWeek { - locale: calendarView.locale - spacing: popupRoot.buttonSpacing - delegate: Item { - id: dowItem - required property var model - implicitWidth: popupRoot.buttonSize - implicitHeight: dowText.implicitHeight + W.CalendarDaysOfWeek { + locale: calendarView.locale + spacing: popupRoot.buttonSpacing + delegate: Item { + id: dowItem + required property var model + implicitWidth: popupRoot.buttonSize + implicitHeight: dowText.implicitHeight - W.VisuallyCenteredStyledText { - id: dowText - anchors.centerIn: parent - font.pixelSize: C.Appearance.font.pixelSize.smaller - color: C.Appearance.colors.colOutline - text: { - var result = dowItem.model.shortName; - if (C.Config.options.calendar.force2CharDayOfWeek) - result = result.substring(0, 2); - return result; + W.VisuallyCenteredStyledText { + id: dowText + anchors.centerIn: parent + font.pixelSize: C.Appearance.font.pixelSize.smaller + color: C.Appearance.colors.colOutline + text: { + var result = dowItem.model.shortName; + if (C.Config.options.calendar.force2CharDayOfWeek) + result = result.substring(0, 2); + return result; + } } } } } - } - W.FlyFadeEnterChoreographable { - Item { - implicitWidth: calendarView.implicitWidth - calendarView.horizontalPadding * 2 - implicitHeight: calendarView.implicitHeight - calendarView.verticalPadding * 2 - W.CalendarView { - id: calendarView - anchors.centerIn: parent - locale: Qt.locale(C.Config.options.calendar.locale) - verticalPadding: 4 - horizontalPadding: 4 - buttonSize: popupRoot.buttonSize - buttonSpacing: popupRoot.buttonSpacing - buttonVerticalSpacing: popupRoot.buttonSpacing - Layout.fillWidth: true + W.FlyFadeEnterChoreographable { + Item { + implicitWidth: calendarView.implicitWidth - calendarView.horizontalPadding * 2 + implicitHeight: calendarView.implicitHeight - calendarView.verticalPadding * 2 + W.CalendarView { + id: calendarView + anchors.centerIn: parent + locale: Qt.locale(C.Config.options.calendar.locale) + verticalPadding: 4 + horizontalPadding: 4 + buttonSize: popupRoot.buttonSize + buttonSpacing: popupRoot.buttonSpacing + buttonVerticalSpacing: popupRoot.buttonSpacing + Layout.fillWidth: true - delegate: W.StyledButton { - id: dayButton - required property var model + delegate: W.StyledButton { + id: dayButton + required property var model - focus: model.today - checked: model.today - enabled: model.month === calendarView.focusedMonth - implicitWidth: popupRoot.buttonSize - implicitHeight: popupRoot.buttonSize - width: implicitWidth - height: implicitHeight - text: model.day + focus: model.today + checked: model.today + enabled: model.month === calendarView.focusedMonth + implicitWidth: popupRoot.buttonSize + implicitHeight: popupRoot.buttonSize + width: implicitWidth + height: implicitHeight + text: model.day - Connections { - target: popupRoot - enabled: dayButton.model.today - function onShownChanged() { - if (popupRoot.shown) - dayButton.forceActiveFocus(); + Connections { + target: popupRoot + enabled: dayButton.model.today + function onShownChanged() { + if (popupRoot.shown) + dayButton.forceActiveFocus(); + } } - } - contentItem: Item { - W.VisuallyCenteredStyledText { - anchors.centerIn: parent - text: dayButton.text - color: dayButton.colForeground + contentItem: Item { + W.VisuallyCenteredStyledText { + anchors.centerIn: parent + text: dayButton.text + color: dayButton.colForeground + } } } }