Advance Wayland and KDE package bring-up
Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent) Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>
This commit is contained in:
+149
@@ -0,0 +1,149 @@
|
||||
/*
|
||||
* SPDX-FileCopyrightText: 2016 Marco Martin <mart@kde.org>
|
||||
*
|
||||
* SPDX-License-Identifier: LGPL-2.0-or-later
|
||||
*/
|
||||
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Controls as QQC2
|
||||
import org.kde.kirigami as Kirigami
|
||||
|
||||
Kirigami.AbstractApplicationWindow {
|
||||
id: root
|
||||
|
||||
width: 500
|
||||
height: 800
|
||||
visible: true
|
||||
|
||||
globalDrawer: Kirigami.GlobalDrawer {
|
||||
title: "Widget gallery"
|
||||
titleIcon: "applications-graphics"
|
||||
actions: [
|
||||
Kirigami.Action {
|
||||
text: "View"
|
||||
icon.name: "view-list-icons"
|
||||
Kirigami.Action {
|
||||
text: "action 1"
|
||||
}
|
||||
Kirigami.Action {
|
||||
text: "action 2"
|
||||
}
|
||||
Kirigami.Action {
|
||||
text: "action 3"
|
||||
}
|
||||
},
|
||||
Kirigami.Action {
|
||||
text: "Sync"
|
||||
icon.name: "folder-sync"
|
||||
Kirigami.Action {
|
||||
text: "action 4"
|
||||
}
|
||||
Kirigami.Action {
|
||||
text: "action 5"
|
||||
}
|
||||
},
|
||||
Kirigami.Action {
|
||||
text: "Checkable"
|
||||
icon.name: "view-list-details"
|
||||
checkable: true
|
||||
checked: false
|
||||
onTriggered: {
|
||||
print("Action checked:" + checked)
|
||||
}
|
||||
},
|
||||
Kirigami.Action {
|
||||
text: "Settings"
|
||||
icon.name: "configure"
|
||||
checkable: true
|
||||
//Need to do this, otherwise it breaks the bindings
|
||||
property bool current: pageStack.currentItem?.objectName === "settingsPage" ?? false
|
||||
onCurrentChanged: {
|
||||
checked = current;
|
||||
}
|
||||
onTriggered: {
|
||||
pageStack.push(settingsComponent);
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
QQC2.CheckBox {
|
||||
checked: true
|
||||
text: "Option 1"
|
||||
}
|
||||
QQC2.CheckBox {
|
||||
text: "Option 2"
|
||||
}
|
||||
QQC2.CheckBox {
|
||||
text: "Option 3"
|
||||
}
|
||||
QQC2.Slider {
|
||||
Layout.fillWidth: true
|
||||
value: 0.5
|
||||
}
|
||||
}
|
||||
contextDrawer: Kirigami.ContextDrawer {
|
||||
id: contextDrawer
|
||||
}
|
||||
|
||||
pageStack: QQC2.StackView {
|
||||
anchors.fill: parent
|
||||
property int currentIndex: 0
|
||||
focus: true
|
||||
onCurrentIndexChanged: {
|
||||
if (depth > currentIndex + 1) {
|
||||
pop(get(currentIndex));
|
||||
}
|
||||
}
|
||||
onDepthChanged: {
|
||||
currentIndex = depth-1;
|
||||
}
|
||||
initialItem: mainPageComponent
|
||||
|
||||
Keys.onReleased: event => {
|
||||
if (event.key === Qt.Key_Back ||
|
||||
(event.key === Qt.Key_Left && (event.modifiers & Qt.AltModifier))) {
|
||||
event.accepted = true;
|
||||
if (root.contextDrawer && root.contextDrawer.drawerOpen) {
|
||||
root.contextDrawer.close();
|
||||
} else if (root.globalDrawer && root.globalDrawer.drawerOpen) {
|
||||
root.globalDrawer.close();
|
||||
} else {
|
||||
var backEvent = {accepted: false}
|
||||
if (root.pageStack.currentIndex >= 1) {
|
||||
root.pageStack.currentItem.backRequested(backEvent);
|
||||
if (!backEvent.accepted) {
|
||||
if (root.pageStack.depth > 1) {
|
||||
root.pageStack.currentIndex = Math.max(0, root.pageStack.currentIndex - 1);
|
||||
backEvent.accepted = true;
|
||||
} else {
|
||||
Qt.quit();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (!backEvent.accepted) {
|
||||
Qt.quit();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: settingsComponent
|
||||
Kirigami.Page {
|
||||
title: "Settings"
|
||||
objectName: "settingsPage"
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//Main app content
|
||||
Component {
|
||||
id: mainPageComponent
|
||||
MultipleColumnsGallery {}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,39 @@
|
||||
/*
|
||||
* SPDX-FileCopyrightText: 2016 Marco Martin <mart@kde.org>
|
||||
*
|
||||
* SPDX-License-Identifier: LGPL-2.0-or-later
|
||||
*/
|
||||
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import org.kde.kirigami as Kirigami
|
||||
import QtQuick.Controls as QQC2
|
||||
|
||||
Kirigami.ApplicationWindow {
|
||||
id: root
|
||||
|
||||
width: Kirigami.Units.gridUnit * 60
|
||||
height: Kirigami.Units.gridUnit * 40
|
||||
|
||||
pageStack.initialPage: mainPageComponent
|
||||
globalDrawer: Kirigami.OverlayDrawer {
|
||||
drawerOpen: true
|
||||
modal: false
|
||||
contentItem: Item {
|
||||
implicitWidth: Kirigami.Units.gridUnit * 10
|
||||
|
||||
QQC2.Label {
|
||||
text: "This is a sidebar"
|
||||
width: parent.width - Kirigami.Units.smallSpacing * 2
|
||||
wrapMode: Text.WordWrap
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//Main app content
|
||||
Component {
|
||||
id: mainPageComponent
|
||||
MultipleColumnsGallery {}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,82 @@
|
||||
/*
|
||||
* SPDX-FileCopyrightText: 2015 Marco Martin <mart@kde.org>
|
||||
*
|
||||
* SPDX-License-Identifier: LGPL-2.0-or-later
|
||||
*/
|
||||
|
||||
import QtQuick
|
||||
import QtQuick.Controls as QQC2
|
||||
import QtQuick.Layouts
|
||||
import org.kde.kirigami as Kirigami
|
||||
|
||||
Kirigami.ScrollablePage {
|
||||
id: page
|
||||
|
||||
Layout.fillWidth: true
|
||||
implicitWidth: Kirigami.Units.gridUnit * (Math.floor(Math.random() * 35) + 8)
|
||||
|
||||
title: "Multiple Columns"
|
||||
|
||||
actions: [
|
||||
Kirigami.Action {
|
||||
text:"Action for buttons"
|
||||
icon.name: "bookmarks"
|
||||
onTriggered: print("Action 1 clicked")
|
||||
},
|
||||
Kirigami.Action {
|
||||
text:"Action 2"
|
||||
icon.name: "folder"
|
||||
enabled: false
|
||||
}
|
||||
]
|
||||
|
||||
ColumnLayout {
|
||||
width: page.width
|
||||
spacing: Kirigami.Units.smallSpacing
|
||||
|
||||
QQC2.Label {
|
||||
Layout.fillWidth: true
|
||||
wrapMode: Text.WordWrap
|
||||
text: "This page is used to test multiple columns: you can push and pop an arbitrary number of pages, each new page will have a random implicit width between 8 and 35 grid units.\nIf you enlarge the window enough, you can test how the application behaves with multiple columns."
|
||||
}
|
||||
Item {
|
||||
Layout.minimumWidth: Kirigami.Units.gridUnit *2
|
||||
Layout.minimumHeight: Layout.minimumWidth
|
||||
}
|
||||
QQC2.Label {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
text: "Page implicitWidth: " + page.implicitWidth
|
||||
}
|
||||
QQC2.Button {
|
||||
text: "Push Another Page"
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
onClicked: applicationWindow()?.pageStack.push(Qt.resolvedUrl("MultipleColumnsGallery.qml"));
|
||||
}
|
||||
QQC2.Button {
|
||||
text: "Pop A Page"
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
onClicked: applicationWindow()?.pageStack.pop();
|
||||
}
|
||||
RowLayout {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
QQC2.TextField {
|
||||
id: edit
|
||||
text: page.title
|
||||
}
|
||||
QQC2.Button {
|
||||
text: "Rename Page"
|
||||
onClicked: page.title = edit.text;
|
||||
}
|
||||
}
|
||||
Kirigami.SearchField {
|
||||
id: searchField
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
onAccepted: console.log("Search text is " + text);
|
||||
}
|
||||
Kirigami.PasswordField {
|
||||
id: passwordField
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
onAccepted: console.log("Password")
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,168 @@
|
||||
/*
|
||||
* SPDX-FileCopyrightText: 2016 Marco Martin <mart@kde.org>
|
||||
*
|
||||
* SPDX-License-Identifier: LGPL-2.0-or-later
|
||||
*/
|
||||
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Controls as QQC2
|
||||
import org.kde.kirigami as Kirigami
|
||||
|
||||
Kirigami.ApplicationWindow {
|
||||
id: root
|
||||
width: Kirigami.Units.gridUnit * 60
|
||||
height: Kirigami.Units.gridUnit * 40
|
||||
|
||||
|
||||
pageStack.initialPage: mainPageComponent
|
||||
globalDrawer: Kirigami.OverlayDrawer {
|
||||
id: drawer
|
||||
drawerOpen: true
|
||||
modal: false
|
||||
//leftPadding: Kirigami.Units.largeSpacing
|
||||
rightPadding: Kirigami.Units.largeSpacing
|
||||
contentItem: ColumnLayout {
|
||||
Layout.preferredWidth: Kirigami.Units.gridUnit * 20
|
||||
|
||||
QQC2.Label {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
text: "This is a sidebar"
|
||||
Layout.fillWidth: true
|
||||
width: parent.width - Kirigami.Units.smallSpacing * 2
|
||||
wrapMode: Text.WordWrap
|
||||
}
|
||||
QQC2.Button {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
text: "Modal"
|
||||
checkable: true
|
||||
Layout.fillWidth: true
|
||||
checked: false
|
||||
onCheckedChanged: drawer.modal = checked
|
||||
}
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
}
|
||||
}
|
||||
contextDrawer: Kirigami.OverlayDrawer {
|
||||
id: contextDrawer
|
||||
drawerOpen: true
|
||||
edge: Qt.application.layoutDirection === Qt.RightToLeft ? Qt.LeftEdge : Qt.RightEdge
|
||||
modal: false
|
||||
leftPadding: Kirigami.Units.largeSpacing
|
||||
rightPadding: Kirigami.Units.largeSpacing
|
||||
contentItem: ColumnLayout {
|
||||
Layout.preferredWidth: Kirigami.Units.gridUnit * 10
|
||||
|
||||
QQC2.Label {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
text: "This is a sidebar"
|
||||
Layout.fillWidth: true
|
||||
width: parent.width - Kirigami.Units.smallSpacing * 2
|
||||
wrapMode: Text.WordWrap
|
||||
}
|
||||
QQC2.Button {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
text: "Modal"
|
||||
checkable: true
|
||||
Layout.fillWidth: true
|
||||
checked: false
|
||||
onCheckedChanged: contextDrawer.modal = checked
|
||||
}
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
menuBar: QQC2.MenuBar {
|
||||
QQC2.Menu {
|
||||
title: qsTr("&File")
|
||||
QQC2.Action { text: qsTr("&New...") }
|
||||
QQC2.Action { text: qsTr("&Open...") }
|
||||
QQC2.Action { text: qsTr("&Save") }
|
||||
QQC2.Action { text: qsTr("Save &As...") }
|
||||
QQC2.MenuSeparator { }
|
||||
QQC2.Action { text: qsTr("&Quit") }
|
||||
}
|
||||
QQC2.Menu {
|
||||
title: qsTr("&Edit")
|
||||
QQC2.Action { text: qsTr("Cu&t") }
|
||||
QQC2.Action { text: qsTr("&Copy") }
|
||||
QQC2.Action { text: qsTr("&Paste") }
|
||||
}
|
||||
QQC2.Menu {
|
||||
title: qsTr("&Help")
|
||||
QQC2.Action { text: qsTr("&About") }
|
||||
}
|
||||
}
|
||||
header: QQC2.ToolBar {
|
||||
contentItem: RowLayout {
|
||||
QQC2.ToolButton {
|
||||
text: "Global ToolBar"
|
||||
}
|
||||
Item {
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
Kirigami.ActionTextField {
|
||||
id: searchField
|
||||
|
||||
placeholderText: "Search…"
|
||||
|
||||
focusSequence: StandardKey.Find
|
||||
leftActions: [
|
||||
Kirigami.Action {
|
||||
icon.name: "edit-clear"
|
||||
visible: searchField.text.length > 0
|
||||
onTriggered: {
|
||||
searchField.text = ""
|
||||
searchField.accepted()
|
||||
}
|
||||
},
|
||||
Kirigami.Action {
|
||||
icon.name: "edit-clear"
|
||||
visible: searchField.text.length > 0
|
||||
onTriggered: {
|
||||
searchField.text = ""
|
||||
searchField.accepted()
|
||||
}
|
||||
}
|
||||
]
|
||||
rightActions: [
|
||||
Kirigami.Action {
|
||||
icon.name: "edit-clear"
|
||||
visible: searchField.text.length > 0
|
||||
onTriggered: {
|
||||
searchField.text = ""
|
||||
searchField.accepted()
|
||||
}
|
||||
},
|
||||
Kirigami.Action {
|
||||
icon.name: "anchor"
|
||||
visible: searchField.text.length > 0
|
||||
onTriggered: {
|
||||
searchField.text = ""
|
||||
searchField.accepted()
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
onAccepted: console.log("Search text is " + searchField.text)
|
||||
}
|
||||
}
|
||||
}
|
||||
//Main app content
|
||||
Component {
|
||||
id: mainPageComponent
|
||||
MultipleColumnsGallery {}
|
||||
}
|
||||
footer: QQC2.ToolBar {
|
||||
position: QQC2.ToolBar.Footer
|
||||
QQC2.Label {
|
||||
anchors.fill: parent
|
||||
verticalAlignment: Qt.AlignVCenter
|
||||
text: "Global Footer"
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,43 @@
|
||||
/*
|
||||
* SPDX-FileCopyrightText: 2015 Marco Martin <mart@kde.org>
|
||||
*
|
||||
* SPDX-License-Identifier: LGPL-2.0-or-later
|
||||
*/
|
||||
|
||||
import QtQuick
|
||||
import QtQuick.Controls as QQC2
|
||||
import QtQuick.Layouts
|
||||
import org.kde.kirigami as Kirigami
|
||||
|
||||
Kirigami.ScrollablePage {
|
||||
id: page
|
||||
|
||||
Layout.fillWidth: true
|
||||
implicitWidth: Kirigami.Units.gridUnit * (Math.floor(Math.random() * 35) + 8)
|
||||
|
||||
title: i18n("Simple Scrollable Page")
|
||||
|
||||
actions: [
|
||||
Kirigami.Action {
|
||||
text:"Action for buttons"
|
||||
icon.name: "bookmarks"
|
||||
onTriggered: print("Action 1 clicked")
|
||||
},
|
||||
Kirigami.Action {
|
||||
text:"Action 2"
|
||||
icon.name: "folder"
|
||||
enabled: false
|
||||
}
|
||||
]
|
||||
|
||||
ColumnLayout {
|
||||
width: page.width
|
||||
spacing: Kirigami.Units.smallSpacing
|
||||
|
||||
QQC2.Label {
|
||||
Layout.fillWidth: true
|
||||
wrapMode: Text.WordWrap
|
||||
text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed a sem venenatis, dictum odio vitae, tincidunt sapien. Proin a suscipit ligula, id interdum leo. Donec sed dolor sed lacus dignissim tempor a a lorem. In ullamcorper varius vestibulum. Sed nec arcu semper, varius velit ut, pharetra est. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Integer odio nibh, tincidunt quis condimentum quis, consequat id lacus. Nulla quis mauris erat. Suspendisse rhoncus suscipit massa, at suscipit lorem rhoncus et."
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,35 @@
|
||||
/*
|
||||
* SPDX-FileCopyrightText: 2016 Marco Martin <mart@kde.org>
|
||||
*
|
||||
* SPDX-License-Identifier: LGPL-2.0-or-later
|
||||
*/
|
||||
|
||||
import QtQuick
|
||||
import org.kde.kirigami as Kirigami
|
||||
|
||||
Kirigami.ApplicationWindow {
|
||||
id: root
|
||||
|
||||
globalDrawer: Kirigami.OverlayDrawer {
|
||||
contentItem: Rectangle {
|
||||
implicitWidth: Kirigami.Units.gridUnit * 10
|
||||
color: "red"
|
||||
anchors.fill: parent
|
||||
}
|
||||
}
|
||||
contextDrawer: Kirigami.ContextDrawer {
|
||||
id: contextDrawer
|
||||
}
|
||||
|
||||
pageStack.initialPage: mainPageComponent
|
||||
|
||||
Component {
|
||||
id: mainPageComponent
|
||||
Kirigami.ScrollablePage {
|
||||
title: "Hello"
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,75 @@
|
||||
/*
|
||||
* SPDX-FileCopyrightText: 2017 Eike Hein <hein@kde.org>
|
||||
*
|
||||
* SPDX-License-Identifier: LGPL-2.0-or-later
|
||||
*/
|
||||
|
||||
import QtQuick
|
||||
import org.kde.kirigami as Kirigami
|
||||
|
||||
Kirigami.ApplicationWindow {
|
||||
id: root
|
||||
|
||||
property int defaultColumnWidth: Kirigami.Units.gridUnit * 13
|
||||
property int columnWidth: defaultColumnWidth
|
||||
|
||||
pageStack.defaultColumnWidth: columnWidth
|
||||
pageStack.initialPage: [firstPageComponent, secondPageComponent]
|
||||
|
||||
MouseArea {
|
||||
id: dragHandle
|
||||
|
||||
visible: pageStack.wideMode
|
||||
|
||||
anchors.top: parent.top
|
||||
anchors.bottom: parent.bottom
|
||||
|
||||
x: columnWidth - (width / 2)
|
||||
width: 2
|
||||
|
||||
property int dragRange: (Kirigami.Units.gridUnit * 5)
|
||||
property int _lastX: -1
|
||||
|
||||
cursorShape: Qt.SplitHCursor
|
||||
|
||||
onPressed: mouse => {
|
||||
_lastX = mouse.x;
|
||||
}
|
||||
|
||||
onPositionChanged: mouse => {
|
||||
if (mouse.x > _lastX) {
|
||||
columnWidth = Math.min((defaultColumnWidth + dragRange),
|
||||
columnWidth + (mouse.x - _lastX));
|
||||
} else if (mouse.x < _lastX) {
|
||||
columnWidth = Math.max((defaultColumnWidth - dragRange),
|
||||
columnWidth - (_lastX - mouse.x));
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
|
||||
color: "blue"
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: firstPageComponent
|
||||
|
||||
Kirigami.Page {
|
||||
id: firstPage
|
||||
|
||||
background: Rectangle { color: "red" }
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: secondPageComponent
|
||||
|
||||
Kirigami.Page {
|
||||
id: secondPage
|
||||
|
||||
background: Rectangle { color: "green" }
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,63 @@
|
||||
/*
|
||||
* SPDX-FileCopyrightText: 2016 Marco Martin <mart@kde.org>
|
||||
*
|
||||
* SPDX-License-Identifier: LGPL-2.0-or-later
|
||||
*/
|
||||
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Controls as QQC2
|
||||
import org.kde.kirigami as Kirigami
|
||||
|
||||
Kirigami.ApplicationWindow {
|
||||
id: root
|
||||
|
||||
footer: QQC2.ToolBar {
|
||||
//height: Kirigami.Units.gridUnit * 3
|
||||
RowLayout {
|
||||
QQC2.ToolButton {
|
||||
text: "text"
|
||||
}
|
||||
}
|
||||
}
|
||||
globalDrawer: Kirigami.GlobalDrawer {
|
||||
actions: [
|
||||
Kirigami.Action {
|
||||
text: "View"
|
||||
icon.name: "view-list-icons"
|
||||
Kirigami.Action {
|
||||
text: "action 1"
|
||||
}
|
||||
Kirigami.Action {
|
||||
text: "action 2"
|
||||
}
|
||||
Kirigami.Action {
|
||||
text: "action 3"
|
||||
}
|
||||
},
|
||||
Kirigami.Action {
|
||||
text: "action 3"
|
||||
},
|
||||
Kirigami.Action {
|
||||
text: "action 4"
|
||||
}
|
||||
]
|
||||
}
|
||||
contextDrawer: Kirigami.ContextDrawer {
|
||||
id: contextDrawer
|
||||
}
|
||||
|
||||
pageStack.initialPage: mainPageComponent
|
||||
|
||||
Component {
|
||||
id: mainPageComponent
|
||||
Kirigami.ScrollablePage {
|
||||
title: "Hello"
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
@@ -0,0 +1,67 @@
|
||||
/*
|
||||
* SPDX-FileCopyrightText: 2023 Marco Martin <mart@kde.org>
|
||||
*
|
||||
* SPDX-License-Identifier: LGPL-2.0-or-later
|
||||
*/
|
||||
|
||||
import QtQuick
|
||||
import QtQuick.Controls as QQC2
|
||||
import org.kde.kirigami as Kirigami
|
||||
|
||||
/**
|
||||
* This example show how to do a sidebar of an application what gets covered by new layers that might get pushed
|
||||
* in the PageRow layer system.
|
||||
* When a drawer is in sidebar mode, when it goes modal (for instance when on mobile) will still behave like a drawer
|
||||
*/
|
||||
Kirigami.ApplicationWindow {
|
||||
id: root
|
||||
|
||||
Kirigami.GlobalDrawer {
|
||||
id: drawer
|
||||
modal: false
|
||||
|
||||
actions: [
|
||||
Kirigami.Action {
|
||||
text: "Push Layer"
|
||||
onTriggered: root.pageStack.layers.push(layerComponent)
|
||||
},
|
||||
Kirigami.Action {
|
||||
text: "Modal"
|
||||
checked: drawer.modal
|
||||
checkable: true
|
||||
onTriggered: drawer.modal = checked
|
||||
}
|
||||
]
|
||||
}
|
||||
contextDrawer: Kirigami.ContextDrawer {
|
||||
id: contextDrawer
|
||||
}
|
||||
|
||||
pageStack.initialPage: mainPageComponent
|
||||
pageStack.leftSidebar: drawer
|
||||
|
||||
Component {
|
||||
id: mainPageComponent
|
||||
Kirigami.ScrollablePage {
|
||||
title: "Hello"
|
||||
QQC2.Pane {
|
||||
anchors.fill: parent
|
||||
QQC2.Label {
|
||||
text: "Main page: push a layer to cover both this and the sidebar"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Component {
|
||||
id: layerComponent
|
||||
Kirigami.ScrollablePage {
|
||||
title: "Layer 1"
|
||||
QQC2.Pane {
|
||||
anchors.fill: parent
|
||||
QQC2.Label {
|
||||
text: "Layer page: this should cover the whole window: main page and sidebar"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,51 @@
|
||||
/*
|
||||
* SPDX-FileCopyrightText: 2016 Marco Martin <mart@kde.org>
|
||||
*
|
||||
* SPDX-License-Identifier: LGPL-2.0-or-later
|
||||
*/
|
||||
|
||||
import QtQuick
|
||||
import org.kde.kirigami as Kirigami
|
||||
|
||||
Kirigami.ApplicationWindow {
|
||||
id: root
|
||||
|
||||
globalDrawer: Kirigami.GlobalDrawer {
|
||||
actions: [
|
||||
Kirigami.Action {
|
||||
text: "View"
|
||||
icon.name: "view-list-icons"
|
||||
Kirigami.Action {
|
||||
text: "action 1"
|
||||
}
|
||||
Kirigami.Action {
|
||||
text: "action 2"
|
||||
}
|
||||
Kirigami.Action {
|
||||
text: "action 3"
|
||||
}
|
||||
},
|
||||
Kirigami.Action {
|
||||
text: "action 3"
|
||||
},
|
||||
Kirigami.Action {
|
||||
text: "action 4"
|
||||
}
|
||||
]
|
||||
}
|
||||
contextDrawer: Kirigami.ContextDrawer {
|
||||
id: contextDrawer
|
||||
}
|
||||
|
||||
pageStack.initialPage: mainPageComponent
|
||||
|
||||
Component {
|
||||
id: mainPageComponent
|
||||
Kirigami.ScrollablePage {
|
||||
title: "Hello"
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,42 @@
|
||||
/*
|
||||
* SPDX-FileCopyrightText: 2016 Marco Martin <mart@kde.org>
|
||||
*
|
||||
* SPDX-License-Identifier: LGPL-2.0-or-later
|
||||
*/
|
||||
|
||||
import QtQuick
|
||||
import org.kde.kirigami as Kirigami
|
||||
|
||||
Kirigami.ApplicationWindow {
|
||||
id: root
|
||||
|
||||
Kirigami.PagePool {
|
||||
id: mainPagePool
|
||||
}
|
||||
|
||||
globalDrawer: Kirigami.GlobalDrawer {
|
||||
modal: !root.wideScreen
|
||||
width: Kirigami.Units.gridUnit * 10
|
||||
|
||||
actions: [
|
||||
Kirigami.PagePoolAction {
|
||||
text: i18n("Page1")
|
||||
icon.name: "speedometer"
|
||||
pagePool: mainPagePool
|
||||
page: "SimplePage.qml"
|
||||
},
|
||||
Kirigami.PagePoolAction {
|
||||
text: i18n("Page2")
|
||||
icon.name: "window-duplicate"
|
||||
pagePool: mainPagePool
|
||||
page: "MultipleColumnsGallery.qml"
|
||||
}
|
||||
]
|
||||
}
|
||||
contextDrawer: Kirigami.ContextDrawer {
|
||||
id: contextDrawer
|
||||
}
|
||||
|
||||
pageStack.initialPage: mainPagePool.loadPage("SimplePage.qml")
|
||||
|
||||
}
|
||||
@@ -0,0 +1,60 @@
|
||||
/*
|
||||
* SPDX-FileCopyrightText: 2016 Marco Martin <mart@kde.org>
|
||||
*
|
||||
* SPDX-License-Identifier: LGPL-2.0-or-later
|
||||
*/
|
||||
|
||||
import QtQuick
|
||||
import QtQuick.Controls as QQC2
|
||||
import org.kde.kirigami as Kirigami
|
||||
|
||||
Kirigami.ApplicationWindow {
|
||||
id: root
|
||||
|
||||
Kirigami.PagePool {
|
||||
id: mainPagePool
|
||||
}
|
||||
|
||||
globalDrawer: Kirigami.GlobalDrawer {
|
||||
}
|
||||
contextDrawer: Kirigami.ContextDrawer {
|
||||
id: contextDrawer
|
||||
}
|
||||
|
||||
pageStack.initialPage: wideScreen ? [firstPage, mainPagePool.loadPage("SimplePage.qml")] : [firstPage]
|
||||
|
||||
Component {
|
||||
id: firstPage
|
||||
Kirigami.ScrollablePage {
|
||||
id: root
|
||||
title: i18n("Sidebar")
|
||||
property list<Kirigami.PagePoolAction> pageActions: [
|
||||
Kirigami.PagePoolAction {
|
||||
text: i18n("Page1")
|
||||
icon.name: "speedometer"
|
||||
pagePool: mainPagePool
|
||||
basePage: root
|
||||
page: "SimplePage.qml"
|
||||
},
|
||||
Kirigami.PagePoolAction {
|
||||
text: i18n("Page2")
|
||||
icon.name: "window-duplicate"
|
||||
pagePool: mainPagePool
|
||||
basePage: root
|
||||
page: "MultipleColumnsGallery.qml"
|
||||
}
|
||||
]
|
||||
ListView {
|
||||
model: pageActions
|
||||
keyNavigationEnabled: true
|
||||
activeFocusOnTab: true
|
||||
reuseItems: true
|
||||
delegate: QQC2.ItemDelegate {
|
||||
id: delegate
|
||||
action: modelData
|
||||
width: parent.width
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,63 @@
|
||||
/*
|
||||
* SPDX-FileCopyrightText: 2016 Marco Martin <mart@kde.org>
|
||||
*
|
||||
* SPDX-License-Identifier: LGPL-2.0-or-later
|
||||
*/
|
||||
|
||||
import QtQuick
|
||||
import QtQuick.Controls as QQC2
|
||||
import org.kde.kirigami as Kirigami
|
||||
|
||||
Kirigami.ApplicationWindow {
|
||||
id: root
|
||||
|
||||
globalDrawer: Kirigami.GlobalDrawer {
|
||||
actions: [
|
||||
Kirigami.Action {
|
||||
text: "push"
|
||||
onTriggered: pageStack.push(secondPageComponent)
|
||||
},
|
||||
Kirigami.Action {
|
||||
text: "pop"
|
||||
onTriggered: pageStack.pop()
|
||||
},
|
||||
Kirigami.Action {
|
||||
text: "clear"
|
||||
onTriggered: pageStack.clear()
|
||||
},
|
||||
Kirigami.Action {
|
||||
text: "replace"
|
||||
onTriggered: pageStack.replace(secondPageComponent)
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
pageStack.initialPage: mainPageComponent
|
||||
|
||||
Component {
|
||||
id: mainPageComponent
|
||||
Kirigami.Page {
|
||||
title: "First Page"
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
QQC2.Label {
|
||||
text: "First Page"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: secondPageComponent
|
||||
Kirigami.Page {
|
||||
title: "Second Page"
|
||||
Rectangle {
|
||||
color: "red"
|
||||
anchors.fill: parent
|
||||
QQC2.Label {
|
||||
text: "Second Page"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,303 @@
|
||||
/*
|
||||
* SPDX-FileCopyrightText: 2017 Marco Martin <mart@kde.org>
|
||||
*
|
||||
* SPDX-License-Identifier: LGPL-2.0-or-later
|
||||
*/
|
||||
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import QtQuick.Controls as QQC2
|
||||
import org.kde.kirigami as Kirigami
|
||||
|
||||
Kirigami.ApplicationWindow {
|
||||
id: root
|
||||
|
||||
//FIXME: perhaps the default logic for going widescreen should be refined upstream
|
||||
wideScreen: width > columnWidth * 3
|
||||
property int columnWidth: Kirigami.Units.gridUnit * 13
|
||||
property int footerHeight: Math.round(Kirigami.Units.gridUnit * 2.5)
|
||||
|
||||
globalDrawer: Kirigami.GlobalDrawer {
|
||||
contentItem.implicitWidth: columnWidth
|
||||
modal: true
|
||||
drawerOpen: false
|
||||
isMenu: true
|
||||
|
||||
actions: [
|
||||
Kirigami.Action {
|
||||
text: "Rooms"
|
||||
icon.name: "view-list-icons"
|
||||
},
|
||||
Kirigami.Action {
|
||||
text: "Contacts"
|
||||
icon.name: "tag-people"
|
||||
},
|
||||
Kirigami.Action {
|
||||
text: "Search"
|
||||
icon.name: "search"
|
||||
}
|
||||
]
|
||||
}
|
||||
contextDrawer: Kirigami.OverlayDrawer {
|
||||
id: contextDrawer
|
||||
//they can depend on the page like that or be defined directly here
|
||||
edge: Qt.application.layoutDirection === Qt.RightToLeft ? Qt.LeftEdge : Qt.RightEdge
|
||||
modal: !root.wideScreen
|
||||
onModalChanged: drawerOpen = !modal
|
||||
handleVisible: root.controlsVisible
|
||||
|
||||
//here padding 0 as listitems look better without as opposed to any other control
|
||||
topPadding: 0
|
||||
bottomPadding: 0
|
||||
leftPadding: 0
|
||||
rightPadding: 0
|
||||
|
||||
contentItem: ColumnLayout {
|
||||
readonly property int implicitWidth: root.columnWidth
|
||||
spacing: 0
|
||||
QQC2.Control {
|
||||
Layout.fillWidth: true
|
||||
background: Rectangle {
|
||||
anchors.fill: parent
|
||||
color: Kirigami.Theme.highlightColor
|
||||
opacity: 0.8
|
||||
}
|
||||
|
||||
padding: Kirigami.Units.gridUnit
|
||||
|
||||
contentItem: ColumnLayout {
|
||||
id: titleLayout
|
||||
spacing: Kirigami.Units.gridUnit
|
||||
|
||||
RowLayout {
|
||||
spacing: Kirigami.Units.gridUnit
|
||||
Rectangle {
|
||||
color: Kirigami.Theme.highlightedTextColor
|
||||
radius: width
|
||||
implicitWidth: Kirigami.Units.iconSizes.medium
|
||||
implicitHeight: implicitWidth
|
||||
}
|
||||
ColumnLayout {
|
||||
QQC2.Label {
|
||||
Layout.fillWidth: true
|
||||
color: Kirigami.Theme.highlightedTextColor
|
||||
text: "KDE"
|
||||
}
|
||||
QQC2.Label {
|
||||
Layout.fillWidth: true
|
||||
color: Kirigami.Theme.highlightedTextColor
|
||||
font: Kirigami.Theme.smallFont
|
||||
text: "#kde: kde.org"
|
||||
}
|
||||
}
|
||||
}
|
||||
QQC2.Label {
|
||||
Layout.fillWidth: true
|
||||
color: Kirigami.Theme.highlightedTextColor
|
||||
text: "Main room for KDE community, other rooms are listed at kde.org/rooms"
|
||||
wrapMode: Text.WordWrap
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Kirigami.Separator {
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
|
||||
QQC2.ScrollView {
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
ListView {
|
||||
reuseItems: true
|
||||
model: 50
|
||||
delegate: QQC2.ItemDelegate {
|
||||
text: "Person " + modelData
|
||||
width: parent.width
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Kirigami.Separator {
|
||||
Layout.fillWidth: true
|
||||
Layout.maximumHeight: 1//implicitHeight
|
||||
}
|
||||
QQC2.ItemDelegate {
|
||||
text: "Group call"
|
||||
icon.name: "call-start"
|
||||
width: parent.width
|
||||
}
|
||||
QQC2.ItemDelegate {
|
||||
text: "Send Attachment"
|
||||
icon.name: "mail-attachment"
|
||||
width: parent.width
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
pageStack.defaultColumnWidth: columnWidth
|
||||
pageStack.initialPage: [channelsComponent, chatComponent]
|
||||
|
||||
Component {
|
||||
id: channelsComponent
|
||||
Kirigami.ScrollablePage {
|
||||
title: "Channels"
|
||||
actions: Kirigami.Action {
|
||||
icon.name: "search"
|
||||
text: "Search"
|
||||
}
|
||||
background: Rectangle {
|
||||
anchors.fill: parent
|
||||
color: Kirigami.Theme.backgroundColor
|
||||
}
|
||||
footer: QQC2.ToolBar {
|
||||
height: root.footerHeight
|
||||
padding: Kirigami.Units.smallSpacing
|
||||
RowLayout {
|
||||
anchors.fill: parent
|
||||
spacing: Kirigami.Units.smallSpacing
|
||||
QQC2.ToolButton {
|
||||
Layout.fillHeight: true
|
||||
//make it square
|
||||
implicitWidth: height
|
||||
icon.name: "configure"
|
||||
onClicked: root.pageStack.layers.push(secondLayerComponent);
|
||||
}
|
||||
QQC2.ComboBox {
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
model: ["First", "Second", "Third"]
|
||||
}
|
||||
}
|
||||
}
|
||||
ListView {
|
||||
id: channelsList
|
||||
currentIndex: 2
|
||||
model: 30
|
||||
reuseItems: true
|
||||
delegate: QQC2.ItemDelegate {
|
||||
text: "#Channel " + modelData
|
||||
checkable: true
|
||||
checked: channelsList.currentIndex === index
|
||||
width: parent.width
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: chatComponent
|
||||
Kirigami.ScrollablePage {
|
||||
title: "#KDE"
|
||||
actions: [
|
||||
Kirigami.Action {
|
||||
icon.name: "documentinfo"
|
||||
text: "Channel info"
|
||||
},
|
||||
Kirigami.Action {
|
||||
icon.name: "search"
|
||||
text: "Search"
|
||||
},
|
||||
Kirigami.Action {
|
||||
text: "Room Settings"
|
||||
icon.name: "configure"
|
||||
Kirigami.Action {
|
||||
text: "Setting 1"
|
||||
}
|
||||
Kirigami.Action {
|
||||
text: "Setting 2"
|
||||
}
|
||||
},
|
||||
Kirigami.Action {
|
||||
text: "Shared Media"
|
||||
icon.name: "document-share"
|
||||
Kirigami.Action {
|
||||
text: "Media 1"
|
||||
}
|
||||
Kirigami.Action {
|
||||
text: "Media 2"
|
||||
}
|
||||
Kirigami.Action {
|
||||
text: "Media 3"
|
||||
}
|
||||
}
|
||||
]
|
||||
background: Rectangle {
|
||||
anchors.fill: parent
|
||||
color: Kirigami.Theme.backgroundColor
|
||||
}
|
||||
footer: QQC2.Control {
|
||||
height: footerHeight
|
||||
padding: Kirigami.Units.smallSpacing
|
||||
background: Rectangle {
|
||||
color: Kirigami.Theme.backgroundColor
|
||||
Kirigami.Separator {
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
color: Kirigami.Theme.focusColor
|
||||
visible: chatTextInput.activeFocus
|
||||
}
|
||||
anchors {
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
top: parent.top
|
||||
}
|
||||
}
|
||||
}
|
||||
contentItem: RowLayout {
|
||||
QQC2.TextField {
|
||||
Layout.fillWidth: true
|
||||
id: chatTextInput
|
||||
background: Item {}
|
||||
}
|
||||
QQC2.ToolButton {
|
||||
Layout.fillHeight: true
|
||||
//make it square
|
||||
implicitWidth: height
|
||||
icon.name: "go-next"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ListView {
|
||||
id: channelsList
|
||||
verticalLayoutDirection: ListView.BottomToTop
|
||||
currentIndex: 2
|
||||
model: 30
|
||||
reuseItems: true
|
||||
delegate: Item {
|
||||
height: Kirigami.Units.gridUnit * 4
|
||||
ColumnLayout {
|
||||
x: Kirigami.Units.gridUnit
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
QQC2.Label {
|
||||
text: modelData % 2 ? "John Doe" : "John Applebaum"
|
||||
}
|
||||
QQC2.Label {
|
||||
text: "Message " + modelData
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: secondLayerComponent
|
||||
Kirigami.Page {
|
||||
title: "Settings"
|
||||
background: Rectangle {
|
||||
color: Kirigami.Theme.backgroundColor
|
||||
}
|
||||
footer: QQC2.ToolBar {
|
||||
height: root.footerHeight
|
||||
QQC2.ToolButton {
|
||||
Layout.fillHeight: true
|
||||
//make it square
|
||||
implicitWidth: height
|
||||
icon.name: "configure"
|
||||
onClicked: root.pageStack.layers.pop();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user