feat(extension):优化、拆分应用组UI显示
This commit is contained in:
qiqi49
hewenfei
parent
fbc3f02c10
commit
55b4901ded
|
|
@ -32,6 +32,7 @@ Item {
|
||||||
property bool isFolder: false
|
property bool isFolder: false
|
||||||
property real textInputSize: 14
|
property real textInputSize: 14
|
||||||
|
|
||||||
|
signal textEditingFinished(string text)
|
||||||
Component {
|
Component {
|
||||||
id: unEditText
|
id: unEditText
|
||||||
UkuiItems.StyleText {
|
UkuiItems.StyleText {
|
||||||
|
|
@ -41,12 +42,12 @@ Item {
|
||||||
elide: Text.ElideRight
|
elide: Text.ElideRight
|
||||||
text: contain.textEdited
|
text: contain.textEdited
|
||||||
paletteRole: isFullScreen ? Platform.Theme.HighlightedText : Platform.Theme.Text
|
paletteRole: isFullScreen ? Platform.Theme.HighlightedText : Platform.Theme.Text
|
||||||
font.bold: !isFolder
|
font.bold: isFolder
|
||||||
// AppControls2 StyleText
|
// AppControls2 StyleText
|
||||||
property real textUltra: 2*systemFontSize
|
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 {
|
MouseArea {
|
||||||
id: textArea
|
id: textArea
|
||||||
|
|
@ -87,13 +88,14 @@ Item {
|
||||||
font.pointSize: contain.textInputSize
|
font.pointSize: contain.textInputSize
|
||||||
|
|
||||||
onEditingFinished: {
|
onEditingFinished: {
|
||||||
modelManager.getFolderModel().renameFolder(text);
|
// modelManager.getFolderModel().renameFolder(text);
|
||||||
contain.textEdited = text;
|
contain.textEdited = text;
|
||||||
contain.editStatus = false;
|
contain.editStatus = false;
|
||||||
|
textEditingFinished(text);
|
||||||
}
|
}
|
||||||
|
|
||||||
function updateTextInputColor() {
|
function updateTextInputColor() {
|
||||||
color = isFullScreenFolder ? Platform.Theme.highlightedText() : Platform.Theme.text();
|
color = isFullScreen ? Platform.Theme.highlightedText() : Platform.Theme.text();
|
||||||
selectionColor = Platform.Theme.highlight();
|
selectionColor = Platform.Theme.highlight();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -120,7 +122,7 @@ Item {
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
width: 16; height: width
|
width: 16; height: width
|
||||||
source: "image://theme/edit-clear-symbolic"
|
source: "image://theme/edit-clear-symbolic"
|
||||||
mode: isFullScreenFolder ? UkuiItems.Icon.Highlight : UkuiItems.Icon.AutoHighlight
|
mode: isFullScreen ? UkuiItems.Icon.Highlight : UkuiItems.Icon.AutoHighlight
|
||||||
}
|
}
|
||||||
|
|
||||||
onClicked: {
|
onClicked: {
|
||||||
|
|
|
||||||
|
|
@ -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 <https://www.gnu.org/licenses/>.
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
|
|
||||||
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
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
@ -16,4 +16,4 @@ FullScreenFooter 1.0 FullScreenFooter.qml
|
||||||
FullScreenAppList 1.0 FullScreenAppList.qml
|
FullScreenAppList 1.0 FullScreenAppList.qml
|
||||||
FullScreenAppItem 1.0 FullScreenAppItem.qml
|
FullScreenAppItem 1.0 FullScreenAppItem.qml
|
||||||
AppLabelPage 1.0 AppLabelPage.qml
|
AppLabelPage 1.0 AppLabelPage.qml
|
||||||
Folder 1.0 Folder.qml
|
EditText 1.0 EditText.qml
|
||||||
|
|
|
||||||
|
|
@ -161,15 +161,14 @@ UkuiItems.StyleBackground {
|
||||||
rows: 2; columns: 2
|
rows: 2; columns: 2
|
||||||
spacing: 2; padding: 2
|
spacing: 2; padding: 2
|
||||||
icons: icon
|
icons: icon
|
||||||
radius: 4; alpha: 0.25
|
radius: 4; alpha: 0.10
|
||||||
}
|
}
|
||||||
|
|
||||||
function itemClicked(mouseButton) {
|
function itemClicked(mouseButton) {
|
||||||
if (mouseButton === Qt.RightButton) {
|
if (mouseButton === Qt.RightButton) {
|
||||||
visualModel.model.openMenu(index);
|
visualModel.model.openMenu(index);
|
||||||
} else {
|
} else {
|
||||||
var x = mapToGlobal(0,0).x;
|
var x = mapToGlobal(folderIcon.x, folderIcon.y).x;
|
||||||
var y = mapToGlobal(0,0).y
|
var y = mapToGlobal(folderIcon.x, folderIcon.y).y
|
||||||
openFolderSignal(id, name, x, y);
|
openFolderSignal(id, name, x, y);
|
||||||
// 执行隐藏动画，并且当前图标消失且鼠标区域不可用
|
// 执行隐藏动画，并且当前图标消失且鼠标区域不可用
|
||||||
favoriteView.isContentShow = false;
|
favoriteView.isContentShow = false;
|
||||||
|
|
|
||||||
|
|
@ -70,7 +70,7 @@ UkuiMenuExtension {
|
||||||
z: 1
|
z: 1
|
||||||
}
|
}
|
||||||
|
|
||||||
AppUI.Folder {
|
FolderGridView {
|
||||||
id: folderLoader
|
id: folderLoader
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -29,7 +29,7 @@ import AppControls2 1.0 as AppControls2
|
||||||
GridView {
|
GridView {
|
||||||
id: favoriteView
|
id: favoriteView
|
||||||
cellWidth: width / column
|
cellWidth: width / column
|
||||||
cellHeight: cellWidth + 8
|
cellHeight: cellWidth + 12
|
||||||
signal openFolderSignal(string folderId, string folderName, int x, int y)
|
signal openFolderSignal(string folderId, string folderName, int x, int y)
|
||||||
signal contentShowFinished()
|
signal contentShowFinished()
|
||||||
property bool isContentShow: true
|
property bool isContentShow: true
|
||||||
|
|
|
||||||
|
|
@ -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 <https://www.gnu.org/licenses/>.
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
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;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
@ -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 <https://www.gnu.org/licenses/>.
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
import QtQuick 2.0
|
||||||
|
import QtQml.Models 2.12
|
||||||
|
import QtQuick.Layouts 1.12
|
||||||
import QtQuick.Controls 2.5
|
import QtQuick.Controls 2.5
|
||||||
import org.ukui.menu.core 1.0
|
import org.ukui.menu.core 1.0
|
||||||
import org.ukui.menu.extension 1.0
|
import org.ukui.quick.platform 1.0 as Platform
|
||||||
import AppControls2 1.0 as AppControls2
|
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);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -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 <https://www.gnu.org/licenses/>.
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
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
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
@ -24,6 +24,8 @@
|
||||||
<file>AppControls2/LabelItem.qml</file>
|
<file>AppControls2/LabelItem.qml</file>
|
||||||
<file>AppControls2/FolderItem.qml</file>
|
<file>AppControls2/FolderItem.qml</file>
|
||||||
<file>extensions/FavoriteExtension.qml</file>
|
<file>extensions/FavoriteExtension.qml</file>
|
||||||
|
<file>extensions/FullScreenFolder.qml</file>
|
||||||
|
<file>extensions/FolderContent.qml</file>
|
||||||
<file>extensions/FavoriteDelegate.qml</file>
|
<file>extensions/FavoriteDelegate.qml</file>
|
||||||
<file>extensions/FavoriteGridView.qml</file>
|
<file>extensions/FavoriteGridView.qml</file>
|
||||||
<file>extensions/FolderGridView.qml</file>
|
<file>extensions/FolderGridView.qml</file>
|
||||||
|
|
@ -33,7 +35,6 @@
|
||||||
<file>AppUI/AppPageContent.qml</file>
|
<file>AppUI/AppPageContent.qml</file>
|
||||||
<file>AppUI/PluginSelectButton.qml</file>
|
<file>AppUI/PluginSelectButton.qml</file>
|
||||||
<file>AppUI/EditText.qml</file>
|
<file>AppUI/EditText.qml</file>
|
||||||
<file>AppUI/Folder.qml</file>
|
|
||||||
<file>AppUI/AppPageSearch.qml</file>
|
<file>AppUI/AppPageSearch.qml</file>
|
||||||
<file>AppUI/FullScreenAppList.qml</file>
|
<file>AppUI/FullScreenAppList.qml</file>
|
||||||
<file>AppUI/FullScreenAppItem.qml</file>
|
<file>AppUI/FullScreenAppItem.qml</file>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue