添加全屏基础按键：搜索框、电源、滑动条、缩小窗口按键

qml/AppControls2/StyleBackground.qml

@@ -6,12 +6,12 @@ Rectangle {
     property int paletteRole: Palette.Base
     property int paletteGroup: Palette.Active
     property real alpha: 1.0
+    property bool isFocus: false
 
     clip: true
     border.width: 0
 
     function updateColor() {
-        border.color = themePalette.paletteColor(Palette.Highlight)
         if (useStyleTransparent) {
             color = themePalette.paletteColorWithTransparency(paletteRole,paletteGroup)
         } else {
@@ -19,12 +19,23 @@ Rectangle {
         }
     }
 
+    function updateBorderColor() {
+        if (isFocus) {
+            border.color = themePalette.paletteColor(Palette.Highlight)
+        } else {
+            border.color = themePalette.paletteColorWithCustomTransparency(Palette.Base, Palette.Active, 0.1)
+        }
+    }
+
     Component.onCompleted: {
         updateColor()
+        updateBorderColor()
         themePalette.styleColorChanged.connect(updateColor)
+        themePalette.styleColorChanged.connect(updateBorderColor)
     }
     Component.onDestruction: {
         themePalette.styleColorChanged.disconnect(updateColor)
+        themePalette.styleColorChanged.disconnect(updateBorderColor)
     }
 
     onUseStyleTransparentChanged: {
@@ -39,5 +50,8 @@ Rectangle {
     onAlphaChanged: {
         updateColor()
     }
+    onIsFocusChanged: {
+        updateBorderColor()
+    }
 }
 

qml/AppUI/AppPageHeader.qml

@@ -77,7 +77,6 @@ Item {
                 Layout.fillWidth: true
                 Layout.fillHeight: true
                 radius: 16
-                useStyleTransparent: false
                 onTextChanged: {
                     if (text === "") {
                         pluginSelectMenu.model.reactivateProvider();

qml/AppUI/FullScreenContent.qml

@@ -1,12 +1,31 @@
+/*
+ * 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 QtQml.Models 2.12
+import QtQuick.Controls 2.5
 import org.ukui.menu.core 1.0
 import AppControls2 1.0 as AppControls2
 
 RowLayout {
     clip: true
+    spacing: 0
 
     Item {
         Layout.preferredWidth: 90
@@ -110,6 +129,7 @@ RowLayout {
                 cellWidth: contentViewBase.cellWidth
                 cellHeight: contentViewBase.cellHeight
                 model: modelManager.getAppModel()
+
                 delegate: Loader {
                     width: GridView.view.cellWidth
                     height: width
@@ -282,14 +302,34 @@ RowLayout {
     }
 
     Item {
-        Layout.preferredWidth: 90
+        Layout.preferredWidth: 48
         Layout.fillHeight: true
 
-        AppControls2.ScrollBar {
+        ScrollBar {
             id: fullScreenScrollBar
-            anchors.horizontalCenter: parent.horizontalCenter
+            anchors.centerIn: parent
-            height: parent.height
+            height: 200
-            width: 20
+            width: (hovered || pressed) ? 8 : 4
+            padding: 0
+            opacity: fullScreenScrollBar.size < 1.0 ? 1.0 : 0.0
+
+            Behavior on width {
+                NumberAnimation { duration: 200; easing.type: Easing.InOutQuad }
+            }
+
+            background: AppControls2.StyleBackground {
+                useStyleTransparent: false
+                paletteRole: Palette.Dark
+                alpha: 0.25
+                radius: width / 2
+            }
+
+            contentItem: AppControls2.StyleBackground {
+                radius: width / 2
+                useStyleTransparent: false
+                paletteRole: Palette.Light
+                alpha: fullScreenScrollBar.pressed ? 0.90 : fullScreenScrollBar.hovered ? 0.78 : 0.60
+            }
         }
     }
 }

qml/AppUI/FullScreenFooter.qml

@@ -1,8 +1,62 @@
-import QtQuick 2.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/>.
+ *
+ */
 
-Item {
+import QtQuick 2.0
-    Text {
+import QtQuick.Layouts 1.12
-        anchors.fill: parent
+import QtQuick.Controls 2.5
-        text: qsTr("FullScreenFooter.qml")
+
+import AppControls2 1.0 as AppControls2
+import org.ukui.menu.core 1.0
+import org.ukui.menu.utils 1.0
+
+Row {
+    Layout.fillWidth: true
+    Layout.preferredHeight: 48
+    layoutDirection: Qt.RightToLeft
+
+    AppControls2.StyleBackground {
+        width: 48; height: width
+        useStyleTransparent: false
+        paletteRole: Palette.Light
+        alpha: powerButtonArea.containsPress ? 0.25 : powerButtonArea.containsMouse ? 0.12 : 0
+        radius: height / 2
+
+        PowerButton {
+            id: powerButtonBase
+        }
+
+        Image {
+            anchors.centerIn: parent
+            width: Math.floor(parent.width / 2)
+            height: width
+            source: powerButtonBase.icon
+        }
+
+        MouseArea {
+            id: powerButtonArea
+            anchors.fill: parent
+            hoverEnabled: true
+            ToolTip.visible: containsMouse
+            ToolTip.text: powerButtonBase.toolTip
+            onClicked: {
+                powerButtonBase.clicked()
+            }
+        }
     }
 }
+

qml/AppUI/FullScreenHeader.qml

@@ -3,26 +3,56 @@ import QtQuick.Layouts 1.12
 import QtQuick.Controls 2.12
 import AppControls2 1.0 as AppControls2
 import org.ukui.menu.core 1.0
+import org.ukui.menu.utils 1.0
 
 Item {
     clip: true
+    SearchInputBar {
+        width: 372; height: 36
+        anchors.centerIn: parent
+        radius: height / 2
+
+        onTextChanged: {
+            if (text === "") {
+                pluginSelectMenu.model.reactivateProvider();
+            } else {
+                appPageHeaderUtils.model(PluginGroup.Button).reactivateProvider();
+                appPageHeaderUtils.startSearch(text);
+            }
+        }
+    }
 
     PluginSelectMenu {
+        id: pluginSelectMenu
         anchors.right: parent.right
         anchors.rightMargin: 72 // 48+24
         anchors.verticalCenter: parent.verticalCenter
-        width: 80
+        height: 48; width: 72 // 48+16+8
-        height: 48
         spacing: 8
     }
 
-    AppControls2.RoundButton {
+    AppControls2.StyleBackground {
+        width: 48; height: width
+        radius: 4
+        useStyleTransparent: false
+        paletteRole: Palette.Light
+        alpha: buttonMouseArea.containsPress ? 0.30 : buttonMouseArea.containsMouse ? 0.20 : 0.00
         anchors.right: parent.right
         anchors.verticalCenter: parent.verticalCenter
-        width: 48
+
-        height: 48
+        ThemeIcon {
-        buttonIcon: "image://appicon/view-restore-symbolic"
+            anchors.centerIn: parent
-        onClicked: mainWindow.exitFullScreen()
+            width: parent.width / 2; height: width
+            source: "image://appicon/view-restore-symbolic"
+            highLight: true
+            autoHighLight: false
+        }
+        MouseArea {
+            id: buttonMouseArea
+            hoverEnabled: true
+            anchors.fill: parent
+            onClicked: mainWindow.exitFullScreen()
+        }
     }
 }
 

qml/AppUI/PluginSelectMenu.qml

@@ -122,14 +122,14 @@ RowLayout {
                 clip: true
                 spacing: 4
                 model: pluginSelectMenuRoot.model
+
                 delegate: AppControls2.StyleBackground {
                     width: ListView.view ? ListView.view.width : 0
                     height: 32
                     radius: 4
-                    alpha: mouseArea.containsMouse ? 0.2 : 1
+                    alpha: mouseArea.containsMouse ? 0.2 : 0
-                    paletteRole: mouseArea.containsMouse ? Palette.Text : Palette.Window
+                    paletteRole: Palette.Text
                     useStyleTransparent: false
-                    opacity: sortMenu.opacity
 
                     Item {
                         anchors.fill: parent

qml/AppUI/SearchInputBar.qml

@@ -16,7 +16,7 @@
  *
  */
 
-import QtQuick 2.0
+import QtQuick 2.12
 import QtQuick.Controls 2.5
 import QtQuick.Layouts 1.12
 import org.ukui.menu.core 1.0
@@ -30,49 +30,95 @@ AppControls2.StyleBackground {
     alpha: 0.04
     useStyleTransparent: false
     paletteRole: Palette.Text
-    border.width: textInput.activeFocus ? 1 : 0
+    border.width: 1
+    isFocus: textInput.activeFocus
 
-    RowLayout {
+    Item {
-        anchors.fill: parent
+        id: defaultSearch
-        anchors.rightMargin: parent.radius
+        width: searchIcon.width + defaultText.contentWidth; height: parent.height
+        anchors.horizontalCenter: mainWindow.isFullScreen ? parent.horizontalCenter : undefined
+        anchors.verticalCenter: parent.verticalCenter
 
         Item {
-            Layout.fillWidth: true
+            id: searchIcon
-            Layout.fillHeight: true
+            width: 32; height: 32
-            Layout.margins: 2
+            anchors.verticalCenter: parent.verticalCenter
-            Layout.maximumWidth: parent.height - 2*Layout.margins
+            anchors.left: parent.left
-            Layout.maximumHeight: parent.height
+            anchors.leftMargin: (parent.height - height) / 2
-            Layout.alignment: Qt.AlignVCenter
 
-            Image {
+            ThemeIcon {
                 anchors.centerIn: parent
-                width:16; height: 16
+                width: parent.height / 2; height: width
                 source: "image://appicon/search-symbolic"
+                highLight: mainWindow.isFullScreen
             }
         }
-        Item {
-            Layout.fillWidth: true
-            Layout.fillHeight: true
 
-            TextInput {
-                id: textInput
-                clip: true
-                anchors.fill: parent
-                selectByMouse: true
-                selectionColor: "lightblue"
-                verticalAlignment: TextInput.AlignVCenter
-                font.pixelSize: 14
-                focus: parent.visible;
-            }
 
-            Text {
+        AppControls2.StyleText {
-                anchors.fill: parent
+            id: defaultText
-                text: qsTr("Search App")
+            anchors.verticalCenter: parent.verticalCenter
-                visible: textInput.contentWidth === 0
+            anchors.left: searchIcon.right
-                font.pixelSize: textInput.font.pixelSize
+            text: qsTr("Search App")
-                verticalAlignment: TextInput.AlignVCenter
+            visible: textInput.contentWidth === 0
-                color: Qt.rgba(0,0,0,0.25)
+            font.pixelSize: 14
+            paletteRole: mainWindow.isFullScreen ? Palette.HighlightedText : Palette.Text
+            verticalAlignment: TextInput.AlignVCenter
+            alpha: 0.25
+        }
+
+        states: State {
+            when: textInput.activeFocus || !mainWindow.isFullScreen
+            AnchorChanges {
+                target: defaultSearch
+                anchors.left: parent.left
+                anchors.horizontalCenter: undefined
             }
         }
+
+        transitions: Transition {
+            AnchorAnimation { duration: 300; easing.type: Easing.InOutCubic }
+        }
+    }
+
+    TextInput {
+        id: textInput
+        clip: true
+        anchors.right: parent.right
+        width: parent.width - searchIcon.width
+        height: parent.height
+        selectByMouse: true
+        verticalAlignment: TextInput.AlignVCenter
+        font.pixelSize: 14
+        focus: parent.visible || mainWindow.isFullScreen
+        onActiveFocusChanged: clear()
+
+        property int textColor: mainWindow.isFullScreen ? Palette.HighlightedText : Palette.Text
+
+        function updateTextInputColor() {
+            color = themePalette.paletteColor(textColor)
+            selectionColor = themePalette.paletteColor(Palette.Highlight)
+        }
+
+        Component.onCompleted: {
+            updateTextInputColor();
+            themePalette.styleColorChanged.connect(updateTextInputColor);
+        }
+
+        onTextColorChanged: updateTextInputColor()
+        Component.onDestruction: themePalette.styleColorChanged.disconnect(updateTextInputColor)
+    }
+
+    AppControls2.RoundButton {
+        id: clearButton
+        width: 18; height: width
+        anchors.right: parent.right
+        anchors.rightMargin: (parent.height - height) / 2
+        anchors.verticalCenter: parent.verticalCenter
+        visible: mainWindow.isFullScreen && textInput.activeFocus
+        buttonIcon: "image://appicon/edit-clear-symbolic"
+        highlight: true
+
+        onClicked: textInput.clear();
     }
 }

qml/AppUI/Sidebar.qml

@@ -63,7 +63,7 @@ Item {
                 radius: 4
                 useStyleTransparent: false
                 alpha: buttonMouseArea.containsPress ? 0.65 : buttonMouseArea.containsMouse ? 0.40 : 0.00
-                Image {
+                ThemeIcon {
                     anchors.centerIn: parent
                     width: parent.width / 2; height: width
                     source: "image://appicon/view-fullscreen-symbolic"

qml/main.qml

@@ -74,8 +74,10 @@ Item {
         anchors.left: parent.left
         anchors.bottom: parent.bottom
         radius: 12
-        state: "normalScreen"
 
+        Component.onCompleted: {
+            state = mainWindow.isFullScreen ? "fullScreen" : "normalScreen"
+        }
         onHeightChanged:  {
             if (root.transparency <= 0.6 && root.onComlpeted) {
                 mainWindow.changeWindowBlurRegion(0, root.height - height, width, height)
@@ -159,15 +161,24 @@ Item {
         sourceComponent: normalComponent
         NumberAnimation { id: normalShow; target: normalScreenLoader; properties: "opacity"; from: 0; to: 1; duration: root.animationDuration; easing.type: Easing.InQuint }
         NumberAnimation { id: normalHide; target: normalScreenLoader; properties: "opacity"; from: 1; to: 0; duration: root.animationDuration; easing.type: Easing.OutQuint }
+
+        Component.onCompleted: {
+            active = mainWindow.isFullScreen ? false : true;
+            opacity = mainWindow.isFullScreen ? 0 : 1;
+        }
     }
 
     Loader {
         id: fullScreenLoader
         anchors.fill: parent
         sourceComponent: fullSceenComponent
-        opacity: 0
         NumberAnimation { id: fullShow; target: fullScreenLoader; properties: "opacity"; from: 0; to: 1; duration: root.animationDuration; easing.type: Easing.InQuint }
         NumberAnimation { id: fullHide; target: fullScreenLoader; properties: "opacity"; from: 1; to: 0; duration: root.animationDuration; easing.type: Easing.OutQuint }
+
+        Component.onCompleted: {
+            active = mainWindow.isFullScreen ? true : false;
+            opacity = mainWindow.isFullScreen ? 1 : 0;
+        }
     }
 
     Component {