forked from Shinonome/dots-hyprland
hefty: bar: put popups in loaders
This commit is contained in:
end-4
@@ -14,7 +14,7 @@ GridLayout {
|
|||||||
readonly property int count: choreographableChildren.length
|
readonly property int count: choreographableChildren.length
|
||||||
children: choreographableChildren
|
children: choreographableChildren
|
||||||
|
|
||||||
property bool shown: true
|
property bool shown: false
|
||||||
onShownChanged: {
|
onShownChanged: {
|
||||||
// When hiding, hide all at once
|
// When hiding, hide all at once
|
||||||
if (!shown) {
|
if (!shown) {
|
||||||
|
|||||||
@@ -0,0 +1,7 @@
|
|||||||
|
pragma ComponentBehavior: Bound
|
||||||
|
import QtQuick
|
||||||
|
|
||||||
|
FadeLoader {
|
||||||
|
id: root
|
||||||
|
onActiveChanged: item.shown = true
|
||||||
|
}
|
||||||
@@ -5,6 +5,7 @@ import QtQuick.Layouts
|
|||||||
Item {
|
Item {
|
||||||
id: root
|
id: root
|
||||||
|
|
||||||
|
property alias textWidget: textWidget
|
||||||
property alias text: textWidget.text
|
property alias text: textWidget.text
|
||||||
property alias horizontalAlignment: textWidget.horizontalAlignment
|
property alias horizontalAlignment: textWidget.horizontalAlignment
|
||||||
property alias verticalAlignment: textWidget.verticalAlignment
|
property alias verticalAlignment: textWidget.verticalAlignment
|
||||||
@@ -27,7 +28,10 @@ Item {
|
|||||||
|
|
||||||
StyledText {
|
StyledText {
|
||||||
id: textWidget
|
id: textWidget
|
||||||
anchors.horizontalCenter: parent.horizontalCenter
|
anchors {
|
||||||
|
left: parent.left
|
||||||
|
right: parent.right
|
||||||
|
}
|
||||||
y: {
|
y: {
|
||||||
const value = (parent.height - textMetrics.height) / 2;
|
const value = (parent.height - textMetrics.height) / 2;
|
||||||
return root.lowerBias ? Math.ceil(value) : Math.round(value);
|
return root.lowerBias ? Math.ceil(value) : Math.round(value);
|
||||||
|
|||||||
@@ -29,19 +29,17 @@ HBarWidgetWithPopout {
|
|||||||
onClicked: root.showPopup = !root.showPopup
|
onClicked: root.showPopup = !root.showPopup
|
||||||
property var activeItem: vertical ? verticalContent : horizontalContent
|
property var activeItem: vertical ? verticalContent : horizontalContent
|
||||||
|
|
||||||
W.FadeLoader {
|
Loader {
|
||||||
id: horizontalContent
|
id: horizontalContent
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
shown: !contentRoot.vertical
|
active: !contentRoot.vertical
|
||||||
|
|
||||||
sourceComponent: HorizontalSysInfo {}
|
sourceComponent: HorizontalSysInfo {}
|
||||||
}
|
}
|
||||||
|
|
||||||
W.FadeLoader {
|
Loader {
|
||||||
id: verticalContent
|
id: verticalContent
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
shown: contentRoot.vertical
|
active: contentRoot.vertical
|
||||||
|
|
||||||
sourceComponent: HorizontalSysInfo {}
|
sourceComponent: HorizontalSysInfo {}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -135,43 +133,46 @@ HBarWidgetWithPopout {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
component SysInfoPopupContent: W.ChoreographerGridLayout {
|
component SysInfoPopupContent: W.ChoreographerLoader {
|
||||||
id: popupRoot
|
sourceComponent: W.ChoreographerGridLayout {
|
||||||
rowSpacing: 8
|
id: popupRoot
|
||||||
|
rowSpacing: 8
|
||||||
|
|
||||||
onShownChanged: {
|
onShownChanged: {
|
||||||
if (shown) {
|
if (shown) {
|
||||||
powerProfileSelection.focusSelectedChild()
|
powerProfileSelection.focusSelectedChild();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
W.FlyFadeEnterChoreographable {
|
W.FlyFadeEnterChoreographable {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
|
|
||||||
RowLayout {
|
RowLayout {
|
||||||
spacing: 10
|
spacing: 10
|
||||||
|
width: parent.width
|
||||||
|
|
||||||
W.CircularProgress {
|
W.CircularProgress {
|
||||||
implicitSize: 46
|
implicitSize: notSoImportantBatteryStats.implicitHeight
|
||||||
lineWidth: 3
|
lineWidth: 3
|
||||||
value: S.Battery.percentage
|
value: S.Battery.percentage
|
||||||
W.MaterialSymbol {
|
W.MaterialSymbol {
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
iconSize: 22
|
iconSize: 22
|
||||||
text: {
|
fill: 1
|
||||||
if (root.chargingAndNotFull)
|
animateChange: true
|
||||||
return "battery_android_plus";
|
text: {
|
||||||
if (root.powerSaving)
|
if (root.chargingAndNotFull)
|
||||||
return "energy_savings_leaf";
|
return "bolt";
|
||||||
return "battery_android_full";
|
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 {
|
RowLayout {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: false
|
||||||
spacing: 4
|
spacing: 4
|
||||||
W.StyledText {
|
W.StyledText {
|
||||||
Layout.alignment: Qt.AlignBaseline
|
Layout.alignment: Qt.AlignBaseline
|
||||||
@@ -182,55 +183,59 @@ HBarWidgetWithPopout {
|
|||||||
W.StyledText {
|
W.StyledText {
|
||||||
Layout.alignment: Qt.AlignBaseline
|
Layout.alignment: Qt.AlignBaseline
|
||||||
text: {
|
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("Charging") : S.Translation.tr("Discharging");
|
||||||
return S.Battery.isCharging ? S.Translation.tr("to full") : S.Translation.tr("remaining");
|
return S.Battery.isCharging ? S.Translation.tr("to full") : S.Translation.tr("remaining");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
RowLayout {
|
Item {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
|
}
|
||||||
|
ColumnLayout {
|
||||||
|
id: notSoImportantBatteryStats
|
||||||
|
Layout.fillWidth: false
|
||||||
|
spacing: 4
|
||||||
StatWithIcon {
|
StatWithIcon {
|
||||||
visible: S.Battery.knownEnergyRate
|
visible: S.Battery.knownEnergyRate
|
||||||
Layout.fillWidth: true
|
Layout.alignment: Qt.AlignLeft
|
||||||
icon: "bolt"
|
icon: "bolt"
|
||||||
value: `${S.Battery.energyRate.toFixed(2)}W`
|
value: `${S.Battery.energyRate.toFixed(1)}W`
|
||||||
|
longestValueString: "69.0W"
|
||||||
}
|
}
|
||||||
StatWithIcon {
|
StatWithIcon {
|
||||||
Layout.fillWidth: true
|
Layout.alignment: Qt.AlignLeft
|
||||||
icon: "heart_check"
|
icon: "favorite"
|
||||||
value: `${(S.Battery.health).toFixed(1)}%`
|
value: `${(S.Battery.health).toFixed(1 * (S.Battery.health < 100))}%`
|
||||||
|
longestValueString: "69.0%"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
W.FlyFadeEnterChoreographable {
|
W.FlyFadeEnterChoreographable {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
W.ConfigSelectionArray {
|
W.ConfigSelectionArray {
|
||||||
id: powerProfileSelection
|
id: powerProfileSelection
|
||||||
currentValue: PowerProfiles.profile
|
currentValue: PowerProfiles.profile
|
||||||
onSelected: newValue => {
|
onSelected: newValue => {
|
||||||
PowerProfiles.profile = 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
|
|
||||||
}
|
}
|
||||||
]
|
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
|
id: statItem
|
||||||
required property string icon
|
required property string icon
|
||||||
required property string value
|
required property string value
|
||||||
|
property string longestValueString
|
||||||
implicitWidth: statRow.implicitWidth
|
implicitWidth: statRow.implicitWidth
|
||||||
implicitHeight: statRow.implicitHeight
|
implicitHeight: statRow.implicitHeight
|
||||||
RowLayout {
|
RowLayout {
|
||||||
@@ -249,11 +255,16 @@ HBarWidgetWithPopout {
|
|||||||
Layout.fillWidth: false
|
Layout.fillWidth: false
|
||||||
Layout.alignment: Qt.AlignVCenter
|
Layout.alignment: Qt.AlignVCenter
|
||||||
text: statItem.icon
|
text: statItem.icon
|
||||||
|
fill: 1
|
||||||
|
iconSize: 16
|
||||||
}
|
}
|
||||||
W.VisuallyCenteredStyledText {
|
W.FixedWidthTextContainer {
|
||||||
Layout.fillWidth: false
|
longestText: statItem.longestValueString
|
||||||
Layout.fillHeight: true
|
W.VisuallyCenteredStyledText {
|
||||||
text: statItem.value
|
anchors.fill: parent
|
||||||
|
horizontalAlignment: Text.AlignLeft
|
||||||
|
text: statItem.value
|
||||||
|
}
|
||||||
}
|
}
|
||||||
Item {
|
Item {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
|
|||||||
@@ -34,20 +34,18 @@ HBarWidgetWithPopout {
|
|||||||
property Item activeItem: vertical ? verticalContent : horizontalContent
|
property Item activeItem: vertical ? verticalContent : horizontalContent
|
||||||
|
|
||||||
// When horizontal
|
// When horizontal
|
||||||
W.FadeLoader {
|
Loader {
|
||||||
id: horizontalContent
|
id: horizontalContent
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
shown: !contentRoot.vertical
|
active: !contentRoot.vertical
|
||||||
|
|
||||||
sourceComponent: HorizontalClock {}
|
sourceComponent: HorizontalClock {}
|
||||||
}
|
}
|
||||||
|
|
||||||
// When vertical
|
// When vertical
|
||||||
W.FadeLoader {
|
Loader {
|
||||||
id: verticalContent
|
id: verticalContent
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
shown: contentRoot.vertical
|
active: contentRoot.vertical
|
||||||
|
|
||||||
sourceComponent: VerticalClock {}
|
sourceComponent: VerticalClock {}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -155,124 +153,126 @@ HBarWidgetWithPopout {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
component PopupContent: W.ChoreographerGridLayout {
|
component PopupContent: W.ChoreographerLoader {
|
||||||
id: popupRoot
|
sourceComponent: W.ChoreographerGridLayout {
|
||||||
|
id: popupRoot
|
||||||
|
|
||||||
property real buttonSize: C.Appearance.rounding.normal * 2
|
property real buttonSize: C.Appearance.rounding.normal * 2
|
||||||
property real buttonSpacing: 4
|
property real buttonSpacing: 4
|
||||||
|
|
||||||
rowSpacing: 2
|
rowSpacing: 2
|
||||||
|
|
||||||
W.FlyFadeEnterChoreographable {
|
W.FlyFadeEnterChoreographable {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
Layout.bottomMargin: 6
|
Layout.bottomMargin: 6
|
||||||
|
|
||||||
RowLayout {
|
RowLayout {
|
||||||
width: parent.width
|
width: parent.width
|
||||||
spacing: 0
|
spacing: 0
|
||||||
|
|
||||||
W.StyledText {
|
W.StyledText {
|
||||||
Layout.leftMargin: 6
|
Layout.leftMargin: 6
|
||||||
Layout.alignment: Qt.AlignVCenter
|
Layout.alignment: Qt.AlignVCenter
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
text: calendarView.title
|
text: calendarView.title
|
||||||
font.pixelSize: C.Appearance.font.pixelSize.larger
|
font.pixelSize: C.Appearance.font.pixelSize.larger
|
||||||
elide: Text.ElideRight
|
elide: Text.ElideRight
|
||||||
color: C.Appearance.colors.colSecondary
|
color: C.Appearance.colors.colSecondary
|
||||||
}
|
}
|
||||||
W.StyledIconButton {
|
W.StyledIconButton {
|
||||||
implicitSize: 30
|
implicitSize: 30
|
||||||
text: "chevron_left"
|
text: "chevron_left"
|
||||||
iconSize: 20
|
iconSize: 20
|
||||||
onClicked: calendarView.scrollMonthsAndSnap(-1)
|
onClicked: calendarView.scrollMonthsAndSnap(-1)
|
||||||
colForeground: C.Appearance.colors.colPrimary
|
colForeground: C.Appearance.colors.colPrimary
|
||||||
}
|
}
|
||||||
W.StyledIconButton {
|
W.StyledIconButton {
|
||||||
implicitSize: 30
|
implicitSize: 30
|
||||||
text: "chevron_right"
|
text: "chevron_right"
|
||||||
iconSize: 20
|
iconSize: 20
|
||||||
onClicked: calendarView.scrollMonthsAndSnap(1)
|
onClicked: calendarView.scrollMonthsAndSnap(1)
|
||||||
colForeground: C.Appearance.colors.colPrimary
|
colForeground: C.Appearance.colors.colPrimary
|
||||||
}
|
}
|
||||||
W.StyledIconButton {
|
W.StyledIconButton {
|
||||||
implicitSize: 30
|
implicitSize: 30
|
||||||
text: "rotate_left"
|
text: "rotate_left"
|
||||||
iconSize: 20
|
iconSize: 20
|
||||||
onClicked: calendarView.scrollToToday()
|
onClicked: calendarView.scrollToToday()
|
||||||
colForeground: C.Appearance.colors.colPrimary
|
colForeground: C.Appearance.colors.colPrimary
|
||||||
enabled: calendarView.targetWeekDiff != 0
|
enabled: calendarView.targetWeekDiff != 0
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
W.FlyFadeEnterChoreographable {
|
||||||
W.FlyFadeEnterChoreographable {
|
Layout.alignment: Qt.AlignHCenter
|
||||||
Layout.alignment: Qt.AlignHCenter
|
|
||||||
|
|
||||||
W.CalendarDaysOfWeek {
|
W.CalendarDaysOfWeek {
|
||||||
locale: calendarView.locale
|
locale: calendarView.locale
|
||||||
spacing: popupRoot.buttonSpacing
|
spacing: popupRoot.buttonSpacing
|
||||||
delegate: Item {
|
delegate: Item {
|
||||||
id: dowItem
|
id: dowItem
|
||||||
required property var model
|
required property var model
|
||||||
implicitWidth: popupRoot.buttonSize
|
implicitWidth: popupRoot.buttonSize
|
||||||
implicitHeight: dowText.implicitHeight
|
implicitHeight: dowText.implicitHeight
|
||||||
|
|
||||||
W.VisuallyCenteredStyledText {
|
W.VisuallyCenteredStyledText {
|
||||||
id: dowText
|
id: dowText
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
font.pixelSize: C.Appearance.font.pixelSize.smaller
|
font.pixelSize: C.Appearance.font.pixelSize.smaller
|
||||||
color: C.Appearance.colors.colOutline
|
color: C.Appearance.colors.colOutline
|
||||||
text: {
|
text: {
|
||||||
var result = dowItem.model.shortName;
|
var result = dowItem.model.shortName;
|
||||||
if (C.Config.options.calendar.force2CharDayOfWeek)
|
if (C.Config.options.calendar.force2CharDayOfWeek)
|
||||||
result = result.substring(0, 2);
|
result = result.substring(0, 2);
|
||||||
return result;
|
return result;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
W.FlyFadeEnterChoreographable {
|
||||||
W.FlyFadeEnterChoreographable {
|
Item {
|
||||||
Item {
|
implicitWidth: calendarView.implicitWidth - calendarView.horizontalPadding * 2
|
||||||
implicitWidth: calendarView.implicitWidth - calendarView.horizontalPadding * 2
|
implicitHeight: calendarView.implicitHeight - calendarView.verticalPadding * 2
|
||||||
implicitHeight: calendarView.implicitHeight - calendarView.verticalPadding * 2
|
W.CalendarView {
|
||||||
W.CalendarView {
|
id: calendarView
|
||||||
id: calendarView
|
anchors.centerIn: parent
|
||||||
anchors.centerIn: parent
|
locale: Qt.locale(C.Config.options.calendar.locale)
|
||||||
locale: Qt.locale(C.Config.options.calendar.locale)
|
verticalPadding: 4
|
||||||
verticalPadding: 4
|
horizontalPadding: 4
|
||||||
horizontalPadding: 4
|
buttonSize: popupRoot.buttonSize
|
||||||
buttonSize: popupRoot.buttonSize
|
buttonSpacing: popupRoot.buttonSpacing
|
||||||
buttonSpacing: popupRoot.buttonSpacing
|
buttonVerticalSpacing: popupRoot.buttonSpacing
|
||||||
buttonVerticalSpacing: popupRoot.buttonSpacing
|
Layout.fillWidth: true
|
||||||
Layout.fillWidth: true
|
|
||||||
|
|
||||||
delegate: W.StyledButton {
|
delegate: W.StyledButton {
|
||||||
id: dayButton
|
id: dayButton
|
||||||
required property var model
|
required property var model
|
||||||
|
|
||||||
focus: model.today
|
focus: model.today
|
||||||
checked: model.today
|
checked: model.today
|
||||||
enabled: model.month === calendarView.focusedMonth
|
enabled: model.month === calendarView.focusedMonth
|
||||||
implicitWidth: popupRoot.buttonSize
|
implicitWidth: popupRoot.buttonSize
|
||||||
implicitHeight: popupRoot.buttonSize
|
implicitHeight: popupRoot.buttonSize
|
||||||
width: implicitWidth
|
width: implicitWidth
|
||||||
height: implicitHeight
|
height: implicitHeight
|
||||||
text: model.day
|
text: model.day
|
||||||
|
|
||||||
Connections {
|
Connections {
|
||||||
target: popupRoot
|
target: popupRoot
|
||||||
enabled: dayButton.model.today
|
enabled: dayButton.model.today
|
||||||
function onShownChanged() {
|
function onShownChanged() {
|
||||||
if (popupRoot.shown)
|
if (popupRoot.shown)
|
||||||
dayButton.forceActiveFocus();
|
dayButton.forceActiveFocus();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
contentItem: Item {
|
contentItem: Item {
|
||||||
W.VisuallyCenteredStyledText {
|
W.VisuallyCenteredStyledText {
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
text: dayButton.text
|
text: dayButton.text
|
||||||
color: dayButton.colForeground
|
color: dayButton.colForeground
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user