try that out
This commit is contained in:
parent
3074bcae38
commit
11d0e4a838
3 changed files with 152 additions and 168 deletions
|
|
@ -6,9 +6,10 @@ import Quickshell.Hyprland
|
|||
PopupWindow {
|
||||
id: root
|
||||
|
||||
implicitWidth: background.implicitWidth
|
||||
implicitHeight: background.implicitHeight
|
||||
implicitWidth: contentItem.children.reduce((prev, child) => Math.max(prev, child.width), 0)
|
||||
implicitHeight: contentItem.children.reduce((prev, child) => prev + child.height, 0)
|
||||
color: "transparent"
|
||||
contentItem.focus: visible
|
||||
|
||||
function open() {
|
||||
visible = true;
|
||||
|
|
@ -18,19 +19,19 @@ PopupWindow {
|
|||
visible = false;
|
||||
}
|
||||
|
||||
// WlrLayershell.layer: WlrLayer.Top
|
||||
// WlrLayershell.keyboardFocus: root.visible ? WlrKeyboardFocus.OnDemand : WlrKeyboardFocus.None
|
||||
HyprlandFocusGrab {
|
||||
id: grab
|
||||
active: root.visible
|
||||
windows: [root]
|
||||
onCleared: {
|
||||
root.close();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
id: background
|
||||
anchors.centerIn: root
|
||||
implicitWidth: root.contentItem.children.reduce((prev, child) => Math.max(prev, child.width), 0)
|
||||
implicitHeight: root.contentItem.children.reduce((prev, child) => prev + child.height, 0)
|
||||
anchors.fill: parent
|
||||
color: Theme.palette.base200
|
||||
radius: 8
|
||||
}
|
||||
|
|
@ -78,7 +78,11 @@ Variants {
|
|||
Launcher {}
|
||||
Pomodoro {}
|
||||
PowerMenu {}
|
||||
Storybook {}
|
||||
Storybook {
|
||||
anchor.window: topWindow
|
||||
anchor.rect.x: topWindow.width / 2 - width / 2
|
||||
anchor.rect.y: topWindow.height / 4
|
||||
}
|
||||
Drawers {}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,8 +4,6 @@ import qs.components
|
|||
import qs.config
|
||||
import qs.constants
|
||||
import qs.services
|
||||
import Quickshell.Hyprland
|
||||
import Quickshell.Wayland
|
||||
import QtQuick
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
|
|
@ -14,184 +12,165 @@ StyledPopupWindow {
|
|||
id: root
|
||||
|
||||
visible: Visibility.storybook
|
||||
implicitWidth: rect.width
|
||||
implicitHeight: rect.height
|
||||
|
||||
WlrLayershell.layer: WlrLayer.Top
|
||||
WlrLayershell.keyboardFocus: root.visible ? WlrKeyboardFocus.OnDemand : WlrKeyboardFocus.None
|
||||
GridLayout {
|
||||
id: grid
|
||||
|
||||
HyprlandFocusGrab {
|
||||
active: Visibility.storybook
|
||||
windows: [root]
|
||||
onCleared: {
|
||||
Visibility.storybook = false;
|
||||
flow: GridLayout.TopToBottom
|
||||
columns: 2
|
||||
rows: 10
|
||||
|
||||
StyledText {
|
||||
Layout.columnSpan: grid.columns
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
text: "Components"
|
||||
font.pixelSize: 24
|
||||
font.bold: true
|
||||
font.underline: true
|
||||
bottomPadding: 24
|
||||
}
|
||||
}
|
||||
|
||||
StyledWrapperRectangle {
|
||||
id: rect
|
||||
|
||||
margin: 48
|
||||
|
||||
GridLayout {
|
||||
id: grid
|
||||
|
||||
flow: GridLayout.TopToBottom
|
||||
columns: 2
|
||||
rows: 10
|
||||
|
||||
ColumnLayout {
|
||||
StyledText {
|
||||
Layout.columnSpan: grid.columns
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
text: "Components"
|
||||
font.pixelSize: 24
|
||||
font.bold: true
|
||||
font.underline: true
|
||||
bottomPadding: 24
|
||||
text: "Icon Button"
|
||||
font.pixelSize: 18
|
||||
}
|
||||
StyledIconButton {
|
||||
text: Icons.square
|
||||
}
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
StyledText {
|
||||
text: "Switch"
|
||||
font.pixelSize: 18
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
StyledText {
|
||||
text: "Icon Button"
|
||||
font.pixelSize: 18
|
||||
}
|
||||
StyledIconButton {
|
||||
text: Icons.square
|
||||
StyledSwitch {
|
||||
text: "Enable"
|
||||
}
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
StyledText {
|
||||
text: "ToolTip"
|
||||
font.pixelSize: 18
|
||||
}
|
||||
Button {
|
||||
id: toolTipButton
|
||||
text: "Hello world!"
|
||||
StyledToolTip {
|
||||
visible: toolTipButton.hovered
|
||||
text: qsTr("Save the active project")
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
StyledText {
|
||||
text: "Switch"
|
||||
font.pixelSize: 18
|
||||
}
|
||||
ColumnLayout {
|
||||
StyledText {
|
||||
text: "Slider"
|
||||
font.pixelSize: 18
|
||||
}
|
||||
StyledSlider {
|
||||
id: slider
|
||||
from: 0
|
||||
to: 100
|
||||
value: 50
|
||||
}
|
||||
}
|
||||
|
||||
StyledSwitch {
|
||||
text: "Enable"
|
||||
ColumnLayout {
|
||||
StyledText {
|
||||
text: "ProgressBar"
|
||||
font.pixelSize: 18
|
||||
}
|
||||
StyledProgressBar {
|
||||
id: progressBar
|
||||
indeterminate: true
|
||||
implicitHeight: 10
|
||||
from: 0
|
||||
to: 100
|
||||
value: 50
|
||||
}
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
StyledText {
|
||||
text: "ListView"
|
||||
font.pixelSize: 18
|
||||
}
|
||||
StyledWrapperRectangle {
|
||||
border.color: Theme.palette.base100
|
||||
border.width: 2
|
||||
StyledListView {
|
||||
implicitWidth: 200
|
||||
implicitHeight: 100
|
||||
model: 10
|
||||
delegate: StyledText {
|
||||
text: "Hello world!"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
StyledText {
|
||||
text: "ToolTip"
|
||||
font.pixelSize: 18
|
||||
ColumnLayout {
|
||||
StyledText {
|
||||
text: "Mpris Player Selector"
|
||||
font.pixelSize: 18
|
||||
}
|
||||
MprisPlayerSelector {}
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
StyledText {
|
||||
text: "Mpris Controller"
|
||||
font.pixelSize: 18
|
||||
}
|
||||
MprisController {
|
||||
player: Mpris.active ?? null
|
||||
}
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
StyledText {
|
||||
text: "Drawer"
|
||||
font.pixelSize: 18
|
||||
}
|
||||
RowLayout {
|
||||
Button {
|
||||
text: "Top"
|
||||
onClicked: {
|
||||
drawer.x = root.width / 2 - drawer.width / 2;
|
||||
drawer.y = 0;
|
||||
drawer.edge = Qt.TopEdge;
|
||||
drawer.open();
|
||||
}
|
||||
}
|
||||
Button {
|
||||
id: toolTipButton
|
||||
text: "Hello world!"
|
||||
StyledToolTip {
|
||||
visible: toolTipButton.hovered
|
||||
text: qsTr("Save the active project")
|
||||
text: "Left"
|
||||
onClicked: {
|
||||
drawer.y = root.height / 2 - drawer.height / 2;
|
||||
drawer.x = 0;
|
||||
drawer.edge = Qt.LeftEdge;
|
||||
drawer.open();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
StyledText {
|
||||
text: "Slider"
|
||||
font.pixelSize: 18
|
||||
}
|
||||
StyledSlider {
|
||||
id: slider
|
||||
from: 0
|
||||
to: 100
|
||||
value: 50
|
||||
}
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
StyledText {
|
||||
text: "ProgressBar"
|
||||
font.pixelSize: 18
|
||||
}
|
||||
StyledProgressBar {
|
||||
id: progressBar
|
||||
indeterminate: true
|
||||
implicitHeight: 10
|
||||
from: 0
|
||||
to: 100
|
||||
value: 50
|
||||
}
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
StyledText {
|
||||
text: "ListView"
|
||||
font.pixelSize: 18
|
||||
}
|
||||
StyledWrapperRectangle {
|
||||
border.color: Theme.palette.base100
|
||||
border.width: 2
|
||||
StyledListView {
|
||||
implicitWidth: 200
|
||||
implicitHeight: 100
|
||||
model: 10
|
||||
delegate: StyledText {
|
||||
text: "Hello world!"
|
||||
}
|
||||
Button {
|
||||
text: "Right"
|
||||
onClicked: {
|
||||
drawer.y = root.height / 2 - drawer.height / 2;
|
||||
drawer.x = 0;
|
||||
drawer.edge = Qt.RightEdge;
|
||||
drawer.open();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
StyledText {
|
||||
text: "Mpris Player Selector"
|
||||
font.pixelSize: 18
|
||||
}
|
||||
MprisPlayerSelector {}
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
StyledText {
|
||||
text: "Mpris Controller"
|
||||
font.pixelSize: 18
|
||||
}
|
||||
MprisController {
|
||||
player: Mpris.active ?? null
|
||||
}
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
StyledText {
|
||||
text: "Drawer"
|
||||
font.pixelSize: 18
|
||||
}
|
||||
RowLayout {
|
||||
Button {
|
||||
text: "Top"
|
||||
onClicked: {
|
||||
drawer.x = root.width / 2 - drawer.width / 2;
|
||||
drawer.y = 0;
|
||||
drawer.edge = Qt.TopEdge;
|
||||
drawer.open();
|
||||
}
|
||||
}
|
||||
Button {
|
||||
text: "Left"
|
||||
onClicked: {
|
||||
drawer.y = root.height / 2 - drawer.height / 2;
|
||||
drawer.x = 0;
|
||||
drawer.edge = Qt.LeftEdge;
|
||||
drawer.open();
|
||||
}
|
||||
}
|
||||
Button {
|
||||
text: "Right"
|
||||
onClicked: {
|
||||
drawer.y = root.height / 2 - drawer.height / 2;
|
||||
drawer.x = 0;
|
||||
drawer.edge = Qt.RightEdge;
|
||||
drawer.open();
|
||||
}
|
||||
}
|
||||
Button {
|
||||
text: "Bottom"
|
||||
onClicked: {
|
||||
drawer.x = root.width / 2 - drawer.width / 2;
|
||||
drawer.y = 0;
|
||||
drawer.edge = Qt.BottomEdge;
|
||||
drawer.open();
|
||||
}
|
||||
Button {
|
||||
text: "Bottom"
|
||||
onClicked: {
|
||||
drawer.x = root.width / 2 - drawer.width / 2;
|
||||
drawer.y = 0;
|
||||
drawer.edge = Qt.BottomEdge;
|
||||
drawer.open();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue