diff --git a/qml/AppControls2/FolderItem.qml b/qml/AppControls2/FolderItem.qml
index 869f4be..85a2957 100644
--- a/qml/AppControls2/FolderItem.qml
+++ b/qml/AppControls2/FolderItem.qml
@@ -7,8 +7,9 @@ import org.ukui.menu.core 1.0
MouseArea {
id: control
property bool editStatus: false
+ property bool truncate: false
hoverEnabled: true
- ToolTip.visible: textShow.truncated && textShow.visible && control.containsMouse
+ ToolTip.visible: editStatus && truncate && control.containsMouse
ToolTip.text: name
StyleBackground {
@@ -36,93 +37,94 @@ MouseArea {
Layout.fillWidth: true
Layout.fillHeight: true
- StyleText {
- id: textShow
- anchors.fill: parent
- visible: !control.editStatus
- verticalAlignment: Text.AlignVCenter
- horizontalAlignment: Text.AlignLeft
- elide: Text.ElideRight
- text: name
- }
-
- AppControls2.StyleBackground {
- anchors.fill: parent
- radius: 6
- useStyleTransparent: false
- alpha: textChange.activeFocus ? 0.04 : 0
- paletteRole: Palette.Text
- border.width: 2
- borderAlpha: textChange.activeFocus ? 1 : 0
- borderColor: Palette.Highlight
-
- TextInput {
- id: textChange
- text: name
- visible: control.editStatus
- focus: false
- clip: true
- anchors.left: parent.left
- anchors.leftMargin: 8
- anchors.right: buttonMouseArea.left
- anchors.rightMargin: 8
- anchors.verticalCenter: parent.verticalCenter
- activeFocusOnPress: false
+ Component {
+ id: unEditText
+ StyleText {
+ id: textShow
verticalAlignment: Text.AlignVCenter
- selectByMouse: true
- maximumLength: 14
-
- onEditingFinished: {
- modelManager.getAppModel().renameFolder(id, text);
- control.editStatus = false;
- }
-
- function updateTextInputColor() {
- color = themePalette.paletteColor(Palette.Text);
- selectionColor = themePalette.paletteColor(Palette.Highlight);
- }
-
+ horizontalAlignment: Text.AlignLeft
+ elide: Text.ElideRight
+ text: name
Component.onCompleted: {
- updateTextInputColor();
- themePalette.styleColorChanged.connect(updateTextInputColor);
+ control.truncate = textShow.truncated
}
-
- Component.onDestruction: themePalette.styleColorChanged.disconnect(updateTextInputColor);
}
+ }
- MouseArea {
- id: buttonMouseArea
- hoverEnabled: true
- width: 16; height: width
- anchors.right: parent.right
- anchors.rightMargin: 10
- anchors.verticalCenter: parent.verticalCenter
- visible: textChange.activeFocus
+ Component {
+ id: editText
+ AppControls2.StyleBackground {
+ radius: 6
+ useStyleTransparent: false
+ alpha: textChange.activeFocus ? 0.04 : 0
+ paletteRole: Palette.Text
+ border.width: 2
+ borderAlpha: textChange.activeFocus ? 1 : 0
+ borderColor: Palette.Highlight
- ThemeIcon {
- anchors.centerIn: parent
+ TextInput {
+ id: textChange
+ text: name
+ clip: true
+ anchors.left: parent.left
+ anchors.leftMargin: 8
+ anchors.right: buttonMouseArea.left
+ anchors.rightMargin: 8
+ anchors.verticalCenter: parent.verticalCenter
+ verticalAlignment: Text.AlignVCenter
+ selectByMouse: true
+ maximumLength: 14
+
+ onEditingFinished: {
+ modelManager.getAppModel().renameFolder(id, text);
+ control.editStatus = false;
+ }
+
+ function updateTextInputColor() {
+ color = themePalette.paletteColor(Palette.Text);
+ selectionColor = themePalette.paletteColor(Palette.Highlight);
+ }
+
+ Component.onCompleted: {
+ updateTextInputColor();
+ themePalette.styleColorChanged.connect(updateTextInputColor);
+ forceActiveFocus();
+ }
+
+ Component.onDestruction: themePalette.styleColorChanged.disconnect(updateTextInputColor);
+ }
+
+ MouseArea {
+ id: buttonMouseArea
+ hoverEnabled: true
width: 16; height: width
- source: "image://appicon/edit-clear-symbolic"
+ anchors.right: parent.right
+ anchors.rightMargin: 10
+ anchors.verticalCenter: parent.verticalCenter
+ visible: textChange.activeFocus
+
+ ThemeIcon {
+ anchors.centerIn: parent
+ width: 16; height: width
+ source: "image://appicon/edit-clear-symbolic"
+ }
+
+ onClicked: {
+ textChange.text = name;
+ control.editStatus = false;
+ }
}
- onClicked: {
- textChange.text = name;
- control.editStatus = false;
- }
}
}
+ Loader {
+ id: editLoader
+ anchors.fill: parent
+ sourceComponent: editStatus ? editText : unEditText
+ }
}
}
}
- onEditStatusChanged: {
- if (editStatus) {
- textChange.forceActiveFocus();
- textChange.focus = true;
- }
- else {
- textChange.focus = false
- }
- }
}
diff --git a/qml/AppUI/AppPageContent.qml b/qml/AppUI/AppPageContent.qml
index d805d9b..3239804 100644
--- a/qml/AppUI/AppPageContent.qml
+++ b/qml/AppUI/AppPageContent.qml
@@ -123,108 +123,9 @@ SwipeView {
}
}
- Item {
- id: contain
- property bool editStatus: false
+ EditText {
Layout.fillWidth: true
Layout.fillHeight: true
-
- AppControls2.StyleText {
- id: textShow
- visible: !contain.editStatus
- anchors.fill: parent
- verticalAlignment: Text.AlignVCenter
- horizontalAlignment: Text.AlignLeft
- elide: Text.ElideRight
- text: title
- }
-
- AppControls2.StyleBackground {
- anchors.fill: parent
- radius: 6
- useStyleTransparent: false
- alpha: textEdit.activeFocus ? 0.04 : 0
- paletteRole: Palette.Text
- border.width: 2
- borderAlpha: textEdit.activeFocus ? 1 : 0
- borderColor: Palette.Highlight
-
- TextInput {
- id: textEdit
- visible: contain.editStatus
- clip: true
- focus: false
- anchors.left: parent.left
- anchors.leftMargin: 8
- anchors.right: buttonMouseArea.left
- anchors.rightMargin: 8
- anchors.verticalCenter: parent.verticalCenter
- activeFocusOnPress: false
- verticalAlignment: Text.AlignVCenter
- text: title
- selectByMouse: true
- maximumLength: 14
-
- onEditingFinished: {
- modelManager.getFolderModel().renameFolder(text);
- textShow.text = text;
- contain.editStatus = false;
- }
-
- function updateTextInputColor() {
- color = themePalette.paletteColor(Palette.Text);
- selectionColor = themePalette.paletteColor(Palette.Highlight);
- }
-
- Component.onCompleted: {
- updateTextInputColor();
- themePalette.styleColorChanged.connect(updateTextInputColor);
- }
-
- Component.onDestruction: themePalette.styleColorChanged.disconnect(updateTextInputColor);
-
- }
-
- MouseArea {
- id: textArea
- anchors.fill: textEdit
- onDoubleClicked: {
- contain.editStatus = true;
- }
- }
-
- MouseArea {
- id: buttonMouseArea
- hoverEnabled: true
- width: 16; height: width
- anchors.right: parent.right
- anchors.rightMargin: 10
- anchors.verticalCenter: parent.verticalCenter
- visible: textEdit.activeFocus
-
- ThemeIcon {
- anchors.centerIn: parent
- width: 16; height: width
- source: "image://appicon/edit-clear-symbolic"
- }
-
- onClicked: {
- textEdit.text = title;
- contain.editStatus = false;
- }
- }
- }
- onEditStatusChanged: {
- if (editStatus) {
- textEdit.z = 2;
- textEdit.forceActiveFocus();
- textEdit.focus = true;
- }
- else {
- textEdit.z = 0;
- textEdit.focus = false;
- }
- }
}
}
}
diff --git a/qml/AppUI/EditText.qml b/qml/AppUI/EditText.qml
new file mode 100644
index 0000000..d1aa022
--- /dev/null
+++ b/qml/AppUI/EditText.qml
@@ -0,0 +1,125 @@
+/*
+ * 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.12
+import QtQuick.Layouts 1.12
+import QtQuick.Controls 2.5
+import AppControls2 1.0 as AppControls2
+import org.ukui.menu.core 1.0
+
+Item {
+ id: contain
+ property bool textCenterIn: false
+ property bool editStatus: false
+ property string textEdited: title
+
+ Component {
+ id: unEditText
+ AppControls2.StyleText {
+ id: textShow
+ verticalAlignment: Text.AlignVCenter
+ horizontalAlignment: contain.textCenterIn ? Text.AlignHCenter : Text.AlignLeft
+ elide: Text.ElideRight
+ text: contain.textEdited
+
+ MouseArea {
+ id: textArea
+ anchors.fill: parent
+ onDoubleClicked: {
+ contain.editStatus = true;
+ }
+ }
+ }
+
+ }
+
+ Component {
+ id: editText
+ AppControls2.StyleBackground {
+ radius: 6
+ useStyleTransparent: false
+ alpha: textEdit.activeFocus ? 0.04 : 0
+ paletteRole: Palette.Text
+ border.width: 2
+ borderAlpha: textEdit.activeFocus ? 1 : 0
+ borderColor: Palette.Highlight
+
+ TextInput {
+ id: textEdit
+ clip: true
+ anchors.left: parent.left
+ anchors.leftMargin: 8
+ anchors.right: buttonMouseArea.left
+ anchors.rightMargin: 8
+ anchors.verticalCenter: parent.verticalCenter
+ verticalAlignment: Text.AlignVCenter
+ horizontalAlignment: contain.textCenterIn ? Text.AlignHCenter : Text.AlignLeft
+ text: contain.textEdited
+ selectByMouse: true
+ maximumLength: 14
+
+ onEditingFinished: {
+ modelManager.getFolderModel().renameFolder(text);
+ contain.textEdited = text;
+ contain.editStatus = false;
+ }
+
+ function updateTextInputColor() {
+ color = themePalette.paletteColor(Palette.Text);
+ selectionColor = themePalette.paletteColor(Palette.Highlight);
+ }
+
+ Component.onCompleted: {
+ updateTextInputColor();
+ themePalette.styleColorChanged.connect(updateTextInputColor);
+ forceActiveFocus();
+ }
+
+ Component.onDestruction: themePalette.styleColorChanged.disconnect(updateTextInputColor);
+
+ }
+
+ MouseArea {
+ id: buttonMouseArea
+ hoverEnabled: true
+ width: 16; height: width
+ anchors.right: parent.right
+ anchors.rightMargin: 10
+ anchors.verticalCenter: parent.verticalCenter
+ visible: textEdit.activeFocus
+
+ ThemeIcon {
+ anchors.centerIn: parent
+ width: 16; height: width
+ source: "image://appicon/edit-clear-symbolic"
+ }
+
+ onClicked: {
+ textEdit.text = title;
+ contain.editStatus = false;
+ }
+ }
+ }
+ }
+
+ Loader {
+ id: editLoader
+ anchors.fill: parent
+ sourceComponent: contain.editStatus ? editText : unEditText
+ }
+}
diff --git a/qml/qml.qrc b/qml/qml.qrc
index 653990c..fe98c4a 100644
--- a/qml/qml.qrc
+++ b/qml/qml.qrc
@@ -33,5 +33,6 @@
AppUI/SelectionPage.qml
AppUI/AppPageContent.qml
AppUI/PluginSelectMenu.qml
+ AppUI/EditText.qml