Add Kirigami qml

This is by no means perfect, but it uses some Kirigami items.

CMakeLists.txt

@@ -54,6 +54,8 @@ find_package(Qt5Charts EXACT ${Qt5Core_VERSION})
 set(CMAKE_AUTOMOC ON)
 set(CMAKE_AUTOUIC ON)
 
+find_package(KF5Kirigami2)
+
 feature_summary(WHAT ALL INCLUDE_QUIET_PACKAGES FATAL_ON_MISSING_REQUIRED_PACKAGES)
 
 string(TOUPPER "${CMAKE_BUILD_TYPE}" CMAKE_BUILD_TYPE_UPPER)

demo/CMakeLists.txt

@@ -36,6 +36,9 @@ endif()
 if (Qt5Charts_FOUND)
     list(APPEND DemoLibs Qt5::Charts)
 endif()
+if (KF5Kirigami2_FOUND)
+    add_definitions(-DKIRIGAMI2)
+endif()
 
 ecm_create_qm_loader(Demo_QM_LOADER Demo_qt.pot)
 

demo/qml/FibonacciListKirigami.qml

@@ -0,0 +1,15 @@
+import QtQuick 2.6
+import QtQuick.Controls 2.0 as QQC2
+import org.kde.kirigami 2.0 as Kirigami
+
+Kirigami.ScrollablePage {
+    ListView {
+        model: demo.fibonacciList
+        header: Kirigami.Heading {
+            text: qsTr("Row") + "\t" + qsTr("Fibonacci number")
+        }
+        delegate: Kirigami.BasicListItem {
+            label: row + "\t" + fibonacciNumber
+        }
+    }
+}

demo/qml/FileTreeViewKirigami.qml

@@ -0,0 +1,79 @@
+import QtQuick 2.6
+import QtQml.Models 2.2
+import QtQuick.Controls 2.2
+import QtQuick.Layouts 1.3
+import org.kde.kirigami 2.0 as Kirigami
+
+ListView {
+    id: view
+    property string title
+    header: Column {
+        width: parent.width
+        ToolBar {
+            width: parent.width
+            RowLayout {
+                anchors.fill: parent
+                ToolButton {
+                    text: qsTr("‹")
+                    enabled: dirModel.rootIndex.valid
+                    onClicked: {
+                        dirModel.rootIndex = dirModel.rootIndex.parent
+                    }
+                }
+                Kirigami.Heading {
+                    text: view.title
+                    elide: Label.ElideMiddle
+                    horizontalAlignment: Qt.AlignHCenter
+                    verticalAlignment: Qt.AlignVCenter
+                    Layout.fillWidth: true
+                }
+            }
+        }
+        Row {
+            Text {
+                width: 200
+                text: qsTr("Name")
+            }
+            Text {
+                text: qsTr("Size")
+            }
+        }
+    }
+    model: DelegateModel {
+        id: dirModel
+        model: sortedFileSystem
+        onRootIndexChanged: {
+            var index = sortedFileSystem.mapToSource(rootIndex);
+            view.title = demo.fileSystemTree.filePath(index) || "";
+        }
+        delegate: Item {
+            width: parent.width
+            height: row.height
+            Row {
+                id: row
+                Connections {
+                    target: sortedFileSystem
+                    onRowsInserted: {
+                        // enable the button if children were found when 'model'
+                        // was created or if they were just inserted
+                        button.enabled = model.hasModelChildren
+                                || dirModel.modelIndex(index) === parent
+                    }
+                }
+                Button {
+                    id: button
+                    width: 200
+                    text: fileName
+                    enabled: model.hasModelChildren
+                    onClicked: {
+                        view.model.rootIndex = view.model.modelIndex(index)
+                    }
+                }
+                Label {
+                    text: fileSize
+                    padding: button.padding
+                }
+            }
+        }
+    }
+}

demo/qml/demo-kirigami2.qml

@@ -0,0 +1,42 @@
+import QtQuick 2.1
+import QtQuick.Controls 2.0 as QQC2
+import org.kde.kirigami 2.0 as Kirigami
+import QtQuick.Layouts 1.3
+
+Kirigami.ApplicationWindow {
+    id: application
+    property string initialTab: "style"
+    property int qtquickIndex: 0
+    visible: true
+    width: 800
+    height: 640
+    header: QQC2.TabBar {
+        id: bar
+        width: parent.width
+        QQC2.TabButton {
+            text: "object"
+        }
+        QQC2.TabButton {
+            text: "list"
+        }
+        QQC2.TabButton {
+            text: "tree"
+        }
+    }
+
+    footer: Rectangle {
+        height: statusBar.height
+        width: parent.width
+        StyleSwitcher2 {
+            id: statusBar
+            width: parent.width
+        }
+    }
+    StackLayout {
+        anchors.fill: parent
+        currentIndex: bar.currentIndex
+        Fibonacci2 {}
+        FibonacciListKirigami {}
+        FileTreeViewKirigami {}
+    }
+}

demo/resource_file.qrc

@@ -14,5 +14,8 @@
         <file>qml/chart.qml</file>
         <file>qml/demo-qtquick2.qml</file>
         <file>qml/demo.qml</file>
+        <file>qml/demo-kirigami2.qml</file>
+        <file>qml/FibonacciListKirigami.qml</file>
+        <file>qml/FileTreeViewKirigami.qml</file>
     </qresource>
 </RCC>

demo/src/main.cpp

@@ -117,6 +117,9 @@ QComboBox* createStyleComboBox(Model* model) {
 #endif
 #ifdef QTQUICKCONTROLS2
     box->addItem("QtQuick Controls 2");
+#endif
+#ifdef KIRIGAMI2
+    box->addItem("Kirigami 2");
 #endif
     return box;
 }
@@ -150,6 +153,12 @@ QStatusBar* createStatusBar(Model* model, QWidget* main, QComboBox* box,
                 createQtQuick("QtQuick Controls 2", "qrc:///qml/demo-qtquick2.qml",
                     model, box, initialTab);
             } else
+#endif
+#ifdef KIRIGAMI2
+            if (text == "Kirigami 2") {
+                createQtQuick("Kirigami 2", "qrc:///qml/demo-kirigami2.qml",
+                    model, box, initialTab);
+            } else
 #endif
             createQtQuick("QtQuick", "qrc:///qml/demo.qml", model, box, initialTab);
 #endif