refactor: use anchors instead of layouts
This commit is contained in:
parent
46e1127b66
commit
5fd8d0f6da
11 changed files with 186 additions and 47 deletions
|
|
@ -6,9 +6,18 @@ import QtQuick
|
|||
Singleton {
|
||||
property bool vertical: false
|
||||
|
||||
readonly property QtObject workspaces: QtObject {
|
||||
property int shown: 10
|
||||
property string style: ""
|
||||
property bool occupiedBg: false
|
||||
readonly property Sizes sizes: Sizes {}
|
||||
readonly property Workspaces workspaces: Workspaces {}
|
||||
|
||||
component Sizes: QtObject {
|
||||
readonly property int height: 50
|
||||
readonly property int floatingGap: 10
|
||||
readonly property int floatingGapLarge: 15
|
||||
}
|
||||
|
||||
component Workspaces: QtObject {
|
||||
readonly property int shown: 10
|
||||
readonly property string style: ""
|
||||
readonly property bool occupiedBg: false
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@ import "components/workspaces"
|
|||
import Quickshell
|
||||
import Quickshell.Wayland
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
|
||||
Variants {
|
||||
model: Quickshell.screens
|
||||
|
|
@ -13,46 +14,68 @@ Variants {
|
|||
id: win
|
||||
|
||||
required property ShellScreen modelData
|
||||
readonly property bool vertical: BarConfig.vertical
|
||||
|
||||
screen: modelData
|
||||
namespace: "caelestia-bar"
|
||||
color: "transparent"
|
||||
|
||||
width: content.width
|
||||
height: content.height
|
||||
|
||||
anchors.top: true
|
||||
anchors.left: true
|
||||
anchors.right: !vertical
|
||||
anchors.bottom: vertical
|
||||
anchors.right: true
|
||||
|
||||
width: contents.implicitWidth
|
||||
height: contents.implicitHeight
|
||||
// Connections {
|
||||
// target: BarConfig
|
||||
|
||||
Box {
|
||||
id: contents
|
||||
// function onVerticalChanged(): void {
|
||||
// win.visible = false;
|
||||
// if (BarConfig.vertical) {
|
||||
// win.anchors.right = false;
|
||||
// win.anchors.bottom = true;
|
||||
// } else {
|
||||
// win.anchors.bottom = false;
|
||||
// win.anchors.right = true;
|
||||
// }
|
||||
// win.visible = true;
|
||||
// }
|
||||
// }
|
||||
|
||||
padding: [Appearance.padding.normal, Appearance.padding.large, 0, Appearance.padding.large]
|
||||
// SwipeView {
|
||||
// anchors.fill: parent
|
||||
|
||||
BoxLayout {
|
||||
vertical: win.vertical
|
||||
spacing: Appearance.spacing.larger
|
||||
padding: [0, Appearance.padding.large]
|
||||
color: Appearance.alpha(Appearance.colours.base, false)
|
||||
radius: Appearance.rounding.full
|
||||
|
||||
OsIcon {}
|
||||
|
||||
Workspaces {
|
||||
vertical: win.vertical
|
||||
}
|
||||
|
||||
Clock {
|
||||
vertical: win.vertical
|
||||
}
|
||||
|
||||
ActiveWindow {
|
||||
vertical: win.vertical
|
||||
}
|
||||
}
|
||||
// }
|
||||
Pills {
|
||||
id: content
|
||||
}
|
||||
|
||||
// Box {
|
||||
// id: contents
|
||||
|
||||
// padding: [Appearance.padding.normal, Appearance.padding.large, 0, Appearance.padding.large]
|
||||
|
||||
// BoxLayout {
|
||||
// vertical: win.vertical
|
||||
// spacing: Appearance.spacing.larger
|
||||
// padding: [0, Appearance.padding.large]
|
||||
// color: Appearance.alpha(Appearance.colours.base, false)
|
||||
// radius: Appearance.rounding.full
|
||||
|
||||
// OsIcon {}
|
||||
|
||||
// Workspaces {
|
||||
// vertical: win.vertical
|
||||
// }
|
||||
|
||||
// Clock {
|
||||
// vertical: win.vertical
|
||||
// }
|
||||
|
||||
// ActiveWindow {
|
||||
// vertical: win.vertical
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
}
|
||||
}
|
||||
|
|
|
|||
105
modules/bar/Pills.qml
Normal file
105
modules/bar/Pills.qml
Normal file
|
|
@ -0,0 +1,105 @@
|
|||
pragma ComponentBehavior: Bound
|
||||
|
||||
import "root:/widgets"
|
||||
import "root:/config"
|
||||
import "components"
|
||||
import "components/workspaces"
|
||||
import Quickshell
|
||||
import Quickshell.Wayland
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
|
||||
Item {
|
||||
id: root
|
||||
|
||||
function get(horiz, vert) {
|
||||
return BarConfig.vertical ? vert : horiz;
|
||||
}
|
||||
|
||||
anchors.fill: parent
|
||||
anchors.leftMargin: get(BarConfig.sizes.floatingGapLarge, BarConfig.sizes.floatingGap)
|
||||
anchors.topMargin: get(BarConfig.sizes.floatingGap, BarConfig.sizes.floatingGapLarge)
|
||||
anchors.rightMargin: get(BarConfig.sizes.floatingGapLarge, 0)
|
||||
anchors.bottomMargin: get(0, BarConfig.sizes.floatingGapLarge)
|
||||
|
||||
width: get(-1, BarConfig.sizes.height + BarConfig.sizes.floatingGap)
|
||||
height: get(BarConfig.sizes.height + BarConfig.sizes.floatingGap, -1)
|
||||
|
||||
Pill {
|
||||
anchors.left: parent.left
|
||||
|
||||
OsIcon {
|
||||
id: osIcon
|
||||
|
||||
anchors.horizontalCenter: root.get(undefined, parent.horizontalCenter)
|
||||
anchors.verticalCenter: root.get(parent.verticalCenter, undefined)
|
||||
}
|
||||
|
||||
Workspaces {
|
||||
vertical: BarConfig.vertical
|
||||
|
||||
anchors.left: root.get(osIcon.right, undefined)
|
||||
anchors.leftMargin: root.get(Appearance.padding.smaller, 0)
|
||||
anchors.top: root.get(undefined, osIcon.bottom)
|
||||
anchors.topMargin: root.get(0, Appearance.padding.smaller)
|
||||
|
||||
anchors.horizontalCenter: root.get(undefined, parent.horizontalCenter)
|
||||
anchors.verticalCenter: root.get(parent.verticalCenter, undefined)
|
||||
}
|
||||
}
|
||||
|
||||
Pill {
|
||||
anchors.horizontalCenter: root.get(parent.horizontalCenter, undefined)
|
||||
anchors.verticalCenter: root.get(undefined, parent.verticalCenter)
|
||||
|
||||
ActiveWindow {
|
||||
vertical: BarConfig.vertical
|
||||
|
||||
anchors.horizontalCenter: root.get(undefined, parent.horizontalCenter)
|
||||
anchors.verticalCenter: root.get(parent.verticalCenter, undefined)
|
||||
}
|
||||
}
|
||||
|
||||
Pill {
|
||||
anchors.right: parent.right
|
||||
|
||||
Clock {
|
||||
vertical: BarConfig.vertical
|
||||
|
||||
anchors.horizontalCenter: root.get(undefined, parent.horizontalCenter)
|
||||
anchors.verticalCenter: root.get(parent.verticalCenter, undefined)
|
||||
}
|
||||
}
|
||||
|
||||
component Pill: Box {
|
||||
id: pill
|
||||
|
||||
color: Appearance.alpha(Appearance.colours.base, false)
|
||||
radius: Appearance.rounding.full
|
||||
padding: BarConfig.vertical ? [Appearance.padding.large, 0] : [0, Appearance.padding.large]
|
||||
|
||||
anchors.top: parent.top
|
||||
anchors.bottom: parent.bottom
|
||||
|
||||
state: BarConfig.vertical ? "vertical" : ""
|
||||
states: State {
|
||||
name: "vertical"
|
||||
|
||||
AnchorChanges {
|
||||
target: pill
|
||||
anchors.top: undefined
|
||||
anchors.bottom: undefined
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
}
|
||||
}
|
||||
|
||||
transitions: Transition {
|
||||
AnchorAnimation {
|
||||
duration: Appearance.anim.durations.normal
|
||||
easing.type: Easing.BezierSpline
|
||||
easing.bezierCurve: Appearance.anim.curves.emphasized
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -5,7 +5,7 @@ import "root:/config"
|
|||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
|
||||
BoxLayout {
|
||||
Box {
|
||||
id: root
|
||||
|
||||
readonly property color colour: Appearance.colours.pink
|
||||
|
|
@ -15,20 +15,20 @@ BoxLayout {
|
|||
clip: true
|
||||
|
||||
MaterialIcon {
|
||||
id: icon
|
||||
|
||||
text: Icons.getAppCategoryIcon(Hyprland.activeClient?.class) ?? "desktop_windows"
|
||||
color: root.colour
|
||||
|
||||
Layout.alignment: Layout.Center
|
||||
}
|
||||
|
||||
Label {
|
||||
StyledText {
|
||||
text: Hyprland.activeClient?.title ?? "Desktop"
|
||||
font.pointSize: Appearance.font.size.smaller
|
||||
font.family: Appearance.font.family.mono
|
||||
color: root.colour
|
||||
rotation: root.vertical ? 90 : 0
|
||||
|
||||
Layout.alignment: Layout.Center
|
||||
Layout.maximumWidth: root.vertical ? this.implicitHeight : this.implicitWidth
|
||||
anchors.left: icon.right
|
||||
anchors.leftMargin: Appearance.padding.smaller
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -18,8 +18,8 @@ BoxLayout {
|
|||
Layout.alignment: Layout.Center
|
||||
}
|
||||
|
||||
Label {
|
||||
horizontalAlignment: Label.AlignHCenter
|
||||
StyledText {
|
||||
horizontalAlignment: StyledText.AlignHCenter
|
||||
text: root.vertical ? Time.format("hh\nmm") : Time.format("dd/MM/yy hh:mm")
|
||||
font.pointSize: Appearance.font.size.smaller
|
||||
font.family: Appearance.font.family.mono
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@ import QtQuick.Layouts
|
|||
Box {
|
||||
padding: [Appearance.padding.smaller, 0]
|
||||
|
||||
Label {
|
||||
StyledText {
|
||||
text: Icons.osIcon
|
||||
font.pointSize: Appearance.font.size.smaller
|
||||
font.family: Appearance.font.family.mono
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ BoxLayout {
|
|||
id: root
|
||||
|
||||
required property bool vertical
|
||||
required property list<Label> workspaces
|
||||
required property list<StyledText> workspaces
|
||||
required property var occupied
|
||||
required property BoxLayout layout
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import "root:/services"
|
|||
import "root:/config"
|
||||
import QtQuick.Layouts
|
||||
|
||||
Label {
|
||||
StyledText {
|
||||
required property int index
|
||||
required property BoxLayout layout
|
||||
required property var occupied
|
||||
|
|
@ -11,7 +11,7 @@ Label {
|
|||
|
||||
text: index + 1
|
||||
color: BarConfig.workspaces.occupiedBg || occupied[index + 1] ? Appearance.colours.text : Appearance.colours.subtext0
|
||||
horizontalAlignment: Label.AlignHCenter
|
||||
horizontalAlignment: StyledText.AlignHCenter
|
||||
|
||||
Layout.preferredWidth: layout.homogenous && !layout.vertical ? layout.height : -1
|
||||
Layout.preferredHeight: layout.homogenous && layout.vertical ? layout.width : -1
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@ Item {
|
|||
property bool occupiedBg: false
|
||||
property bool showWindows: false
|
||||
|
||||
readonly property list<Label> workspaces: layout.children.filter(c => c.isWorkspace)
|
||||
readonly property list<StyledText> workspaces: layout.children.filter(c => c.isWorkspace)
|
||||
readonly property var occupied: Hyprland.workspaces.values.reduce((acc, curr) => {
|
||||
acc[curr.id] = curr.lastIpcObject.windows > 0;
|
||||
return acc;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import "root:/config"
|
||||
import QtQuick
|
||||
|
||||
Label {
|
||||
StyledText {
|
||||
font.family: Appearance.font.family.material
|
||||
font.pointSize: Appearance.font.size.larger
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,6 +5,8 @@ Text {
|
|||
id: root
|
||||
|
||||
renderType: Text.NativeRendering
|
||||
color: Appearance.colours.text
|
||||
font.family: Appearance.font.family.sans
|
||||
|
||||
Behavior on color {
|
||||
ColorAnimation {
|
||||
Loading…
Add table
Reference in a new issue