Refactor to add message text area into a flickable

This commit is contained in:
Angela Mazzurco 2017-06-10 16:02:09 +02:00
parent e2d430a82a
commit 12fef4bf8b
2 changed files with 38 additions and 24 deletions

View File

@ -117,6 +117,7 @@ Item
RowLayout { RowLayout {
id: msgComposer id: msgComposer
property var styles: StyleChat.inferiorPanel.msgComposer
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
anchors.left: attachButton.right anchors.left: attachButton.right
@ -126,36 +127,49 @@ Item
(attachButton.width + attachButton.anchors.margins) - (attachButton.width + attachButton.anchors.margins) -
(emojiButton.width + emojiButton.anchors.margins) (emojiButton.width + emojiButton.anchors.margins)
height: (flickable.contentHeight < styles.maxHeight)? flickable.contentHeight : styles.maxHeight
TextArea Flickable {
{ id: flickable
property var styles: StyleChat.inferiorPanel.msgComposer anchors.fill: parent
id: msgField flickableDirection: Flickable.VerticalFlick
height:
(contentHeight > font.pixelSize)?
contentHeight +font.pixelSize : parent.styles.height
width: parent.width width: parent.width
Layout.maximumHeight: chatView.height / styles.maxHeight contentWidth: msgField.width
contentHeight: msgField.height
contentY: contentHeight - height
placeholderText: styles.placeHolder ScrollBar.vertical: ScrollBar {}
background: styles.background
wrapMode: TextEdit.Wrap clip: true
onTextChanged: { TextArea
if (msgComposer.length == 0) {
{ property var styles: StyleChat.inferiorPanel.msgComposer
sendButton.state = "" id: msgField
}
else if (msgComposer.length > 0) height: contentHeight + font.pixelSize
{
sendButton.state = "SENDBTN" width: parent.width
placeholderText: styles.placeHolder
background: styles.background
wrapMode: TextEdit.Wrap
onTextChanged: {
if (msgField.length == 0)
{
sendButton.state = ""
}
else if (msgField.length > 0)
{
sendButton.state = "SENDBTN"
}
} }
} }
} }
} }
@ -199,9 +213,9 @@ Item
onClicked: onClicked:
{ {
if (sendButton.state == "SENDBTN" ) { if (sendButton.state == "SENDBTN" ) {
var jsonData = {"chat_id":chatView.chatId, "msg":msgComposer.text} var jsonData = {"chat_id":chatView.chatId, "msg":msgField.text}
rsApi.request( "/chat/send_message", JSON.stringify(jsonData), rsApi.request( "/chat/send_message", JSON.stringify(jsonData),
function(par) { msgComposer.text = ""; } ) function(par) { msgField.text = ""; } )
} }
} }

View File

@ -34,7 +34,7 @@ QtObject {
property QtObject msgComposer: QtObject{ property QtObject msgComposer: QtObject{
readonly property string placeHolder: "Send message..." readonly property string placeHolder: "Send message..."
readonly property int maxHeight: 2 // chatListView/maxHeight readonly property int maxHeight: 180
property QtObject background: Rectangle { property QtObject background: Rectangle {
color: "transparent" color: "transparent"