ui: 修改前端界面使用新后端

CMakeLists.txt

@@ -51,6 +51,7 @@ set(SingleApplication "qtsingleapplication")
 include_directories(src)
 include_directories(src/model)
 include_directories(src/appdata)
+include_directories(src/libappdata)
 include_directories(src/settings)
 include_directories(src/uiconfig)
 include_directories(src/windows)
@@ -94,24 +95,11 @@ set(SOURCE_FILES
         src/commons.h src/commons.cpp
         src/menu-dbus-service.cpp src/menu-dbus-service.h
         src/ukui-menu-application.cpp src/ukui-menu-application.h
-        src/model/app-model.cpp src/model/app-model.h
-        src/model/label-model.cpp src/model/label-model.h
-        src/model/app-group-model.cpp src/model/app-group-model.h
-        src/model/model-manager.cpp src/model/model-manager.h
-        src/model/folder-model.cpp src/model/folder-model.h
         src/settings/settings.cpp src/settings/settings.h
         src/uiconfig/theme-palette.cpp src/uiconfig/theme-palette.h
         src/windows/menu-main-window.cpp src/windows/menu-main-window.h
-        src/appdata/data-provider-plugin-iface.h
         src/appdata/app-data-manager.cpp src/appdata/app-data-manager.h
-        src/appdata/app-folder-helper.cpp src/appdata/app-folder-helper.h
         src/appdata/app-icon-provider.cpp src/appdata/app-icon-provider.h
-        src/appdata/data-provider-manager.cpp src/appdata/data-provider-manager.h
-        src/appdata/plugin/all-app-data-provider.cpp src/appdata/plugin/all-app-data-provider.h
-        src/appdata/plugin/app-search-plugin.cpp src/appdata/plugin/app-search-plugin.h
-        src/appdata/plugin/app-category-plugin.cpp src/appdata/plugin/app-category-plugin.h
-        src/appdata/plugin/app-letter-sort-plugin.cpp src/appdata/plugin/app-letter-sort-plugin.h
-        src/utils/app-page-header-utils.cpp src/utils/app-page-header-utils.h
         src/utils/power-button.cpp src/utils/power-button.h
         src/utils/app-manager.cpp src/utils/app-manager.h
         src/utils/event-track.cpp src/utils/event-track.h
@@ -135,6 +123,14 @@ set(SOURCE_FILES
         src/extension/favorite/favorite-folder-helper.cpp src/extension/favorite/favorite-folder-helper.h
         src/libappdata/basic-app-model.cpp src/libappdata/basic-app-model.h
         src/libappdata/app-database-interface.cpp src/libappdata/app-database-interface.h
+        src/libappdata/app-category-model.cpp src/libappdata/app-category-model.h
+        src/libappdata/combined-list-model.cpp src/libappdata/combined-list-model.h
+        src/libappdata/recently-installed-model.cpp src/libappdata/recently-installed-model.h
+        src/libappdata/app-page-backend.cpp src/libappdata/app-page-backend.h
+        src/libappdata/app-list-model.cpp src/libappdata/app-list-model.h
+        src/libappdata/app-list-plugin.cpp src/libappdata/app-list-plugin.h
+        src/libappdata/app-search-plugin.cpp src/libappdata/app-search-plugin.h
+        src/libappdata/app-category-plugin.cpp src/libappdata/app-category-plugin.h
 )
 
 

qml/AppControls2/FolderItem.qml

@@ -136,10 +136,10 @@ MouseArea {
                             anchors.verticalCenter: parent.verticalCenter
                             visible: textChange.activeFocus
 
-                            ThemeIcon {
+                            UkuiItems.Icon {
                                 anchors.centerIn: parent
                                 width: 16; height: width
-                                source: "image://appicon/edit-clear-symbolic"
+                                source: "edit-clear-symbolic"
                             }
 
                             onClicked: {

qml/AppControls2/LabelItem.qml

@@ -4,41 +4,21 @@ import QtQuick.Controls 2.5
 import org.ukui.menu.core 1.0
 import org.ukui.quick.platform 1.0 as Platform
 import org.ukui.quick.items 1.0 as UkuiItems
+
 MouseArea {
     id: control
     hoverEnabled: true
-    ToolTip {
+
-        property bool isVisible: control.containsMouse
+    // ToolTip.text: comment
-        id: tip
+    // ToolTip.visible: control.containsMouse
-        x: mouseX + 15
+    // ToolTip.delay: 500
-        y: mouseY + 15
+
-        text: comment
-        visible: control.containsMouse
-        delay: 500
-    }
-    onPositionChanged: {
-        if (tip.isVisible) {
-            if (tip.visible) {
-                tip.hide();
-            } else {
-                tip.show(comment);
-            }
-        }
-    }
-    states: State {
-        when: control.activeFocus
-        PropertyChanges {
-            target: controlBase
-            borderColor: Palette.Highlight
-            border.width: 2
-        }
-    }
     UkuiItems.StyleBackground {
-        id: controlBase
         anchors.fill: parent
         radius: Platform.Theme.minRadius
         useStyleTransparency: false
-        alpha: control.containsPress ? 0.82 : control.containsMouse ? 0.55 : 0.00
+        paletteRole: Platform.Theme.Text
+        alpha: control.containsPress ? 0.16 : control.containsMouse ? 0.08 : 0.00
 
         RowLayout {
             anchors.fill: parent
@@ -50,7 +30,7 @@ MouseArea {
                 horizontalAlignment: Qt.AlignLeft
                 verticalAlignment: Qt.AlignVCenter
                 font.bold: true
-                text: name
+                text: section
             }
 
             Image {

qml/AppUI/AppList.qml

@@ -23,44 +23,25 @@ import QtQuick.Layouts 1.12
 import AppControls2 1.0 as AppControls2
 import org.ukui.menu.core 1.0
 
-Item {
-    id: appListRoot
-    property string title: ""
-    property string idSelect: ""
-    property bool folderEditStatus: false
-    property int viewContentY: appListView.view.contentY
-    signal labelItemClicked()
-    signal openFolderPageSignal(string folderId, string folderName)
-    function labelSelection(labelId) {
-        appListView.view.positionViewAtIndex(appListView.model.getLabelIndex(labelId), ListView.Beginning);
-        appListView.view.currentIndex = appListView.model.getLabelIndex(labelId);
-    }
-
-    function resetListFocus() {
-        appListView.listFocus = true;
-    }
-
 AppListView {
     id: appListView
-        anchors.fill: parent
+    signal labelItemClicked()
+
+    function resetListFocus() {
+        listFocus = true;
+    }
 
     // 在listview区域，鼠标进出和移动事件都会清空原有的按键焦点
     // 鼠标不移动，原有的鼠标悬浮三态会保留
-        onContainsMouseChanged: clearViewFocus()
+    onContainsMouseChanged: { listFocus = false }
-        onPositionChanged: clearViewFocus()
+    onPositionChanged: { listFocus = false }
-        function clearViewFocus() {
-            if(!folderEditStatus) {
-                appListView.listFocus = false
-            }
-        }
 
-        model: modelManager.getAppModel()
     delegate: Component {
         Loader {
-                id: loaderView
             focus: true
             width: ListView.view ? ListView.view.width : 0
             height: appListView.itemHeight
+
             property int index: model.index
             property int type: model.type
             property string id: model.id
@@ -68,34 +49,8 @@ Item {
             property string icon: model.icon
             property string comment: model.comment // label tooltip
             property bool favorite: model.favorite
-                sourceComponent: {
-                    if (type === DataType.Normal) {
-                        return appItemComponent;
-                    }
-                    if (type === DataType.Folder) {
-                        return folderItemComponent;
-                    }
-                    if (type === DataType.Label) {
-                        return labelItemComponent;
-                    }
-                }
-            }
-        }
 
-        view.onContentYChanged: {
+            sourceComponent: Component {
-            if (appPageHeaderUtils.currentPluginId() === "all") {
-                return;
-            }
-
-            var obj = view.itemAt(10, view.contentY);
-            if (obj !== null && obj.type === DataType.Label) {
-                appListRoot.title = obj.name;
-            }
-        }
-    }
-
-    Component {
-        id: appItemComponent
                 Item {
                     id: appItemBase
                     AppControls2.AppItem {
@@ -104,9 +59,9 @@ Item {
                         width: appListView.view ? appListView.view.width : 0
                         height: appListView.itemHeight
                         acceptedButtons: Qt.LeftButton | Qt.RightButton
-                Drag.active: drag.active
+                        // Drag.active: drag.active
-                Drag.hotSpot.x: width / 2
+                        // Drag.hotSpot.x: width / 2
-                Drag.hotSpot.y: height / 2
+                        // Drag.hotSpot.y: height / 2
                         onClicked: {
                             if (mouse.button === Qt.RightButton) {
                                 appListView.model.openMenu(index, MenuInfo.AppList);
@@ -117,24 +72,23 @@ Item {
                                 return;
                             }
                         }
-                onPressAndHold: {
+                        // onPressAndHold: {
-                    if (mouse.button === Qt.LeftButton) {
+                        //     if (mouse.button === Qt.LeftButton) {
-                        x = appItem.mapToItem(appListView,0,0).x;
+                        //         x = appItem.mapToItem(appListView,0,0).x;
-                        y = appItem.mapToItem(appListView,0,0).y;
+                        //         y = appItem.mapToItem(appListView,0,0).y;
-                        drag.target = appItem;
+                        //         drag.target = appItem;
-                        appItem.parent = appListView;
+                        //         appItem.parent = appListView;
-                        appItem.isSelect = true;
+                        //         appItem.isSelect = true;
-                    }
+                        //     }
-                }
+                        // }
-                onReleased: {
+                        // onReleased: {
-                    idSelect = id;
+                        //     Drag.drop();
-                    Drag.drop();
+                        //     drag.target = null;
-                    drag.target = null;
+                        //     appItem.parent = appItemBase;
-                    appItem.parent = appItemBase;
+                        //     x = 0;
-                    x = 0;
+                        //     y = 0;
-                    y = 0;
+                        //     appItem.isSelect = false;
-                    appItem.isSelect = false;
+                        // }
-                }
                     }
                     Keys.onPressed: {
                         if (event.key === Qt.Key_Enter || event.key === Qt.Key_Return) {
@@ -143,9 +97,11 @@ Item {
                     }
                 }
             }
+        }
+    }
 
-    Component {
+    view.section.property: "group"
-        id: labelItemComponent
+    view.section.delegate: Component {
         AppControls2.LabelItem {
             focus: true;
             onClicked: labelItemClicked();
@@ -156,56 +112,4 @@ Item {
             }
         }
     }
-
-    Component {
-        id: folderItemComponent
-        DropArea {
-            onEntered: {
-                folderItem.isSelect = true;
-            }
-            onExited: {
-                folderItem.isSelect = false;
-            }
-            onDropped: {
-                folderItem.isSelect = false;
-                if (id !== idSelect) {
-                    appListView.model.addAppToFolder(idSelect, id);
-                }
-            }
-            AppControls2.FolderItem {
-                id: folderItem
-                focus: true
-                anchors.fill: parent
-                acceptedButtons: Qt.LeftButton | Qt.RightButton
-                onClicked: {
-                    if (mouse.button === Qt.RightButton) {
-                        appListView.model.openMenu(index, MenuInfo.AppList);
-                        return;
-                    }
-                    if (mouse.button === Qt.LeftButton) {
-                        openFolderPageSignal(id, name);
-                        return;
-                    }
-                }
-                Keys.onPressed: {
-                    if (event.key === Qt.Key_Enter || event.key === Qt.Key_Return) {
-                        openFolderPageSignal(id, name);
-                    }
-                }
-                Component.onCompleted: {
-                    appListView.model.renameText.connect(toEditText);
-                }
-                Component.onDestruction: {
-                    appListView.model.renameText.disconnect(toEditText);
-                }
-
-                onEditStatusChanged: folderEditStatus = editStatus;
-                function toEditText(idOfIndex){
-                    if (id === idOfIndex) {
-                        editStatus = true;
-                    }
-                }
-            }
-        }
-    }
 }

qml/AppUI/AppListHeader.qml

@@ -0,0 +1,97 @@
+/*
+ * 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.Layouts 1.12
+import QtQuick.Controls 2.12
+import org.ukui.menu.core 1.0
+import org.ukui.quick.items 1.0 as UkuiItems
+import org.ukui.quick.platform 1.0 as Platform
+
+Item {
+    id: root
+    property var header: null
+    property string title: ""
+
+    clip: true
+    visible: header !== null && header.visible
+
+    RowLayout {
+        anchors.fill: parent
+        anchors.leftMargin: 16
+        anchors.rightMargin: 16
+        spacing: 5
+
+        UkuiItems.StyleText {
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+            verticalAlignment: Text.AlignVCenter
+            elide: Text.ElideRight
+            text: root.title === "" ? header.title : root.title
+        }
+
+        UkuiItems.StyleBackground {
+            useStyleTransparency: false
+            paletteRole: Platform.Theme.Text
+            radius: height/2
+            alpha: 0.06
+
+            Layout.preferredWidth: childrenRect.width + 10
+            Layout.fillHeight: true
+            Layout.topMargin: 5
+            Layout.bottomMargin: 5
+            Layout.alignment: Qt.AlignVCenter
+
+            Row {
+                width: childrenRect.width
+                height: parent.height - 10
+                x: 5; y: 5
+                spacing: 5
+
+                Repeater {
+                    model: header.actions
+                    delegate: Component {
+                        UkuiItems.Button {
+                            width: height
+                            height: parent.height
+
+                            ToolTip.delay: 500
+                            ToolTip.text: modelData.toolTip
+                            ToolTip.visible: modelData.toolTip !== "" && containsMouse
+
+                            background.radius: width / 2
+                            background.alpha: modelData.checked ? 0.75 : containsMouse ? 0.4 : 0
+                            icon.source: modelData.icon
+                            icon.mode: UkuiItems.Icon.AutoHighlight
+
+                            onClicked: {
+                                // 执行action
+                                modelData.trigger();
+                            }
+                            Keys.onPressed: {
+                                if (event.key === Qt.Key_Enter || event.key === Qt.Key_Return) {
+                                    pluginSortButtonRoot.model.changeProvider(0);
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}

qml/AppUI/AppPage.qml

@@ -22,35 +22,32 @@ import org.ukui.menu.core 1.0
 
 Item {
     property alias search: appPageSearch
-    property alias header: appPageHeader
     property alias content: appPageContent
 
+    AppPageBackend {
+        id: appPageBackend
+    }
+
     ColumnLayout {
         anchors.fill: parent
         anchors.topMargin: 12
-        spacing: 0
+        anchors.bottomMargin: 5
+        spacing: 5
 
         AppPageSearch {
             id: appPageSearch
             Layout.fillWidth: true
             Layout.preferredHeight: 40
             focusToPageContent: appPageContent
-        }
+            backend: appPageBackend
-
-        AppPageHeader {
-            id: appPageHeader
-            visible: !appPageSearch.inputStatus
-            Layout.fillWidth: true
-            Layout.preferredHeight: 48
-            focusToPageContent: appPageContent
         }
 
         AppPageContent {
             id: appPageContent
-            appPageHeader: appPageHeader
             Layout.fillWidth: true
             Layout.fillHeight: true
             activeFocusOnTab: false
+            backend: appPageBackend
         }
     }
 }

qml/AppUI/AppPageContent.qml

@@ -22,13 +22,9 @@ import QtQuick.Controls 2.5
 import AppControls2 1.0 as AppControls2
 import org.ukui.menu.core 1.0
 
-SwipeView {
+Item {
     id: root
-    interactive: false
+    property AppPageBackend backend: null
-    // 5.15
-    // required property AppPageHeader appPageHeader
-    // 5.12
-    property AppPageHeader appPageHeader: null
     property bool isAppListShow: appList.visible
 
     function resetFocus() {
@@ -39,28 +35,33 @@ SwipeView {
         }
     }
 
-    Item {
+    ColumnLayout {
-        id: appListBase
+        anchors.fill: parent
-        AppControls2.StyleBackground {
+        spacing: 5
-            anchors.top: parent.top
+
-            width: parent.width
+        AppListHeader {
-            height: 1
+            id: appListHeader
-            useStyleTransparent: false
+            Layout.fillWidth: true
-            alpha: 0.15
+            Layout.preferredHeight: 48
-            paletteRole: Palette.Text
+            header: backend.appModel.header
-            visible: appList.viewContentY > 0 && appList.visible
         }
 
+        Item {
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+
             AppList {
                 id: appList
                 anchors.fill: parent
-            anchors.leftMargin: 4
+                visible: true
-            onLabelItemClicked: {
+                model: backend.appModel
-                appList.visible = false;
+
-                selectionPage.viewShowStart();
+                view.onContentYChanged: {
+                    if (view.contentY <= 0) {
+                        appListHeader.title = "";
+                    } else {
+                        appListHeader.title = view.currentSection;
                     }
-            onTitleChanged: {
-                appPageHeader.title = title;
                 }
             }
 
@@ -73,85 +74,5 @@ SwipeView {
                 onLabelSelected: appList.labelSelection(labelId)
             }
         }
-
-    Loader {
-        id: folderPageLoader
-        active: false
-        sourceComponent: Component {
-            AppListView {
-                model: modelManager.getFolderModel()
-                delegate: Component {
-                    Loader {
-                        width: ListView.view ? ListView.view.width : 0; height: 40
-                        property string id: model.id
-                        property string name: model.name
-                        property string icon: model.icon
-                        sourceComponent: AppControls2.AppItem {
-                            acceptedButtons: Qt.LeftButton | Qt.RightButton
-                            onClicked: {
-                                if (mouse.button === Qt.RightButton) {
-                                    menuManager.showMenu(id, MenuInfo.FolderPage);
-                                    return;
-                                }
-                                if (mouse.button === Qt.LeftButton) {
-                                    appManager.launchApp(id);
-                                    return;
-                                }
-                            }
-                        }
-                    }
-                }
-            }
-        }
-
-        function showFolderPage(folderId, folderName) {
-            active = true;
-            item.model.setFolderId(folderId);
-            appPageHeader.title = folderName;
-            appPageHeader.content = folderPageHeader;
-            root.currentIndex = SwipeView.index;
-            EventTrack.sendClickEvent("enter_folder_page", "AppView");
-        }
-        function hideFolderPage() {
-            root.currentIndex = appListBase.SwipeView.index;
-            appPageHeader.title = appList.title;
-            appPageHeader.content = null;
-            //active = false;
-            EventTrack.sendClickEvent("exit_folder_page", "AppView");
-        }
-
-        Component.onCompleted: {
-            appList.openFolderPageSignal.connect(showFolderPage);
-        }
-    }
-
-    Component {
-        id: folderPageHeader
-        Item {
-            RowLayout {
-                anchors.fill: parent
-                anchors.leftMargin: 12
-                anchors.rightMargin: 30
-                spacing: 2
-
-                ThemeIcon {
-                    Layout.fillWidth: true
-                    Layout.fillHeight: true
-                    Layout.maximumWidth: 16
-                    Layout.maximumHeight: 16
-                    Layout.alignment: Qt.AlignVCenter
-                    source: "image://appicon/ukui-start-symbolic"
-                    MouseArea {
-                        anchors.fill: parent
-                        onClicked: folderPageLoader.hideFolderPage();
-                    }
-                }
-
-                EditText {
-                    Layout.fillWidth: true
-                    Layout.fillHeight: true
-                }
-            }
-        }
     }
 }

qml/AppUI/AppPageHeader.qml

@@ -1,89 +0,0 @@
-/*
- * 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.Layouts 1.12
-import QtQuick.Controls 2.5
-import AppControls2 1.0 as AppControls2
-import org.ukui.menu.core 1.0
-import org.ukui.menu.utils 1.0
-
-Item {
-    id: appPageHeaderRoot
-    property string title: ""
-    property Item focusToPageContent
-    property Component content: null
-    clip: true
-
-    Loader {
-        id: loader
-        anchors.fill: parent
-        property string title: appPageHeaderRoot.title
-        sourceComponent: {
-            return appPageHeaderRoot.content === null ? defaultComponent : appPageHeaderRoot.content
-        }
-    }
-
-    Component {
-        id: defaultComponent
-        Item {
-            id: root
-
-            Item {
-                id: pluginSelectionBar
-                width: parent.width
-                height: parent.height
-                RowLayout {
-                    anchors.fill: parent
-                    anchors.leftMargin: 16
-                    spacing: 12
-                    AppControls2.StyleText {
-                        Layout.fillWidth: true
-                        Layout.fillHeight: true
-                        verticalAlignment: Qt.AlignVCenter
-                        text: appPageHeaderRoot.title
-                        font.bold: true
-                    }
-
-                    PluginSelectButton {
-                        id: pluginSelectButton
-                        Layout.preferredWidth: 64
-                        Layout.preferredHeight: 32
-                        Layout.maximumHeight: 32
-                        Layout.minimumWidth: 64
-                        Layout.rightMargin: 8
-                        Layout.alignment: Qt.AlignVCenter
-                    }
-                }
-            }
-
-            function updateTitle(id) {
-                appPageHeaderRoot.title = appPageHeaderUtils.getPluginTitle(id);
-            }
-
-            Component.onCompleted: {
-                updateTitle("");
-                appPageHeaderUtils.pluginChanged.connect(updateTitle);
-            }
-
-            Component.onDestruction: {
-                appPageHeaderUtils.pluginChanged.disconnect(updateTitle);
-            }
-        }
-    }
-}

qml/AppUI/AppPageSearch.qml

@@ -6,9 +6,11 @@ import org.ukui.quick.items 1.0 as UkuiItems
 import org.ukui.menu.utils 1.0
 
 Item {
+    id: root
+    property AppPageBackend backend: null
     property Item focusToPageContent
     property bool inputStatus: false
-    id: appPageSearchBar
+
     SearchInputBar {
         id: searchInputBar
         property string providerId: "search"
@@ -21,15 +23,17 @@ Item {
         visible: true
         onTextChanged: {
             if (text === "") {
-                appPageHeaderUtils.model(PluginGroup.SortMenuItem).reactivateProvider();
+                root.backend.group = PluginGroup.Display;
                 inputStatus = false;
             } else {
-                appPageHeaderUtils.activateProvider(providerId);
+                root.backend.group = PluginGroup.Search;
-                appPageHeaderUtils.startSearch(text);
+                // appPageHeaderUtils.startSearch(text);
+                root.backend.startSearch(text);
                 inputStatus = true;
             }
         }
     }
+
     function changeToSearch(keyEvent) {
         if (header.content === null) {
             searchInputBar.text = keyEvent;

qml/AppUI/FullScreenFooter.qml

@@ -43,12 +43,11 @@ Row {
             id: powerButtonBase
         }
 
-        ThemeIcon {
+        UkuiItems.Icon {
             anchors.centerIn: parent
             width: Math.floor(parent.width / 2)
             height: width
-            highLight: true
+            mode: UkuiItems.Icon.Highlight
-            autoHighLight: false
             source: powerButtonBase.icon
         }
 

qml/AppUI/FullScreenHeader.qml

@@ -28,10 +28,10 @@ Item {
 
         onTextChanged: {
             if (text === "") {
-                appPageHeaderUtils.model(PluginGroup.SortMenuItem).reactivateProvider();
+                // appPageHeaderUtils.model(PluginGroup.SortMenuItem).reactivateProvider();
             } else {
-                appPageHeaderUtils.model(PluginGroup.Button).reactivateProvider();
+                // appPageHeaderUtils.model(PluginGroup.Button).reactivateProvider();
-                appPageHeaderUtils.startSearch(text);
+                // appPageHeaderUtils.startSearch(text);
             }
         }
         Behavior on opacity {
@@ -50,12 +50,11 @@ Item {
         borderColor: Platform.Theme.Highlight
         border.width: buttonMouseArea.activeFocus ? 2 : 0
 
-        ThemeIcon {
+        UkuiItems.Icon {
             anchors.centerIn: parent
             width: parent.width / 2; height: width
-            source: "image://appicon/view-restore-symbolic"
+            source: "view-restore-symbolic"
-            highLight: true
+            mode: UkuiItems.Icon.Highlight
-            autoHighLight: false
         }
         MouseArea {
             id: buttonMouseArea

qml/AppUI/NormalUI.qml

@@ -1,11 +1,12 @@
 import QtQuick 2.12
+import QtQuick.Layouts 1.12
 import org.ukui.menu.core 1.0
 import org.ukui.quick.platform 1.0 as Platform
 import org.ukui.quick.items 1.0 as UkuiItems
 
 FocusScope {
     id: normalUI
-    anchors.fill: parent
+
     function focusToFalse() {
         focus = false;
     }
@@ -24,17 +25,29 @@ FocusScope {
 
     Component.onCompleted: mainWindow.visibleChanged.connect(focusToFalse)
     Component.onDestruction: mainWindow.visibleChanged.disconnect(focusToFalse)
-    Row {
+
-        anchors.fill: parent;
+    // 点击空白处失去焦点
+    MouseArea {
+        anchors.fill: parent
+        onClicked: {
+            normalUI.focusToFalse();
+        }
+    }
+
+    RowLayout {
+        anchors.fill: parent
+        spacing: 0
+        z: 10
+
         AppPage {
             id: appPage
-            width: 312
+            Layout.preferredWidth: 312
-            height: parent.height;
+            Layout.fillHeight: true
         }
 
         UkuiItems.StyleBackground {
-            width: 1
+            Layout.preferredWidth: 1
-            height: parent.height
+            Layout.fillHeight: true
 
             paletteRole: Platform.Theme.ButtonText
             useStyleTransparency: false
@@ -42,13 +55,13 @@ FocusScope {
         }
 
         WidgetPage {
-            width: parent.width - 374;
+            Layout.fillWidth: true
-            height: parent.height;
+            Layout.fillHeight: true
         }
 
         UkuiItems.StyleBackground {
-            width: 1
+            Layout.preferredWidth: 1
-            height: parent.height
+            Layout.fillHeight: true
 
             paletteRole: Platform.Theme.ButtonText
             useStyleTransparency: false
@@ -56,8 +69,8 @@ FocusScope {
         }
 
         Sidebar {
-            width: 60;
+            Layout.preferredWidth: 60
-            height: parent.height;
+            Layout.fillHeight: true
         }
     }
 }

qml/AppUI/PluginSelectButton.qml

@@ -46,7 +46,7 @@ UkuiItems.StyleBackground {
         anchors.bottomMargin: 2
         anchors.leftMargin: 2
         anchors.rightMargin: 2
-        property var model: appPageHeaderUtils.model(PluginGroup.SortMenuItem)
+        // property var model: appPageHeaderUtils.model(PluginGroup.SortMenuItem)
         spacing: 4
 
         UkuiItems.Button {

qml/AppUI/SearchInputBar.qml

@@ -56,12 +56,11 @@ UkuiItems.StyleBackground {
             anchors.left: parent.left
             anchors.leftMargin: (parent.height - height) / 2
 
-            ThemeIcon {
+            UkuiItems.Icon {
                 anchors.centerIn: parent
                 width: parent.height / 2; height: width
                 source: "search-symbolic"
-                highLight: mainWindow.isFullScreen
+                mode: mainWindow.isFullScreen ? UkuiItems.Icon.Highlight : UkuiItems.Icon.AutoHighlight
-                autoHighLight: !mainWindow.isFullScreen
             }
         }
 
@@ -131,16 +130,18 @@ UkuiItems.StyleBackground {
         Component.onDestruction: themePalette.styleColorChanged.disconnect(updateTextInputColor)
     }
 
-    AppControls2.RoundButton {
+    UkuiItems.Button {
-        id: clearButton
-        width: 18; height: width
         anchors.right: parent.right
         anchors.rightMargin: (parent.height - height) / 2
         anchors.verticalCenter: parent.verticalCenter
+        width: 18; height: width
         visible: textInput.activeFocus
-        buttonIcon: "image://appicon/edit-clear-symbolic"
+        activeFocusOnTab: false
-        highlight: mainWindow.isFullScreen
+
-        autoHighLight: !mainWindow.isFullScreen
+        background.radius: width/2
+        background.border.width: 1
+        icon.source: "edit-clear-symbolic"
+        icon.mode: mainWindow.isFullScreen ? UkuiItems.Icon.Highlight : UkuiItems.Icon.AutoHighlight
 
         onClicked: {
             textInput.clear();

qml/AppUI/qmldir

@@ -5,7 +5,7 @@ Sidebar 1.0 Sidebar.qml
 WidgetPage 1.0 WidgetPage.qml
 NormalUI 1.0 NormalUI.qml
 FullScreenUI 1.0 FullScreenUI.qml
-AppPageHeader 1.0 AppPageHeader.qml
+AppListHeader 1.0 AppListHeader.qml
 AppListView 1.0 AppListView.qml
 SearchInputBar 1.0 SearchInputBar.qml
 PluginSelectButton 1.0 PluginSelectButton.qml

qml/qml.qrc

@@ -12,7 +12,7 @@
         <file>AppUI/FullScreenHeader.qml</file>
         <file>AppUI/FullScreenContent.qml</file>
         <file>AppUI/FullScreenFooter.qml</file>
-        <file>AppUI/AppPageHeader.qml</file>
+        <file>AppUI/AppListHeader.qml</file>
         <file>AppUI/SearchInputBar.qml</file>
         <file>AppUI/AppListView.qml</file>
         <file>AppControls2/qmldir</file>

src/ukui-menu-application.cpp

@@ -20,19 +20,17 @@
 #include "menu-dbus-service.h"
 #include "settings.h"
 #include "commons.h"
-#include "model-manager.h"
 #include "theme-palette.h"
 #include "app-icon-provider.h"
 #include "menu-main-window.h"
-#include "app-page-header-utils.h"
 #include "power-button.h"
 #include "items/theme-icon.h"
 #include "app-manager.h"
 #include "context-menu-manager.h"
-#include "data-provider-manager.h"
 #include "event-track.h"
 #include "sidebar-button-utils.h"
 #include "extension/widget-model.h"
+#include "app-page-backend.h"
 
 #include <QGuiApplication>
 #include <QCommandLineParser>
@@ -65,9 +63,9 @@ void UkuiMenuApplication::registerQmlTypes()
     PowerButton::defineModule(uri, versionMajor, versionMinor);
     SidebarButtonUtils::defineModule(uri, versionMajor, versionMinor);
 
-    ModelManager::registerMetaTypes();
-
     qmlRegisterType<WidgetModel>(uri, versionMajor, versionMinor, "WidgetModel");
+    qmlRegisterType<AppPageBackend>(uri, versionMajor, versionMinor, "AppPageBackend");
+    qmlRegisterUncreatableType<AppListPluginGroup>(uri, versionMajor, versionMinor, "PluginGroup", "Use enums only.");
 
     // commons
     qRegisterMetaType<UkuiMenu::DataType::Type>("DataType::Type");
@@ -95,8 +93,6 @@ void UkuiMenuApplication::initQmlEngine()
     QQmlContext *context = m_engine->rootContext();
     context->setContextProperty("themePalette", ThemePalette::getInstance());
     context->setContextProperty("menuSetting", MenuSetting::instance());
-    context->setContextProperty("modelManager", ModelManager::instance());
-    context->setContextProperty("appPageHeaderUtils", new AppPageHeaderUtils(this));
     context->setContextProperty("menuManager", ContextMenuManager::instance());
     context->setContextProperty("appManager", AppManager::instance());
 
@@ -126,7 +122,7 @@ void UkuiMenuApplication::loadMenuUI()
         }
 
         execCommand(Hide);
-        DataProviderManager::instance()->toUpdate(false);
+//        DataProviderManager::instance()->toUpdate(false);
     });
 }
 
@@ -175,8 +171,8 @@ void UkuiMenuApplication::execCommand(Command command)
         default:
             break;
     }
-    bool isShowed = m_mainWindow->isVisible();
+//    bool isShowed = m_mainWindow->isVisible();
-    DataProviderManager::instance()->toUpdate(isShowed);
+//    DataProviderManager::instance()->toUpdate(isShowed);
 }
 
 UkuiMenuApplication::~UkuiMenuApplication()