fix: fix layout of input buttons when some are hidden

This commit is contained in:
Jonathan Rainville 2020-08-18 11:08:33 -04:00 committed by Iuri Matias
parent 474f68cf8a
commit d35c971c8b
2 changed files with 18 additions and 10 deletions

View File

@ -15,15 +15,17 @@ Row {
anchors.right: parent.right anchors.right: parent.right
anchors.rightMargin: Style.current.padding anchors.rightMargin: Style.current.padding
spacing: Style.current.padding / 2 spacing: 0
width: childrenRect.width // ChildrenRect doesn't work with the width being able to change
width: chatSendBtn.width + emojiIconButton.width +
stickerIconButton.width + imageIconButton.width + commandIconButton.width
Button { Button {
id: chatSendBtn id: chatSendBtn
visible: txtData.length > 0 || chatColumn.isImage visible: txtData.length > 0 || chatColumn.isImage
width: 30 width: this.visible ? 30 : 0
height: 30 height: this.width
text: "" text: ""
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
onClicked: { onClicked: {
@ -43,7 +45,7 @@ Row {
} }
ChatInputButton { ChatInputButton {
id: emojiIconContainer id: emojiIconButton
source: "../../../img/emojiBtn.svg" source: "../../../img/emojiBtn.svg"
opened: emojiPopup.opened opened: emojiPopup.opened
close: function () { close: function () {
@ -55,7 +57,7 @@ Row {
} }
ChatInputButton { ChatInputButton {
id: stickerIconContainer id: stickerIconButton
visible: !chatColumn.isExtendedInput && txtData.length == 0 visible: !chatColumn.isExtendedInput && txtData.length == 0
source: "../../../img/stickers_icon.svg" source: "../../../img/stickers_icon.svg"
opened: stickersPopup.opened opened: stickersPopup.opened
@ -68,7 +70,7 @@ Row {
} }
ChatInputButton { ChatInputButton {
id: imageIconContainer id: imageIconButton
visible: !chatColumn.isExtendedInput && (chatsModel.activeChannel.chatType === Constants.chatTypePrivateGroupChat || chatsModel.activeChannel.chatType === Constants.chatTypeOneToOne) visible: !chatColumn.isExtendedInput && (chatsModel.activeChannel.chatType === Constants.chatTypePrivateGroupChat || chatsModel.activeChannel.chatType === Constants.chatTypeOneToOne)
source: "../../../img/images_icon.svg" source: "../../../img/images_icon.svg"
opened: imageDialog.visible opened: imageDialog.visible

View File

@ -5,15 +5,15 @@ import "../../../../../imports"
import "../../../../../shared" import "../../../../../shared"
Rectangle { Rectangle {
property url source: "" property url source: "../../../../img/emojiBtn.svg"
property bool hovered: false property bool hovered: false
property bool opened: false property bool opened: false
property var close: function () {} property var close: function () {}
property var open: function () {} property var open: function () {}
id: root id: root
width: buttonIcon.width + chatButtonsContainer.iconPadding * 2 width: this.visible ? buttonIcon.width + 4 + chatButtonsContainer.iconPadding * 2 : 0
height: buttonIcon.height + chatButtonsContainer.iconPadding * 2 height: this.visible ? buttonIcon.height + chatButtonsContainer.iconPadding * 2 : 0
radius: Style.current.radius radius: Style.current.radius
color: hovered ? Style.current.secondaryBackground : Style.current.transparent color: hovered ? Style.current.secondaryBackground : Style.current.transparent
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
@ -52,3 +52,9 @@ Rectangle {
} }
} }
} }
/*##^##
Designer {
D{i:0;formeditorZoom:1.5}
}
##^##*/