status-im/status-desktop
2
0
Fork 0
mirror of https://github.com/status-im/status-desktop.git synced 2025-02-23 03:58:49 +00:00
Code Issues Projects Releases Wiki Activity

feat: show your messages right aligned

Browse Source 
The messages you send will now be aligned right.
Also fixes the issue of the chats being visible under the chat input
This commit is contained in:
Jonathan Rainville 2020-05-15 11:39:42 -04:00 committed by Iuri Matias
parent 531383c207
commit acf0dcbf7a
1 changed files with 38 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
ui/app/AppLayouts/ChatLayout.qml
View File

@ -251,10 +251,12 @@ SplitView {
id: chatImage id: chatImage
width: 30 width: 30
height: 30 height: 30
anchors.left: parent.left anchors.left: !isCurrentUser ? parent.left : undefined
anchors.leftMargin: 16 anchors.leftMargin: !isCurrentUser ? Theme.padding : 0
anchors.right: !isCurrentUser ? undefined : parent.right
anchors.rightMargin: !isCurrentUser ? 0 : Theme.padding
anchors.top: parent.top anchors.top: parent.top
anchors.topMargin: 16 anchors.topMargin: Theme.padding
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
source: "../img/placeholder-profile.png" source: "../img/placeholder-profile.png"
} }
@ -264,8 +266,10 @@ SplitView {
text: username text: username
anchors.top: parent.top anchors.top: parent.top
anchors.topMargin: 22 anchors.topMargin: 22
anchors.left: chatImage.right anchors.left: !isCurrentUser ? chatImage.right : undefined
anchors.leftMargin: 16 anchors.leftMargin: Theme.padding
anchors.right: !isCurrentUser ? undefined : chatImage.left
anchors.rightMargin: !isCurrentUser ? 0 : Theme.padding
font.bold: true font.bold: true
font.pixelSize: 14 font.pixelSize: 14
readOnly: true readOnly: true
@ -276,14 +280,15 @@ SplitView {
TextEdit { TextEdit {
id: chatText id: chatText
text: message text: message
horizontalAlignment: !isCurrentUser ? Text.AlignLeft : Text.AlignRight
font.family: "Inter" font.family: "Inter"
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
anchors.right: parent.right anchors.right: !isCurrentUser ? parent.right : chatName.right
anchors.rightMargin: 60 anchors.rightMargin: !isCurrentUser ? 60 : 0
anchors.left: chatName.left anchors.left: !isCurrentUser ? chatName.left : parent.left
anchors.leftMargin: 0 anchors.leftMargin: !isCurrentUser ? 0 : 60
anchors.top: chatName.bottom anchors.top: chatName.bottom
anchors.topMargin: 16 anchors.topMargin: Theme.padding
font.pixelSize: 14 font.pixelSize: 14
readOnly: true readOnly: true
selectByMouse: true selectByMouse: true
@ -295,10 +300,12 @@ SplitView {
color: Theme.darkGrey color: Theme.darkGrey
font.family: "Inter" font.family: "Inter"
text: timestamp text: timestamp
anchors.bottom: parent.bottom anchors.top: chatText.bottom
anchors.bottomMargin: 16 anchors.bottomMargin: Theme.padding
anchors.right: parent.right anchors.right: !isCurrentUser ? parent.right : undefined
anchors.rightMargin: 16 anchors.rightMargin: !isCurrentUser ? Theme.padding : 0
anchors.left: !isCurrentUser ? undefined : parent.left
anchors.leftMargin: !isCurrentUser ? 0 : Theme.padding
font.pixelSize: 10 font.pixelSize: 10
readOnly: true readOnly: true
selectByMouse: true selectByMouse: true
@ -306,58 +313,60 @@ SplitView {
} }
} }
// ScrollView {
// id: chatScrollView
// anchors.fill: parent
// Layout.fillWidth: true
// Layout.fillHeight: true
ListView { ListView {
id: chatLogView id: chatLogView
// anchors.topMargin: 24
anchors.fill: parent anchors.fill: parent
// model: chatLogModel // model: chatLogModel
Layout.fillWidth: true Layout.fillWidth: true
Layout.fillHeight: true Layout.fillHeight: true
model: ListModel { model: ListModel {
ListElement { ListElement {
username: "Bill Smith" username: "You"
message: "First Message - I’m generally against putting too many rules on social interaction because it makes interaction anything but social, but technical specifics on how to get on board or participate in a team are I think generally useful, especially if they prevent maintainers from pasting the same response to every PR / issue." message: "First Message - I’m generally against putting too many rules on social interaction because it makes interaction anything but social, but technical specifics on how to get on board or participate in a team are I think generally useful, especially if they prevent maintainers from pasting the same response to every PR / issue."
timestamp: "7:30 AM" timestamp: "7:30 AM"
isCurrentUser: true
} }
ListElement { ListElement {
username: qsTr("Slushy Welltodo Woodborer") username: qsTr("Slushy Welltodo Woodborer")
message: "Lorem ipsum ion anything but social, but technical specifics on how to get on board or participate in a team are I think generally useful, especially if they prevent maintainers from pasting the same response to every PR / issue." message: "Lorem ipsum ion anything but social, but technical specifics on how to get on board or participate in a team are I think generally useful, especially if they prevent maintainers from pasting the same response to every PR / issue."
timestamp: "7:31 AM" timestamp: "7:31 AM"
isCurrentUser: false
} }
ListElement { ListElement {
username: "Bill Smith" username: "You"
message: "I’m generally against putting too many rules on social interaction because it makes interaction anything but social, but technical specifics on how to get on board or participate in a team are I think generally useful, especially if they prevent maintainers from pasting the same response to every PR / issue." message: "I’m generally against putting too many rules on social interaction because it makes interaction anything but social, but technical specifics on how to get on board or participate in a team are I think generally useful, especially if they prevent maintainers from pasting the same response to every PR / issue."
timestamp: "7:32 AM" timestamp: "7:32 AM"
isCurrentUser: true
} }
ListElement { ListElement {
username: qsTr("Slushy Welltodo Woodborer") username: qsTr("Slushy Welltodo Woodborer")
message: "Lorem ipsum ion anything but social, but technical specifics on how to get on board or participate in a team are I think generally useful, especially if they prevent maintainers from pasting the same response to every PR / issue." message: "Lorem ipsum ionanything but social, but technical specifics on how to get on board or participate in a team are I think generally useful, especially if they prevent maintainers from pasting the same response to every PR / issue."
timestamp: "7:33 AM" timestamp: "7:33 AM"
isCurrentUser: false
} }
ListElement { ListElement {
username: "Bill Smith" username: "You"
message: "I’m generally against putting too many rules on social interaction because it makes interaction anything but social, but technical specifics on how to get on board or participate in a team are I think generally useful, especially if they prevent maintainers from pasting the same response to every PR / issue." message: "I’m generally against putting too many rules on social interaction because it makes interaction anything but social, but technical specifics on how to get on board or participate in a team are I think generally useful, especially if they prevent maintainers from pasting the same response to every PR / issue."
timestamp: "7:34 AM" timestamp: "7:34 AM"
isCurrentUser: true
} }
ListElement { ListElement {
username: qsTr("Slushy Welltodo Woodborer") username: qsTr("Slushy Welltodo Woodborer")
message: "Lorem ipsum ion anything but social, but technical specifics on how to get on board or participate in a team are I think generally useful, especially if they prevent maintainers from pasting the same response to every PR / issue." message: "Lorem ipsum ion anything but social, but technical specifics on how to get on board or participate in a team are I think generally useful, especially if they prevent maintainers from pasting the same response to every PR / issue."
timestamp: "7:35 AM" timestamp: "7:35 AM"
isCurrentUser: false
} }
ListElement { ListElement {
username: "Bill Smith" username: "You"
message: "I’m generally against putting too many rules on social interaction because it makes interaction anything but social, but technical specifics on how to get on board or participate in a team are I think generally useful, especially if they prevent maintainers from pasting the same response to every PR / issue." message: "I’m generally against putting too many rules on social interaction because it makes interaction anything but social, but technical specifics on how to get on board or participate in a team are I think generally useful, especially if they prevent maintainers from pasting the same response to every PR / issue."
timestamp: "7:36 AM" timestamp: "7:36 AM"
isCurrentUser: true
} }
ListElement { ListElement {
username: qsTr("Slushy Welltodo Woodborer") username: qsTr("Slushy Welltodo Woodborer")
message: "Last Message - Lorem ipsum ion anything but social, but technical specifics on how to get on board or participate in a team are I think generally useful, especially if they prevent maintainers from pasting the same response to every PR / issue." message: "Last Message - Lorem ipsum ion anything but social, but technical specifics on how to get on board or participate in a team are I think generally useful, especially if they prevent maintainers from pasting the same response to every PR / issue."
timestamp: "7:36 AM" timestamp: "7:36 AM"
isCurrentUser: false
} }
} }
delegate: chatLogViewDelegate delegate: chatLogViewDelegate
@ -365,7 +374,6 @@ SplitView {
chatLogView.positionViewAtEnd() chatLogView.positionViewAtEnd()
} }
} }
// }
} }
// RowLayout { // RowLayout {
@ -426,11 +434,13 @@ SplitView {
Layout.alignment: Qt.AlignLeft | Qt.AlignBottom Layout.alignment: Qt.AlignLeft | Qt.AlignBottom
transformOrigin: Item.Bottom transformOrigin: Item.Bottom
Item { Rectangle {
id: element2 id: element2
width: 200 width: 200
height: 70 height: 70
Layout.fillWidth: true Layout.fillWidth: true
color: "white"
border.width: 0
Rectangle { Rectangle {
id: rectangle id: rectangle
@ -502,6 +512,6 @@ SplitView {
} }
/*##^## /*##^##
Designer { Designer {
D{i:0;height:770;width:1152} D{i:0;formeditorZoom:0.75;height:770;width:1152}
} }
##^##*/ ##^##*/