From 12cae14527bf2fb043e13f70163e3277ce9bec97 Mon Sep 17 00:00:00 2001 From: hewenfei Date: Fri, 17 Mar 2023 17:22:14 +0800 Subject: [PATCH] =?UTF-8?q?=E5=B0=86=E6=8F=92=E4=BB=B6=E9=80=89=E6=8B=A9?= =?UTF-8?q?=E5=99=A8=E6=8F=90=E5=8F=96=E4=B8=BA=E5=8D=95=E7=8B=AC=E7=BB=84?= =?UTF-8?q?=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- qml/AppUI/AppPageHeader.qml | 122 ++----------------------------- qml/AppUI/PluginSelectMenu.qml | 129 +++++++++++++++++++++++++++++++++ qml/AppUI/qmldir | 1 + qml/qml.qrc | 1 + 4 files changed, 136 insertions(+), 117 deletions(-) create mode 100644 qml/AppUI/PluginSelectMenu.qml diff --git a/qml/AppUI/AppPageHeader.qml b/qml/AppUI/AppPageHeader.qml index b2c3ef1..938bde6 100644 --- a/qml/AppUI/AppPageHeader.qml +++ b/qml/AppUI/AppPageHeader.qml @@ -34,7 +34,7 @@ Item { name: "normal" PropertyChanges { target: searchBar; scale: 0.9; y: -pluginSelectionBar.height } PropertyChanges { target: pluginSelectionBar; scale: 1.0; y: 0 } - StateChangeScript { script: sortMenu.sortMenuModel.reactivateProvider() } + StateChangeScript { script: pluginSelectMenu.model.reactivateProvider() } }, State { name: "search" @@ -80,7 +80,7 @@ Item { useStyleTransparent: false onTextChanged: { if (text === "") { - sortMenu.sortMenuModel.reactivateProvider(); + pluginSelectMenu.model.reactivateProvider(); } else { appPageHeaderUtils.activateProvider(providerId); appPageHeaderUtils.startSearch(text); @@ -138,125 +138,13 @@ Item { } } - Row { + PluginSelectMenu { + id: pluginSelectMenu Layout.preferredWidth: childrenRect.width Layout.preferredHeight: 32 + Layout.maximumHeight: 32 Layout.rightMargin: 8 Layout.alignment: Qt.AlignVCenter - - AppControls2.RoundButton { - id: providerIcon - width: 32; height: width - buttonIcon: "image://appicon/ukui-selected" - - onClicked: { - sortMenu.sortMenuModel.autoSwitchProvider(); - } - } - - Image { - id: providerSelector - width: 16 - height: width - anchors.verticalCenter: parent.verticalCenter - source: "image://appicon/ukui-down.symbolic" - - MouseArea { - anchors.fill: parent - onClicked: { - sortMenu.show(); - } - } - } - - function updateProviderIcon() { - providerIcon.buttonIcon = sortMenu.sortMenuModel.currentProviderIcon(); - } - - Component.onCompleted: { - updateProviderIcon(); - sortMenu.sortMenuModel.currentIndexChanged.connect(updateProviderIcon); - } - } - } - } - - Menu { - id: sortMenu - width: 128 - height: 120 - padding: 8 - clip: true - property var sortMenuModel: appPageHeaderUtils.model(PluginGroup.SortMenuItem) - - function show() { - popup(); - } - - onOpened: { - providerSelector.source = "image://appicon/ukui-up.symbolic"; - } - - onClosed: { - providerSelector.source = "image://appicon/ukui-down.symbolic"; - } - - // TODO 添加边框阴影 - background: AppControls2.StyleBackground { - paletteRole: Palette.Window - useStyleTransparent: false - radius: 8 - } - - contentItem: ListView { - clip: true - spacing: 4 - model: sortMenu.sortMenuModel - delegate: AppControls2.StyleBackground { - width: ListView.view ? ListView.view.width : 0 - height: 32 - radius: 4 - alpha: (model.isChecked || mouseArea.isHoverd) ? 0.2 : 1 - paletteRole: (model.isChecked || mouseArea.isHoverd) ? Palette.Text : Palette.Window - useStyleTransparent: false - - Item { - anchors.fill: parent - anchors.margins: 8 - Image { - visible: model.isChecked - anchors.verticalCenter: parent.verticalCenter - width: 16 - height: 16 - source: "image://appicon/object-select.symbolic" - } - AppControls2.StyleText { - x: 24 - verticalAlignment: Text.AlignVCenter - width: parent.width - x - height: parent.height - text: model.name - } - } - - MouseArea { - id: mouseArea - anchors.fill: parent - hoverEnabled: true - property bool isHoverd: false - onClicked: { - if (model.isChecked) { - return; - } - appPageHeaderUtils.activateProvider(model.id); - } - onEntered: { - isHoverd = true; - } - onExited: { - isHoverd = false; - } - } } } } diff --git a/qml/AppUI/PluginSelectMenu.qml b/qml/AppUI/PluginSelectMenu.qml new file mode 100644 index 0000000..8bb5d28 --- /dev/null +++ b/qml/AppUI/PluginSelectMenu.qml @@ -0,0 +1,129 @@ +import QtQuick 2.0 +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 + +RowLayout { + id: pluginSelectMenuRoot + property var model: appPageHeaderUtils.model(PluginGroup.SortMenuItem) + spacing: 2 + AppControls2.RoundButton { + id: pluginSelectButton + Layout.fillHeight: true + Layout.fillWidth: true + Layout.maximumWidth: height + buttonIcon: "image://appicon/ukui-selected" + onClicked: { + pluginSelectMenuRoot.model.autoSwitchProvider(); + } + } + + MouseArea { + Layout.alignment: Qt.AlignVCenter + Layout.fillWidth: true + Layout.fillHeight: true + Layout.maximumWidth: 16 + Layout.maximumHeight: 16 + + onClicked: { + sortMenu.popup(); + } + + Image { + id: sortMenuSelector + anchors.fill: parent + source: "image://appicon/ukui-down.symbolic" + } + + Menu { + id: sortMenu + width: 128 + height: 120 + padding: 8 + clip: true + + // TODO 添加边框阴影 + background: AppControls2.StyleBackground { + paletteRole: Palette.Window + useStyleTransparent: false + radius: 8 + } + + contentItem: ListView { + clip: true + spacing: 4 + model: pluginSelectMenuRoot.model + delegate: AppControls2.StyleBackground { + width: ListView.view ? ListView.view.width : 0 + height: 32 + radius: 4 + alpha: (model.isChecked || mouseArea.isHoverd) ? 0.2 : 1 + paletteRole: (model.isChecked || mouseArea.isHoverd) ? Palette.Text : Palette.Window + useStyleTransparent: false + + Item { + anchors.fill: parent + anchors.margins: 8 + Image { + visible: model.isChecked + anchors.verticalCenter: parent.verticalCenter + width: 16 + height: 16 + source: "image://appicon/object-select.symbolic" + } + AppControls2.StyleText { + x: 24 + verticalAlignment: Text.AlignVCenter + width: parent.width - x + height: parent.height + text: model.name + } + } + + MouseArea { + id: mouseArea + anchors.fill: parent + hoverEnabled: true + property bool isHoverd: false + onClicked: { + if (model.isChecked) { + return; + } + appPageHeaderUtils.activateProvider(model.id); + } + onEntered: { + isHoverd = true; + } + onExited: { + isHoverd = false; + } + } + } + } + + Component.onCompleted: { + updateProviderIcon(); + pluginSelectMenuRoot.model.currentIndexChanged.connect(updateProviderIcon); + } + + Component.onDestruction: { + pluginSelectMenuRoot.model.currentIndexChanged.disconnect(updateProviderIcon); + } + + function updateProviderIcon() { + pluginSelectButton.buttonIcon = pluginSelectMenuRoot.model.currentProviderIcon(); + } + + onOpened: { + sortMenuSelector.source = "image://appicon/ukui-up.symbolic"; + } + + onClosed: { + sortMenuSelector.source = "image://appicon/ukui-down.symbolic"; + } + } + } +} diff --git a/qml/AppUI/qmldir b/qml/AppUI/qmldir index ab3bfa3..1263720 100644 --- a/qml/AppUI/qmldir +++ b/qml/AppUI/qmldir @@ -6,3 +6,4 @@ NormalUI 1.0 NormalUI.qml FullScreenUI 1.0 FullScreenUI.qml AppPageHeader 1.0 AppPageHeader.qml SearchInputBar 1.0 SearchInputBar.qml +PluginSelectMenu 1.0 PluginSelectMenu.qml diff --git a/qml/qml.qrc b/qml/qml.qrc index 3e3d069..d43b85e 100644 --- a/qml/qml.qrc +++ b/qml/qml.qrc @@ -27,5 +27,6 @@ AppControls2/RoundButton.qml AppUI/SelectionPage.qml AppUI/AppPageContent.qml + AppUI/PluginSelectMenu.qml