Commit b3bcbd6e authored by Sébastien Blin's avatar Sébastien Blin
Browse files

EditableLineEdit: new design

Change-Id: Ieebfacdf8128610ed60cdf73b1b4af6c209dcb36
parent a75f8c23
......@@ -20,16 +20,16 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import Qt5Compat.GraphicalEffects
import net.jami.Constants 1.1
RowLayout {
Item {
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
......@@ -39,58 +39,130 @@ RowLayout {
property alias backgroundColor: lineEdit.backgroundColor
property bool editable: false
property bool hovered: false
property string tooltipText: ""
property int preferredWidth: JamiTheme.preferredFieldWidth
height: lineEdit.height
width: preferredWidth
MaterialToolTip {
parent: lineEdit
visible: tooltipText != "" && hovered
delay: Qt.styleHints.mousePressAndHoldInterval
text: tooltipText
}
HoverHandler {
target : parent
onHoveredChanged: {
root.hovered = hovered
}
cursorShape: Qt.PointingHandCursor
}
RowLayout {
id: row
anchors.centerIn: parent
z: 1
Image {
id: editImg
opacity: editable
Layout.alignment: Qt.AlignVCenter
MaterialLineEdit {
id: lineEdit
layer {
enabled: true
effect: ColorOverlay {
color: root.color
}
}
source: JamiResources.round_edit_24dp_svg
readOnly: !editable
underlined: true
Behavior on opacity {
NumberAnimation {
from: 0
duration: JamiTheme.longFadeDuration
}
}
}
borderColor: root.color
MaterialLineEdit {
id: lineEdit
Layout.alignment: Qt.AlignCenter
Layout.maximumWidth: JamiTheme.preferredFieldWidth
Layout.fillHeight: true
readOnly: !editable
underlined: true
wrapMode: Text.NoWrap
borderColor: root.color
onFocusChanged: function(focus) {
if (!focus && editable) {
Layout.alignment: Qt.AlignCenter
Layout.preferredWidth: root.preferredFieldWidth - btnEdit.width - editImg.width - btnEdit.width
Layout.fillHeight: true
wrapMode: Text.NoWrap
onFocusChanged: function(focus) {
if (!focus && editable) {
editable = !editable
root.editingFinished()
} else if (focus && !editable) {
editable = !editable
lineEdit.forceActiveFocus()
}
}
onAccepted: {
editable = !editable
root.editingFinished()
} else if (focus && !editable) {
editable = !editable
lineEdit.forceActiveFocus()
}
}
onAccepted: {
editable = !editable
root.editingFinished()
}
}
PushButton {
id: btnEdit
PushButton {
id: btnEdit
Layout.alignment: Qt.AlignVCenter
Layout.alignment: Qt.AlignVCenter
opacity: 0.8
imageColor: root.color
normalColor: "transparent"
hoveredColor: JamiTheme.hoveredButtonColor
enabled: editable
opacity: editable ? 0.8 : 0
imageColor: root.color
normalColor: "transparent"
hoveredColor: JamiTheme.hoveredButtonColor
Layout.preferredWidth: preferredSize
Layout.preferredHeight: preferredSize
source: JamiResources.round_close_24dp_svg
source: editable ?
JamiResources.round_close_24dp_svg :
JamiResources.round_edit_24dp_svg
onClicked: {
if (root.editable)
onClicked: {
root.editingFinished()
root.editable = !root.editable
lineEdit.forceActiveFocus()
root.editable = !root.editable
lineEdit.forceActiveFocus()
}
Behavior on opacity {
NumberAnimation {
from: 0
duration: JamiTheme.longFadeDuration
}
}
}
}
Rectangle {
anchors.fill: row
radius: JamiTheme.primaryRadius
visible: root.editable || root.hovered
color: root.color
Rectangle {
visible: parent.visible
anchors {
fill: parent
topMargin: 0
rightMargin: 0
bottomMargin: 3
leftMargin: 0
}
color: root.backgroundColor
}
}
}
\ No newline at end of file
......@@ -60,7 +60,7 @@ Rectangle {
EditableLineEdit {
id: titleLine
Layout.alignment: Qt.AlignCenter
Layout.alignment: Qt.AlignHCenter
Layout.topMargin: JamiTheme.preferredMarginSize
font.pointSize: JamiTheme.titleFontSize
......@@ -85,7 +85,7 @@ Rectangle {
EditableLineEdit {
id: descriptionLine
Layout.alignment: Qt.AlignCenter
Layout.alignment: Qt.AlignHCenter
Layout.topMargin: JamiTheme.preferredMarginSize
Layout.bottomMargin: JamiTheme.preferredMarginSize
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment