封装listview和滚动条,简化各Item功能

qml/AppControls2/AppItem.qml

@@ -3,7 +3,12 @@ import QtQuick.Layouts 1.12
 import QtQuick.Controls 2.5
 import org.ukui.menu.core 1.0
 
-StyleBackground {
+MouseArea {
+    id: control
+    hoverEnabled: true
+
+    StyleBackground {
+        anchors.fill: parent
         radius: 4
         useStyleTransparent: false
         alpha: control.containsPress ? 0.82 : control.containsMouse ? 0.55 : 0.00
@@ -18,20 +23,5 @@ StyleBackground {
             display: Display.TextBesideIcon
             spacing: 12
         }
-    MouseArea {
-        id: control
-        anchors.fill: parent
-        hoverEnabled: true
-        acceptedButtons: Qt.LeftButton | Qt.RightButton
-
-        onClicked: {
-            if (mouse.button === Qt.RightButton) {
-                appListView.model.openMenu(index);
-                return
-            }
-            if (mouse.button === Qt.LeftButton) {
-                appListView.model.appClicked(index);
-            }
-        }
     }
 }

qml/AppControls2/FolderItem.qml

@@ -3,7 +3,12 @@ import QtQuick.Layouts 1.12
 import QtQuick.Controls 2.5
 import org.ukui.menu.core 1.0
 
-StyleBackground {
+MouseArea {
+    id: control
+    hoverEnabled: true
+
+    StyleBackground {
+        anchors.fill: parent
         radius: 4
         useStyleTransparent: false
         alpha: control.containsPress ? 0.82 : control.containsMouse ? 0.55 : 0.00
@@ -18,20 +23,5 @@ StyleBackground {
             display: Display.TextBesideIcon
             spacing: 12
         }
-    MouseArea {
-        id: control
-        anchors.fill: parent
-        hoverEnabled: true
-        acceptedButtons: Qt.LeftButton | Qt.RightButton
-
-        onClicked: {
-            if (mouse.button === Qt.RightButton) {
-                appListView.model.openMenu(index);
-                return
-            }
-            if (mouse.button === Qt.LeftButton) {
-                appListView.model.appClicked(index);
-            }
-        }
     }
 }

qml/AppControls2/LabelItem.qml

@@ -2,12 +2,17 @@ import QtQuick 2.0
 import QtQuick.Layouts 1.12
 import QtQuick.Controls 2.5
 
-StyleBackground {
+MouseArea {
+    id: control
+    hoverEnabled: true
+    ToolTip.text: qsTr("Open the label selection interface")
+    ToolTip.visible: control.containsMouse
+
+    StyleBackground {
+        anchors.fill: parent
         radius: 4
         useStyleTransparent: false
         alpha: control.containsPress ? 0.82 : control.containsMouse ? 0.55 : 0.00
-    ToolTip.text: qsTr("Open the label selection interface")
-    ToolTip.visible: control.containsMouse
 
         RowLayout {
             anchors.fill: parent
@@ -32,12 +37,5 @@ StyleBackground {
                 source: "image://appicon/open-menu-symbolic"
             }
         }
-    MouseArea {
-        id: control
-        hoverEnabled: true
-        anchors.fill: parent
-        onClicked: {
-            appList.labelItemClicked();
-        }
     }
 }

qml/AppUI/AppList.qml

@@ -25,40 +25,16 @@ import org.ukui.menu.core 1.0
 
 Item {
     property string title: ""
+    signal labelItemClicked()
+    signal openFolderPageSignal(string folderId, string folderName);
 
     function labelSelection(labelId) {
-        appListView.positionViewAtIndex(appListView.model.getLabelIndex(labelId), ListView.Beginning)
+        appListView.view.positionViewAtIndex(appListView.model.getLabelIndex(labelId), ListView.Beginning)
     }
 
-    MouseArea {
+    AppListView {
-        id: appListArea
-        hoverEnabled: true
-        anchors.fill: parent
-
-        AppControls2.StyleBackground {
-            anchors.top: parent.top
-            width: parent.width; height: 1
-            useStyleTransparent: false
-            alpha: 0.15
-            paletteRole: Palette.Text
-            visible: appListView.contentY > 0
-        }
-
-        RowLayout {
-            anchors.fill: parent
-            spacing: 0
-            anchors.leftMargin: 4
-
-            ListView {
         id: appListView
-                spacing: 4
+        anchors.fill: parent
-                Layout.fillHeight: true
-                Layout.fillWidth: true
-                ScrollBar.vertical: appListScrollBar
-
-                highlightMoveDuration: 0
-                boundsBehavior: Flickable.StopAtBounds
-
         model: modelManager.getAppModel()
         delegate: Component {
             Loader {
@@ -66,6 +42,7 @@ Item {
                 height: 40
                 property int index: model.index
                 property int type: model.type
+                property string id: model.id
                 property string name: model.name
                 property string icon: model.icon
                 sourceComponent: {
@@ -83,27 +60,44 @@ Item {
         }
     }
 
-            AppControls2.ScrollBar {
-                id: appListScrollBar
-                Layout.fillHeight: true
-                Layout.preferredWidth: 14
-                visual: appListArea.containsMouse
-            }
-        }
-    }
-
     Component {
         id: appItem
-        AppControls2.AppItem {}
+        AppControls2.AppItem {
+            acceptedButtons: Qt.LeftButton | Qt.RightButton
+            onClicked: {
+                if (mouse.button === Qt.RightButton) {
+                    appListView.model.openMenu(index);
+                    return;
+                }
+                if (mouse.button === Qt.LeftButton) {
+                    appManager.launchApp(id);
+                    return;
+                }
+            }
+        }
     }
 
     Component {
         id: labelItem
-        AppControls2.LabelItem {}
+        AppControls2.LabelItem {
+            onClicked: labelItemClicked();
+        }
     }
 
     Component {
         id: folderItem
-        AppControls2.FolderItem {}
+        AppControls2.FolderItem {
+            acceptedButtons: Qt.LeftButton | Qt.RightButton
+            onClicked: {
+                if (mouse.button === Qt.RightButton) {
+                    appListView.model.openMenu(index);
+                    return;
+                }
+                if (mouse.button === Qt.LeftButton) {
+                    openFolderPageSignal(id, name);
+                    return;
+                }
+            }
+        }
     }
 }

qml/AppUI/AppListView.qml

@@ -0,0 +1,69 @@
+/*
+ * Copyright (C) 2023, KylinSoft Co., Ltd.
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ *
+ */
+
+import QtQuick 2.12
+import QtQuick.Controls 2.12
+import QtQuick.Layouts 1.12
+import AppControls2 1.0 as AppControls2
+import org.ukui.menu.core 1.0
+
+MouseArea {
+    id: root
+
+    readonly property alias view: listView
+    property alias model: listView.model
+    property alias delegate: listView.delegate
+
+    hoverEnabled: true
+    clip: true
+
+    AppControls2.StyleBackground {
+        anchors.top: parent.top
+        width: parent.width
+        height: 1
+        useStyleTransparent: false
+        alpha: 0.15
+        paletteRole: Palette.Text
+        visible: listView.contentY > 0
+    }
+
+    RowLayout {
+        anchors.fill: parent
+        spacing: 0
+        anchors.leftMargin: 4
+
+        ListView {
+            id: listView
+
+            spacing: 4
+            Layout.fillHeight: true
+            Layout.fillWidth: true
+            highlightMoveDuration: 0
+            boundsBehavior: Flickable.StopAtBounds
+            ScrollBar.vertical: listViewScrollBar
+        }
+
+        AppControls2.ScrollBar {
+            id: listViewScrollBar
+
+            Layout.fillHeight: true
+            Layout.preferredWidth: 14
+            visual: root.containsMouse
+        }
+    }
+}

qml/AppUI/AppPageContent.qml

@@ -28,7 +28,7 @@ Item {
         clip: true
         anchors.fill: parent
         anchors.leftMargin: 4
-        function labelItemClicked() {
+        onLabelItemClicked: {
             appList.visible = false;
             selectionPage.viewShowStart();
         }

qml/AppUI/qmldir

@@ -5,6 +5,7 @@ Sidebar 1.0 Sidebar.qml
 NormalUI 1.0 NormalUI.qml
 FullScreenUI 1.0 FullScreenUI.qml
 AppPageHeader 1.0 AppPageHeader.qml
+AppListView 1.0 AppListView.qml
 SearchInputBar 1.0 SearchInputBar.qml
 PluginSelectMenu 1.0 PluginSelectMenu.qml
 FullScreenHeader 1.0 FullScreenHeader.qml

qml/qml.qrc

@@ -15,6 +15,7 @@
         <file>AppUI/FullScreenFooter.qml</file>
         <file>AppUI/AppPageHeader.qml</file>
         <file>AppUI/SearchInputBar.qml</file>
+        <file>AppUI/AppListView.qml</file>
         <file>AppControls2/qmldir</file>
         <file>AppControls2/App.qml</file>
         <file>AppControls2/ScrollBar.qml</file>