From 85f4aaeb4c14d4bcc2d82be2266c719faa205c83 Mon Sep 17 00:00:00 2001 From: qiqi49 Date: Tue, 30 Jan 2024 16:16:09 +0800 Subject: [PATCH] =?UTF-8?q?feat(extension):=E4=BC=98=E5=8C=96=E3=80=81?= =?UTF-8?q?=E6=8B=86=E5=88=86=E5=BA=94=E7=94=A8=E7=BB=84UI=E6=98=BE?= =?UTF-8?q?=E7=A4=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- qml/AppUI/EditText.qml | 14 +- qml/AppUI/Folder.qml | 309 --------------------------- qml/AppUI/qmldir | 2 +- qml/extensions/FavoriteDelegate.qml | 7 +- qml/extensions/FavoriteExtension.qml | 2 +- qml/extensions/FavoriteGridView.qml | 2 +- qml/extensions/FolderContent.qml | 193 +++++++++++++++++ qml/extensions/FolderGridView.qml | 182 +++++++++++++++- qml/extensions/FullScreenFolder.qml | 170 +++++++++++++++ qml/qml.qrc | 3 +- 10 files changed, 556 insertions(+), 328 deletions(-) delete mode 100644 qml/AppUI/Folder.qml create mode 100644 qml/extensions/FolderContent.qml create mode 100644 qml/extensions/FullScreenFolder.qml diff --git a/qml/AppUI/EditText.qml b/qml/AppUI/EditText.qml index 122e1d3..dc93aa0 100644 --- a/qml/AppUI/EditText.qml +++ b/qml/AppUI/EditText.qml @@ -32,6 +32,7 @@ Item { property bool isFolder: false property real textInputSize: 14 + signal textEditingFinished(string text) Component { id: unEditText UkuiItems.StyleText { @@ -41,12 +42,12 @@ Item { elide: Text.ElideRight text: contain.textEdited paletteRole: isFullScreen ? Platform.Theme.HighlightedText : Platform.Theme.Text - font.bold: !isFolder + font.bold: isFolder // AppControls2 StyleText property real textUltra: 2*systemFontSize - property real systemFontSize: 10 + property real systemFontSize: 16 - font.pointSize: isFolder ? textUltra : systemFontSize + font.pointSize:(isFolder && isFullScreen) ? textUltra : systemFontSize MouseArea { id: textArea @@ -87,13 +88,14 @@ Item { font.pointSize: contain.textInputSize onEditingFinished: { - modelManager.getFolderModel().renameFolder(text); +// modelManager.getFolderModel().renameFolder(text); contain.textEdited = text; contain.editStatus = false; + textEditingFinished(text); } function updateTextInputColor() { - color = isFullScreenFolder ? Platform.Theme.highlightedText() : Platform.Theme.text(); + color = isFullScreen ? Platform.Theme.highlightedText() : Platform.Theme.text(); selectionColor = Platform.Theme.highlight(); } @@ -120,7 +122,7 @@ Item { anchors.centerIn: parent width: 16; height: width source: "image://theme/edit-clear-symbolic" - mode: isFullScreenFolder ? UkuiItems.Icon.Highlight : UkuiItems.Icon.AutoHighlight + mode: isFullScreen ? UkuiItems.Icon.Highlight : UkuiItems.Icon.AutoHighlight } onClicked: { diff --git a/qml/AppUI/Folder.qml b/qml/AppUI/Folder.qml deleted file mode 100644 index d682bb3..0000000 --- a/qml/AppUI/Folder.qml +++ /dev/null @@ -1,309 +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 . - * - */ - -import QtQuick 2.0 -import QtQml.Models 2.12 -import QtQuick.Layouts 1.12 -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 - - -Loader { - id: root - active: false - property var folderModel - property string folderName: "" - property int folderX: 0 - property int folderY: 0 - property int viewMaxRow: 0 - property bool isFolderOpened: false - - property bool isFullScreen: true - property int margins: isFullScreen? 20 : 0 - property int animationDuration: 300 - property bool mouseEnable: false - signal turnPageFinished() - - function initFolder(id, name, x, y) { - extensionData.folderModel.setFolderId(id); - folderName = name; - folderX = x; - folderY = y; - viewMaxRow = Math.ceil(folderModel.count / 4) > 4 ? 4 : Math.ceil(folderModel.count / 4); - active = true; - isFolderOpened = true; - } - - sourceComponent: folderComponent - - Component { - id: folderComponent - Item { - UkuiItems.StyleBackground { - id: folderIconBase - paletteRole: Platform.Theme.Text - useStyleTransparency: false - property int folderIconSize: 0 - property int iconSpacing: 0 - property int imageX: 0 - property int imageY: 0 - property int gridViewMargin: 8 - alpha: 0.25 - - state: isFolderOpened ? "folderOpened" : "folderHidden" - states: [ - State { - name: "folderOpened" - PropertyChanges { - target: folderIconBase - width: isFullScreen ? 720 : 348 - height: isFullScreen ? (viewMaxRow * 170 + margins * 2) : (viewMaxRow * 85 + margins * 2) - radius: Platform.Theme.maxRadius - gridViewMargin: margins - x: isFullScreen ? (parent.width - width) / 2 : 56 - y: isFullScreen ? (parent.height - height) / 2 : 104 - // 内部图标尺寸和布局 - folderIconSize:isFullScreen ? 96 : 48 - iconSpacing: 8 - imageX: isFullScreen ? 37 : 13 - imageY: isFullScreen ? 17 : 8 - } - PropertyChanges { target: folderNameText; opacity: 1 } - }, - State { - name: "folderHidden" - PropertyChanges { - target: folderIconBase - width: 86 - height: 86 - radius: Platform.Theme.maxRadius - gridViewMargin: 8 - x: root.mapFromGlobal(folderX, 0).x - y: root.mapFromGlobal(0, folderY).y - // 内部图标尺寸和布局 - folderIconSize: 16 - iconSpacing: 0 - imageX: 0 - imageY: 0 - } - PropertyChanges { target: folderNameText; opacity: 0 } - } - ] - transitions: [ - Transition { - to: "folderHidden" - SequentialAnimation { - ScriptAction { script: mouseEnable = false } - ParallelAnimation { - PropertyAnimation { - duration: animationDuration; easing.type: Easing.InOutCubic - properties: "x, y, width, height, folderIconSize, iconSpacing, radius, imageX, imageY, gridViewMargin" - } - PropertyAnimation { - duration: animationDuration; easing.type: Easing.OutQuint - properties: "opacity" - } - } - ScriptAction { script: folderSwipeView.hideFolder() } - } - }, - Transition { - to: "folderOpened" - SequentialAnimation { - ParallelAnimation { - PropertyAnimation { - duration: animationDuration; easing.type: Easing.InOutCubic - properties: "x, y, width, height, folderIconSize, iconSpacing, radius, imageX, imageY, gridViewMargin" - } - PropertyAnimation { - duration: animationDuration; easing.type: Easing.InQuint - properties: "opacity" - } - } - ScriptAction { - script: { - folderSwipeView.contentItem.highlightMoveDuration = 0; - mouseEnable = true - } - } - } - } - ] - - PageIndicator { - id: pageIndicator - interactive: true - count: folderSwipeView.count - visible: count > 1 - currentIndex: folderSwipeView.currentIndex - anchors.bottom: parent.bottom - anchors.horizontalCenter: parent.horizontalCenter - - delegate: Rectangle { - color: "grey" - width: (index === folderSwipeView.currentIndex )? 20 : 6; height: 6; - radius: width / 2 - opacity: (index === folderSwipeView.currentIndex )? 1 : 0.6 - Behavior on width { - NumberAnimation { duration: animationDuration; easing.type: Easing.InOutCubic } - } - } - } - - SwipeView { - id: folderSwipeView - anchors.fill: parent - property bool needTurnPage: false - property int contentX: contentItem.contentX - property int startContentX: 0 - property int startIndex: 0 - - function hideFolder() { - // 在非第一页时，执行翻页动画 - if (currentIndex > 0) { - interactive = false; - needTurnPage = true; - pageIndicator.visible = false; - contentItem.highlightFollowsCurrentItem = true; - contentItem.highlightMoveDuration = 300; - contentItem.highlightMoveVelocity = -1; - startContentX = contentX; - startIndex = currentIndex; - currentIndex = 0; - // 在第一页或单页时，全屏文件夹直接隐藏 - } else { - reset(); - } - } - - function reset() { - interactive = true; - root.active = false; - pageIndicator.visible = false; - turnPageFinished(); - } - - // 判断执行翻页结束后，全屏文件夹隐藏 - onContentXChanged: { - // 对比翻页过程的位移 - if (needTurnPage && startContentX - contentX === startIndex * 86) { - needTurnPage = false; - reset(); - } - } - - Repeater { - model: Math.ceil(folderModel.count / 16) - - Item { - id: base - property int currentPage: SwipeView.index - - GridView { - id: folderGridView - cellHeight: width / 4; cellWidth: cellHeight - anchors.fill: parent - anchors.margins: folderIconBase.gridViewMargin - boundsBehavior: Flickable.StopAtBounds - - model: DelegateModel { - property int maxItemNumPerPage: 16 - filterOnGroup: "folderContent" - groups: DelegateModelGroup { - name: "folderContent" - } - - items.onChanged: { - var groupIndex = groups.length - 1; - if (groups[groupIndex].count !== 0) { - groups[groupIndex].remove(0, groups[groupIndex].count); - } - - for (var i = base.currentPage * maxItemNumPerPage; - i < Math.min((base.currentPage + 1) * maxItemNumPerPage, items.count); i ++) { - items.addGroups(i, 1, "folderContent"); - } - } - - model: folderModel - delegate: MouseArea { - hoverEnabled: true - enabled: mouseEnable - width: GridView.view.cellWidth; height: GridView.view.cellHeight - acceptedButtons: Qt.LeftButton | Qt.RightButton - - UkuiItems.StyleBackground { - anchors.fill: parent - useStyleTransparency: false - paletteRole: Platform.Theme.Light - radius: Platform.Theme.maxRadius - alpha: parent.containsPress ? 0.25 : parent.containsMouse ? 0.15 : 0.00 - - Image { - id: iconImage - source: icon - height: folderIconBase.folderIconSize; width: height - x: folderIconBase.imageX; y: folderIconBase.imageY - } - - UkuiItems.StyleText { - width: parent.width - horizontalAlignment: Text.AlignHCenter - anchors.top: iconImage.bottom - anchors.topMargin: folderIconBase.iconSpacing - anchors.horizontalCenter: parent.horizontalCenter - text: name - elide: Text.ElideRight - paletteRole: Platform.Theme.HighlightedText - } - } - onClicked: { - if (mouse.button === Qt.RightButton) { - menuManager.showMenu(id, MenuInfo.Folder); - return; - } - if (mouse.button === Qt.LeftButton) { - appManager.launchApp(id); - return; - } - } - } - } - } - } - } - } - } - - EditText { - id: folderNameText - anchors.bottom: folderIconBase.top - anchors.bottomMargin: 30 - anchors.horizontalCenter: folderIconBase.horizontalCenter - height: 47; width: folderIconBase.width - textEdited: folderName - textCenterIn: true - isFolder: true - isFullScreen: isFullScreen - } - } - } - -} diff --git a/qml/AppUI/qmldir b/qml/AppUI/qmldir index fa0fdb5..c7cbcbd 100644 --- a/qml/AppUI/qmldir +++ b/qml/AppUI/qmldir @@ -16,4 +16,4 @@ FullScreenFooter 1.0 FullScreenFooter.qml FullScreenAppList 1.0 FullScreenAppList.qml FullScreenAppItem 1.0 FullScreenAppItem.qml AppLabelPage 1.0 AppLabelPage.qml -Folder 1.0 Folder.qml +EditText 1.0 EditText.qml diff --git a/qml/extensions/FavoriteDelegate.qml b/qml/extensions/FavoriteDelegate.qml index 120c2b0..e172923 100644 --- a/qml/extensions/FavoriteDelegate.qml +++ b/qml/extensions/FavoriteDelegate.qml @@ -161,15 +161,14 @@ UkuiItems.StyleBackground { rows: 2; columns: 2 spacing: 2; padding: 2 icons: icon - radius: 4; alpha: 0.25 + radius: 4; alpha: 0.10 } - function itemClicked(mouseButton) { if (mouseButton === Qt.RightButton) { visualModel.model.openMenu(index); } else { - var x = mapToGlobal(0,0).x; - var y = mapToGlobal(0,0).y + var x = mapToGlobal(folderIcon.x, folderIcon.y).x; + var y = mapToGlobal(folderIcon.x, folderIcon.y).y openFolderSignal(id, name, x, y); // 执行隐藏动画，并且当前图标消失且鼠标区域不可用 favoriteView.isContentShow = false; diff --git a/qml/extensions/FavoriteExtension.qml b/qml/extensions/FavoriteExtension.qml index fc6937a..610fcd8 100644 --- a/qml/extensions/FavoriteExtension.qml +++ b/qml/extensions/FavoriteExtension.qml @@ -70,7 +70,7 @@ UkuiMenuExtension { z: 1 } - AppUI.Folder { + FolderGridView { id: folderLoader anchors.fill: parent diff --git a/qml/extensions/FavoriteGridView.qml b/qml/extensions/FavoriteGridView.qml index c73cf11..fc2bba6 100644 --- a/qml/extensions/FavoriteGridView.qml +++ b/qml/extensions/FavoriteGridView.qml @@ -29,7 +29,7 @@ import AppControls2 1.0 as AppControls2 GridView { id: favoriteView cellWidth: width / column - cellHeight: cellWidth + 8 + cellHeight: cellWidth + 12 signal openFolderSignal(string folderId, string folderName, int x, int y) signal contentShowFinished() property bool isContentShow: true diff --git a/qml/extensions/FolderContent.qml b/qml/extensions/FolderContent.qml new file mode 100644 index 0000000..8d55fa2 --- /dev/null +++ b/qml/extensions/FolderContent.qml @@ -0,0 +1,193 @@ +/* + * Copyright (C) 2024, 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 . + * + */ + +import QtQuick 2.0 +import QtQml.Models 2.12 +import QtQuick.Layouts 1.12 +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 +Item { + property var folderContentModel + property alias folderSwipeView: folderSwipeView + property bool mouseEnable: false + property int contentMargins + property int labelMagrins + property bool isFullScreen: false + + PageIndicator { + id: pageIndicator + interactive: true + count: folderSwipeView.count + visible: count > 1 + currentIndex: folderSwipeView.currentIndex + anchors.bottom: parent.bottom + anchors.horizontalCenter: parent.horizontalCenter + + delegate: Rectangle { + color: "grey" + width: (index === folderSwipeView.currentIndex )? 20 : 6; height: 6; + radius: width / 2 + opacity: (index === folderSwipeView.currentIndex )? 1 : 0.6 + Behavior on width { + NumberAnimation { duration: 300; easing.type: Easing.InOutCubic } + } + } + } + + SwipeView { + id: folderSwipeView + anchors.fill: parent + anchors.margins: contentMargins + property bool needTurnPage: false + property int contentX: contentItem.contentX + property int startContentX: 0 + property int startIndex: 0 + + function hideFolder() { + // 在非第一页时，执行翻页动画 + if (currentIndex > 0) { + interactive = false; + needTurnPage = true; + pageIndicator.visible = false; + contentItem.highlightFollowsCurrentItem = true; + contentItem.highlightMoveDuration = 300; + contentItem.highlightMoveVelocity = -1; + startContentX = contentX; + startIndex = currentIndex; + currentIndex = 0; + // 在第一页或单页时，全屏文件夹直接隐藏 + } else { + reset(); + } + } + + function reset() { + interactive = true; + root.active = false; + pageIndicator.visible = false; + turnPageFinished(); + } + + // 判断执行翻页结束后，全屏文件夹隐藏 + onContentXChanged: { + // 对比翻页过程的位移 + if (needTurnPage && startContentX - contentX === startIndex * 86) { + needTurnPage = false; + reset(); + } + } + + Repeater { + model: Math.ceil(folderModel.count / 16) + + Item { + id: base + property int currentPage: SwipeView.index + + GridView { + id: folderGridView + cellHeight: isFullScreen ? cellWidth : (cellWidth + 12) + cellWidth: width / 4 + anchors.fill: parent + interactive: false + + model: DelegateModel { + property int maxItemNumPerPage: 16 + filterOnGroup: "folderContent" + groups: DelegateModelGroup { + name: "folderContent" + } + + items.onChanged: { + var groupIndex = groups.length - 1; + if (groups[groupIndex].count !== 0) { + groups[groupIndex].remove(0, groups[groupIndex].count); + } + + for (var i = base.currentPage * maxItemNumPerPage; + i < Math.min((base.currentPage + 1) * maxItemNumPerPage, items.count); i ++) { + items.addGroups(i, 1, "folderContent"); + } + } + + model: folderContentModel + delegate: Item { + width: folderGridView.cellWidth + height: folderGridView.cellHeight + + MouseArea { + hoverEnabled: true + enabled: mouseEnable + anchors.fill: parent + anchors.margins: 2 + acceptedButtons: Qt.LeftButton | Qt.RightButton + + UkuiItems.StyleBackground { + anchors.fill: parent + useStyleTransparency: false + paletteRole: isFullScreen ? Platform.Theme.Light : Platform.Theme.Text + radius: Platform.Theme.maxRadius + alpha: parent.containsPress ? 0.25 : parent.containsMouse ? 0.15 : 0.00 + clip: false + + ColumnLayout { + anchors.fill: parent + anchors.margins: labelMagrins + spacing: (parent.width > 40) ? 4 : 0 + Image { + id: iconImage + source: icon + Layout.minimumHeight: 16 + Layout.minimumWidth: 16 + Layout.fillHeight: true + Layout.preferredWidth: height + Layout.alignment: Qt.AlignHCenter + } + + UkuiItems.StyleText { + text: name + elide: Text.ElideRight + paletteRole: isFullScreen ? Platform.Theme.HighlightedText : Platform.Theme.Text + + Layout.preferredHeight: contentHeight + Layout.fillWidth: true + horizontalAlignment: Text.AlignHCenter + } + } + } + onClicked: { + if (mouse.button === Qt.RightButton) { + menuManager.showMenu(id, MenuInfo.Folder); + return; + } + if (mouse.button === Qt.LeftButton) { + appManager.launchApp(id); + return; + } + } + } + } + } + } + } + } + } +} + diff --git a/qml/extensions/FolderGridView.qml b/qml/extensions/FolderGridView.qml index b7de905..6f5f186 100644 --- a/qml/extensions/FolderGridView.qml +++ b/qml/extensions/FolderGridView.qml @@ -1,10 +1,182 @@ -import QtQuick 2.12 -import QtQml.Models 2.1 +/* + * Copyright (C) 2024, 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 . + * + */ + +import QtQuick 2.0 +import QtQml.Models 2.12 +import QtQuick.Layouts 1.12 import QtQuick.Controls 2.5 import org.ukui.menu.core 1.0 -import org.ukui.menu.extension 1.0 -import AppControls2 1.0 as AppControls2 +import org.ukui.quick.platform 1.0 as Platform +import org.ukui.quick.items 1.0 as UkuiItems +import AppUI 1.0 as AppUI -Item { +Loader { + id: root + active: false + property var folderModel + property string folderName: "" + property int folderX: 0 + property int folderY: 0 + property int viewMaxRow: 0 + property bool isFolderOpened: false + property bool isFullScreen: true + property int margins: isFullScreen? 20 : 0 + property int animationDuration: 300 + signal turnPageFinished() + + function initFolder(id, name, x, y) { + extensionData.folderModel.setFolderId(id); + folderName = name; + folderX = x; + folderY = y; + viewMaxRow = Math.ceil(folderModel.count / 4) > 4 ? 4 : Math.ceil(folderModel.count / 4); + active = true; + isFolderOpened = true; + } + + sourceComponent: folderComponent + + Component { + id: folderComponent + Item { + UkuiItems.StyleBackground { + id: folderIconBase + paletteRole: Platform.Theme.Text + useStyleTransparency: false + property int folderIconSize: 0 + property int iconSpacing: 0 + property int imageX: 0 + property int imageY: 0 + property int gridViewMargin: 8 + + state: isFolderOpened ? "folderOpened" : "folderHidden" + states: [ + State { + name: "folderOpened" + PropertyChanges { + target: folderIconBase + width: 348 + height: viewMaxRow * 100 + radius: Platform.Theme.maxRadius + x: (parent.width - width) / 2 + y: 82 + alpha: 0 + } + PropertyChanges { + target: content + contentMargins: 0 + labelMagrins: 8 + } + PropertyChanges { target: folderNameText; opacity: 1 } + }, + State { + name: "folderHidden" + PropertyChanges { + target: folderIconBase + width: 40 + height: 40 + radius: Platform.Theme.maxRadius + x: root.mapFromGlobal(folderX, 0).x + y: root.mapFromGlobal(0, folderY).y + alpha: 0.1 + } + PropertyChanges { + target: content + contentMargins: 3 + labelMagrins: 0 + } + PropertyChanges { target: folderNameText; opacity: 0 } + } + ] + transitions: [ + Transition { + to: "folderHidden" + SequentialAnimation { + ScriptAction { script: content.mouseEnable = false } + ParallelAnimation { + PropertyAnimation { + duration: animationDuration; easing.type: Easing.InOutCubic + properties: "x, y, width, height, radius, alpha" + } + PropertyAnimation { + duration: animationDuration; easing.type: Easing.OutQuint + properties: "opacity" + } + PropertyAnimation { + duration: animationDuration; easing.type: Easing.OutQuint + properties: "contentMargins, labelMagrins" + } + } + ScriptAction { script: content.folderSwipeView.hideFolder() } + } + }, + Transition { + to: "folderOpened" + SequentialAnimation { + ParallelAnimation { + PropertyAnimation { + duration: animationDuration; easing.type: Easing.InOutCubic + properties: "x, y, width, height, radius, alpha" + } + PropertyAnimation { + duration: animationDuration; easing.type: Easing.InQuint + properties: "opacity" + } + PropertyAnimation { + duration: animationDuration; easing.type: Easing.OutQuint + properties: "contentMargins, labelMagrins" + } + } + ScriptAction { + script: { + content.folderSwipeView.contentItem.highlightMoveDuration = 0; + content.mouseEnable = true + } + } + } + } + ] + FolderContent { + id: content + anchors.fill: parent + folderContentModel: folderModel + isFullScreen: false + } + } + + AppUI.EditText { + id: folderNameText + anchors.bottom: folderIconBase.top + anchors.bottomMargin: 30 + anchors.horizontalCenter: folderIconBase.horizontalCenter + + height: 47; width: folderIconBase.width + textEdited: folderName + textCenterIn: true + isFolder: true + isFullScreen: isFullScreen + textInputSize: 16 + + onTextEditingFinished: text=> { + folderModel.renameFolder(text); + } + } + } + } } diff --git a/qml/extensions/FullScreenFolder.qml b/qml/extensions/FullScreenFolder.qml new file mode 100644 index 0000000..34713f9 --- /dev/null +++ b/qml/extensions/FullScreenFolder.qml @@ -0,0 +1,170 @@ +/* + * 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 . + * + */ + +import QtQuick 2.0 +import QtQml.Models 2.12 +import QtQuick.Layouts 1.12 +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 + +Loader { + id: root + active: false + property var folderModel + property string folderName: "" + property int folderX: 0 + property int folderY: 0 + property int viewMaxRow: 0 + property bool isFolderOpened: false + + property bool isFullScreen: true + property int margins: isFullScreen? 20 : 0 + property int animationDuration: 300 + signal turnPageFinished() + + function initFolder(id, name, x, y) { + extensionData.folderModel.setFolderId(id); + folderName = name; + folderX = x; + folderY = y; + viewMaxRow = Math.ceil(folderModel.count / 4) > 4 ? 4 : Math.ceil(folderModel.count / 4); + active = true; + isFolderOpened = true; + } + + sourceComponent: folderComponent + + Component { + id: folderComponent + Item { + UkuiItems.StyleBackground { + id: folderIconBase + paletteRole: Platform.Theme.Text + useStyleTransparency: false + property int folderIconSize: 0 + property int iconSpacing: 0 + property int imageX: 0 + property int imageY: 0 + property int gridViewMargin: 8 + alpha: 0.25 + + state: isFolderOpened ? "folderOpened" : "folderHidden" + states: [ + State { + name: "folderOpened" + PropertyChanges { + target: folderIconBase + width: isFullScreen ? 720 : 348 + height: isFullScreen ? (viewMaxRow * 170 + margins * 2) : (viewMaxRow * 85 + margins * 2) + radius: Platform.Theme.maxRadius + gridViewMargin: margins + x: isFullScreen ? (parent.width - width) / 2 : 56 + y: isFullScreen ? (parent.height - height) / 2 : 104 + // 内部图标尺寸和布局 + folderIconSize:isFullScreen ? 96 : 48 + iconSpacing: 8 + imageX: isFullScreen ? 37 : 13 + imageY: isFullScreen ? 17 : 8 + } + PropertyChanges { target: folderNameText; opacity: 1 } + }, + State { + name: "folderHidden" + PropertyChanges { + target: folderIconBase + width: 86 + height: 86 + radius: Platform.Theme.maxRadius + gridViewMargin: 8 + x: root.mapFromGlobal(folderX, 0).x + y: root.mapFromGlobal(0, folderY).y + // 内部图标尺寸和布局 + folderIconSize: 16 + iconSpacing: 0 + imageX: 0 + imageY: 0 + } + PropertyChanges { target: folderNameText; opacity: 0 } + } + ] + transitions: [ + Transition { + to: "folderHidden" + SequentialAnimation { + ScriptAction { script: content.mouseEnable = false } + ParallelAnimation { + PropertyAnimation { + duration: animationDuration; easing.type: Easing.InOutCubic + properties: "x, y, width, height, folderIconSize, iconSpacing, radius, imageX, imageY, gridViewMargin" + } + PropertyAnimation { + duration: animationDuration; easing.type: Easing.OutQuint + properties: "opacity" + } + } + ScriptAction { script: content.folderSwipeView.hideFolder() } + } + }, + Transition { + to: "folderOpened" + SequentialAnimation { + ParallelAnimation { + PropertyAnimation { + duration: animationDuration; easing.type: Easing.InOutCubic + properties: "x, y, width, height, folderIconSize, iconSpacing, radius, imageX, imageY, gridViewMargin" + } + PropertyAnimation { + duration: animationDuration; easing.type: Easing.InQuint + properties: "opacity" + } + } + ScriptAction { + script: { + content.folderSwipeView.contentItem.highlightMoveDuration = 0; + content.mouseEnable = true + } + } + } + } + ] + FolderContent { + id: content + anchors.fill: parent + folderContentModel: folderModel + contentMargins: folderIconBase.gridViewMargin + labelMagrins: isFullScreen ? 16 : 8 + } + } + + EditText { + id: folderNameText + anchors.bottom: folderIconBase.top + anchors.bottomMargin: 30 + anchors.horizontalCenter: folderIconBase.horizontalCenter + height: 47; width: folderIconBase.width + textEdited: folderName + textCenterIn: true + isFolder: true + isFullScreen: isFullScreen + } + } + } + +} diff --git a/qml/qml.qrc b/qml/qml.qrc index 0d8ce87..fd2eff0 100644 --- a/qml/qml.qrc +++ b/qml/qml.qrc @@ -24,6 +24,8 @@ AppControls2/LabelItem.qml AppControls2/FolderItem.qml extensions/FavoriteExtension.qml + extensions/FullScreenFolder.qml + extensions/FolderContent.qml extensions/FavoriteDelegate.qml extensions/FavoriteGridView.qml extensions/FolderGridView.qml @@ -33,7 +35,6 @@ AppUI/AppPageContent.qml AppUI/PluginSelectButton.qml AppUI/EditText.qml - AppUI/Folder.qml AppUI/AppPageSearch.qml AppUI/FullScreenAppList.qml AppUI/FullScreenAppItem.qml