mirror of
https://git.jami.net/savoirfairelinux/jami-client-qt.git
synced 2025-08-04 06:45:45 +02:00
misc: introduces EditableLineEdit
GitLab: #685 Change-Id: I6c284150b18ea7a866b063411b25e50f3afae559
This commit is contained in:
parent
3f18e6edbc
commit
55daffe328
7 changed files with 165 additions and 18 deletions
1
qml.qrc
1
qml.qrc
|
@ -10,6 +10,7 @@
|
|||
<file>src/commoncomponents/SettingParaCombobox.qml</file>
|
||||
<file>src/commoncomponents/PreferenceItemDelegate.qml</file>
|
||||
<file>src/commoncomponents/PasswordDialog.qml</file>
|
||||
<file>src/commoncomponents/EditableLineEdit.qml</file>
|
||||
<file>src/commoncomponents/MaterialLineEdit.qml</file>
|
||||
<file>src/commoncomponents/PhotoboothView.qml</file>
|
||||
<file>src/commoncomponents/JamiListView.qml</file>
|
||||
|
|
92
src/commoncomponents/EditableLineEdit.qml
Normal file
92
src/commoncomponents/EditableLineEdit.qml
Normal file
|
@ -0,0 +1,92 @@
|
|||
/*
|
||||
* Copyright (C) 2021 by Savoir-faire Linux
|
||||
* Author: Sébastien blin <sebastien.blin@savoirfairelinux.com>
|
||||
* Author: Mingrui Zhang <mingrui.zhang@savoirfairelinux.com>
|
||||
*
|
||||
* 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
|
||||
import QtQuick.Controls
|
||||
import QtQuick.Layouts
|
||||
|
||||
import net.jami.Constants 1.1
|
||||
|
||||
RowLayout {
|
||||
id: root
|
||||
|
||||
signal editingFinished
|
||||
|
||||
property alias text: lineEdit.text
|
||||
property alias tooltipText: btnEdit.toolTipText
|
||||
property alias color: lineEdit.color
|
||||
property alias verticalAlignment: lineEdit.verticalAlignment
|
||||
property alias horizontalAlignment: lineEdit.horizontalAlignment
|
||||
property alias font: lineEdit.font
|
||||
property alias placeholderText: lineEdit.placeholderText
|
||||
property alias placeholderTextColor: lineEdit.placeholderTextColor
|
||||
property alias backgroundColor: lineEdit.backgroundColor
|
||||
|
||||
property bool editable: false
|
||||
|
||||
MaterialLineEdit {
|
||||
id: lineEdit
|
||||
|
||||
readOnly: !editable
|
||||
underlined: true
|
||||
|
||||
borderColor: JamiTheme.textColor
|
||||
|
||||
Layout.alignment: Qt.AlignCenter
|
||||
Layout.maximumWidth: JamiTheme.preferredFieldWidth
|
||||
Layout.fillHeight: true
|
||||
|
||||
wrapMode: Text.NoWrap
|
||||
|
||||
onFocusChanged: function(focus) {
|
||||
if (!focus && editable) {
|
||||
editable = !editable
|
||||
root.editingFinished()
|
||||
} else if (focus && !editable) {
|
||||
editable = !editable
|
||||
lineEdit.forceActiveFocus()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
PushButton {
|
||||
id: btnEdit
|
||||
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
|
||||
opacity: 0.8
|
||||
imageColor: JamiTheme.textColor
|
||||
normalColor: "transparent"
|
||||
hoveredColor: JamiTheme.hoveredButtonColor
|
||||
|
||||
Layout.preferredWidth: preferredSize
|
||||
Layout.preferredHeight: preferredSize
|
||||
|
||||
source: editable ?
|
||||
JamiResources.round_close_24dp_svg :
|
||||
JamiResources.round_edit_24dp_svg
|
||||
|
||||
onClicked: {
|
||||
if (root.editable)
|
||||
root.editingFinished()
|
||||
root.editable = !root.editable
|
||||
lineEdit.forceActiveFocus()
|
||||
}
|
||||
}
|
||||
}
|
|
@ -32,6 +32,7 @@ TextField {
|
|||
property var borderColor: JamiTheme.greyBorderColor
|
||||
|
||||
property bool loseFocusWhenEnterPressed: false
|
||||
property bool underlined: false
|
||||
|
||||
padding: JamiTheme.materialLineEditPadding
|
||||
horizontalAlignment: Text.AlignLeft
|
||||
|
@ -57,11 +58,29 @@ TextField {
|
|||
}
|
||||
|
||||
background: Rectangle {
|
||||
anchors.fill: parent
|
||||
|
||||
anchors.fill: root
|
||||
radius: JamiTheme.primaryRadius
|
||||
border.color: readOnly? "transparent" : borderColor
|
||||
color: readOnly? "transparent" : backgroundColor
|
||||
|
||||
border.color: readOnly || underlined? "transparent" : borderColor
|
||||
color: {
|
||||
if (readOnly)
|
||||
return "transparent"
|
||||
if (underlined)
|
||||
return borderColor
|
||||
return backgroundColor
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
visible: !readOnly && underlined
|
||||
anchors {
|
||||
fill: parent
|
||||
topMargin: 0
|
||||
rightMargin: 0
|
||||
bottomMargin: 3
|
||||
leftMargin: 0
|
||||
}
|
||||
color: backgroundColor
|
||||
}
|
||||
}
|
||||
|
||||
onReleased: function (event) {
|
||||
|
|
|
@ -615,6 +615,8 @@ Item {
|
|||
property string about: qsTr("About")
|
||||
property string members: qsTr("Members")
|
||||
property string documents: qsTr("Documents")
|
||||
property string editTitle: qsTr("Edit title")
|
||||
property string editDescription: qsTr("Edit description")
|
||||
|
||||
// NewSwarmPage
|
||||
|
||||
|
|
|
@ -165,6 +165,7 @@ Item {
|
|||
property color chatviewBgColor: darkTheme ? bgDarkMode_ : whiteColor
|
||||
property color bgInvitationRectColor: darkTheme ? "#222222" : whiteColor
|
||||
property color placeholderTextColor: darkTheme ? "#7a7a7a" : "#767676"
|
||||
property color placeholderTextColorWhite: "#cccccc"
|
||||
property color inviteHoverColor: darkTheme ? blackColor : whiteColor
|
||||
property color chatviewButtonColor: darkTheme ? whiteColor : blackColor
|
||||
property color bgTextInput: darkTheme ? "#060608" : whiteColor
|
||||
|
|
|
@ -34,17 +34,46 @@ Rectangle {
|
|||
|
||||
signal createSwarmClicked
|
||||
|
||||
RowLayout {
|
||||
ColumnLayout {
|
||||
id: mainLayout
|
||||
|
||||
anchors.fill: parent
|
||||
anchors.centerIn: root
|
||||
|
||||
EditableLineEdit {
|
||||
Layout.alignment: Qt.AlignCenter
|
||||
Layout.topMargin: JamiTheme.preferredMarginSize
|
||||
|
||||
font.pointSize: JamiTheme.titleFontSize
|
||||
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
|
||||
placeholderText: JamiStrings.editTitle
|
||||
tooltipText: JamiStrings.editTitle
|
||||
backgroundColor: root.color
|
||||
color: "white"
|
||||
}
|
||||
|
||||
EditableLineEdit {
|
||||
Layout.alignment: Qt.AlignCenter
|
||||
Layout.topMargin: JamiTheme.preferredMarginSize
|
||||
|
||||
font.pointSize: JamiTheme.titleFontSize
|
||||
|
||||
placeholderText: JamiStrings.editDescription
|
||||
tooltipText: JamiStrings.editDescription
|
||||
backgroundColor: root.color
|
||||
color: "white"
|
||||
}
|
||||
|
||||
MaterialButton {
|
||||
id: btnCreateSwarm
|
||||
|
||||
Layout.alignment: Qt.AlignCenter
|
||||
Layout.topMargin: JamiTheme.preferredMarginSize
|
||||
|
||||
preferredWidth: JamiTheme.aboutButtonPreferredWidth
|
||||
|
||||
Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
|
||||
color: JamiTheme.buttonTintedBlue
|
||||
hoveredColor: JamiTheme.buttonTintedBlueHovered
|
||||
pressedColor: JamiTheme.buttonTintedBluePressed
|
||||
|
|
|
@ -48,41 +48,44 @@ Rectangle {
|
|||
showPresenceIndicator: false
|
||||
}
|
||||
|
||||
MaterialLineEdit {
|
||||
EditableLineEdit {
|
||||
id: titleLine
|
||||
Layout.alignment: Qt.AlignCenter
|
||||
Layout.topMargin: JamiTheme.preferredMarginSize
|
||||
|
||||
Layout.preferredWidth: root.width
|
||||
|
||||
font.pointSize: JamiTheme.titleFontSize
|
||||
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
|
||||
text: CurrentConversation.title
|
||||
placeholderText: JamiStrings.editTitle
|
||||
placeholderTextColor: JamiTheme.placeholderTextColorWhite
|
||||
tooltipText: JamiStrings.editTitle
|
||||
backgroundColor: root.color
|
||||
color: "white"
|
||||
|
||||
onEditingFinished: {
|
||||
ConversationsAdapter.updateConversationTitle(LRCInstance.selectedConvUid, this.text)
|
||||
ConversationsAdapter.updateConversationTitle(LRCInstance.selectedConvUid, titleLine.text)
|
||||
}
|
||||
}
|
||||
|
||||
MaterialLineEdit {
|
||||
EditableLineEdit {
|
||||
id: descriptionLine
|
||||
Layout.alignment: Qt.AlignCenter
|
||||
Layout.topMargin: JamiTheme.preferredMarginSize
|
||||
|
||||
Layout.preferredWidth: root.width
|
||||
|
||||
font.pointSize: JamiTheme.titleFontSize
|
||||
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
|
||||
text: CurrentConversation.description
|
||||
placeholderText: JamiStrings.editDescription
|
||||
placeholderTextColor: JamiTheme.placeholderTextColorWhite
|
||||
tooltipText: JamiStrings.editDescription
|
||||
backgroundColor: root.color
|
||||
color: "white"
|
||||
|
||||
onEditingFinished: {
|
||||
ConversationsAdapter.updateConversationDescription(LRCInstance.selectedConvUid, this.text)
|
||||
ConversationsAdapter.updateConversationDescription(LRCInstance.selectedConvUid, descriptionLine.text)
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Add table
Reference in a new issue