display several chat logs; style then a bit, make it scrollable

This commit is contained in:
Iuri Matias 2020-05-14 14:24:38 -04:00
parent 9e5f2456cf
commit 531383c207
1 changed files with 125 additions and 58 deletions

View File

@ -236,69 +236,136 @@ SplitView {
Layout.fillHeight: true Layout.fillHeight: true
Layout.alignment: Qt.AlignLeft | Qt.AlignTop Layout.alignment: Qt.AlignLeft | Qt.AlignTop
Rectangle { Component {
id: chatBox id: chatLogViewDelegate
height: 140 Rectangle {
color: "#00000000" id: chatBox
border.color: "#00000000" height: 140
Layout.alignment: Qt.AlignLeft | Qt.AlignTop color: "#00000000"
Layout.fillWidth: true border.color: "#00000000"
Layout.alignment: Qt.AlignLeft | Qt.AlignTop
Layout.fillWidth: true
width: chatLogView.width
Image { Image {
id: chatImage id: chatImage
width: 30 width: 30
height: 30 height: 30
anchors.left: parent.left anchors.left: parent.left
anchors.leftMargin: 16 anchors.leftMargin: 16
anchors.top: parent.top anchors.top: parent.top
anchors.topMargin: 16 anchors.topMargin: 16
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
source: "../img/placeholder-profile.png" source: "../img/placeholder-profile.png"
} }
TextEdit { TextEdit {
id: chatName id: chatName
text: qsTr("Slushy Welltodo Woodborer") text: username
anchors.top: parent.top anchors.top: parent.top
anchors.topMargin: 22 anchors.topMargin: 22
anchors.left: chatImage.right anchors.left: chatImage.right
anchors.leftMargin: 16 anchors.leftMargin: 16
font.bold: true font.bold: true
font.pixelSize: 14 font.pixelSize: 14
readOnly: true readOnly: true
selectByMouse: true wrapMode: Text.WordWrap
} selectByMouse: true
}
TextEdit { TextEdit {
id: chatText id: chatText
text: qsTr("Im 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.") text: message
font.family: "Inter" font.family: "Inter"
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
anchors.right: parent.right anchors.right: parent.right
anchors.rightMargin: 60 anchors.rightMargin: 60
anchors.left: chatName.left anchors.left: chatName.left
anchors.leftMargin: 0 anchors.leftMargin: 0
anchors.top: chatName.bottom anchors.top: chatName.bottom
anchors.topMargin: 16 anchors.topMargin: 16
font.pixelSize: 14 font.pixelSize: 14
readOnly: true readOnly: true
selectByMouse: true selectByMouse: true
} Layout.fillWidth: true
}
TextEdit { TextEdit {
id: chatTime id: chatTime
color: Theme.darkGrey color: Theme.darkGrey
font.family: "Inter" font.family: "Inter"
text: qsTr("7:30 AM") text: timestamp
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
anchors.bottomMargin: 16 anchors.bottomMargin: 16
anchors.right: parent.right anchors.right: parent.right
anchors.rightMargin: 16 anchors.rightMargin: 16
font.pixelSize: 10 font.pixelSize: 10
readOnly: true readOnly: true
selectByMouse: true selectByMouse: true
}
} }
} }
// ScrollView {
// id: chatScrollView
// anchors.fill: parent
// Layout.fillWidth: true
// Layout.fillHeight: true
ListView {
id: chatLogView
// anchors.topMargin: 24
anchors.fill: parent
// model: chatLogModel
Layout.fillWidth: true
Layout.fillHeight: true
model: ListModel {
ListElement {
username: "Bill Smith"
message: "First Message - Im 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"
}
ListElement {
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."
timestamp: "7:31 AM"
}
ListElement {
username: "Bill Smith"
message: "Im 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"
}
ListElement {
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."
timestamp: "7:33 AM"
}
ListElement {
username: "Bill Smith"
message: "Im 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"
}
ListElement {
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."
timestamp: "7:35 AM"
}
ListElement {
username: "Bill Smith"
message: "Im 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"
}
ListElement {
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."
timestamp: "7:36 AM"
}
}
delegate: chatLogViewDelegate
onCountChanged: {
chatLogView.positionViewAtEnd()
}
}
// }
} }
// RowLayout { // RowLayout {
@ -435,6 +502,6 @@ SplitView {
} }
/*##^## /*##^##
Designer { Designer {
D{i:0;formeditorZoom:0.5;height:770;width:1152} D{i:0;height:770;width:1152}
} }
##^##*/ ##^##*/