feat: show the all the emojis in the popup

This commit is contained in:
Jonathan Rainville 2020-07-02 13:48:06 -04:00 committed by Iuri Matias
parent 6ddd95fe5a
commit 4371e37b27
4 changed files with 119 additions and 3 deletions

View File

@ -47,11 +47,19 @@ Rectangle {
cursorShape: Qt.PointingHandCursor cursorShape: Qt.PointingHandCursor
anchors.fill: parent anchors.fill: parent
onClicked: { onClicked: {
if (stickersPopup.opened) { console.log('CLICK')
stickersPopup.close() if (emojiPopup.opened) {
console.log('CLOSE')
emojiPopup.close()
} else { } else {
stickersPopup.open() console.log('OPEN')
emojiPopup.open()
} }
// if (stickersPopup.opened) {
// stickersPopup.close()
// } else {
// stickersPopup.open()
// }
} }
} }
} }
@ -65,6 +73,14 @@ Rectangle {
stickerList: chatsModel.stickers stickerList: chatsModel.stickers
stickerPackList: chatsModel.stickerPacks stickerPackList: chatsModel.stickerPacks
} }
EmojiPopup {
id: emojiPopup
width: 360
height: 440
x: parent.width - width - 8
y: parent.height - sendBtns.height - height - 8
}
} }
/*##^## /*##^##
Designer { Designer {

View File

@ -0,0 +1,98 @@
import QtQuick 2.13
import QtQuick.Controls 2.13
import QtQuick.Layouts 1.3
import QtGraphicalEffects 1.0
import "../../../../imports"
import "../../../../shared"
import "../ChatColumn/samples"
import "./emojiList.js" as EmojiJSON
Popup {
id: popup
modal: false
property int selectedPackId
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent
background: Rectangle {
radius: 8
border.color: Theme.grey
layer.enabled: true
layer.effect: DropShadow{
verticalOffset: 3
radius: 8
samples: 15
fast: true
cached: true
color: "#22000000"
}
}
ListModel {
id: emojiModel
}
Component.onCompleted: {
EmojiJSON.emoji_json.forEach(function (emoji) {
emojiModel.append({filename: emoji})
})
}
contentItem: ColumnLayout {
parent: popup
anchors.fill: parent
spacing: 0
Item {
Layout.fillWidth: true
Layout.leftMargin: 4
Layout.rightMargin: 4
Layout.topMargin: 4
Layout.bottomMargin: 0
Layout.alignment: Qt.AlignTop | Qt.AlignLeft
Layout.preferredHeight: 400 - 4
GridView {
property int imageWidth: 26
property int imageMargin: 4
id: emojiGrid
visible: count > 0
anchors.fill: parent
cellWidth: imageWidth + emojiGrid.imageMargin * 2
cellHeight: imageWidth + emojiGrid.imageMargin * 2
model: emojiModel
focus: true
clip: true
delegate: Item {
width: emojiGrid.cellWidth
height: emojiGrid.cellHeight
Column {
anchors.fill: parent
anchors.topMargin: emojiGrid.imageMargin
anchors.leftMargin: emojiGrid.imageMargin
Image {
width: emojiGrid.imageWidth
height: emojiGrid.imageWidth
source: "../../../../imports/twemoji/26x26/" + filename
fillMode: Image.PreserveAspectFit
MouseArea {
cursorShape: Qt.PointingHandCursor
anchors.fill: parent
onClicked: {
console.log('SELECT')
// chatsModel.sendSticker(hash, popup.selectedPackId)
popup.close()
}
}
}
}
}
}
}
}
}
/*##^##
Designer {
D{i:0;formeditorColor:"#ffffff";height:440;width:360}
}
##^##*/

File diff suppressed because one or more lines are too long

View File

@ -51,6 +51,7 @@ else: unix:!android: target.path = /opt/$${TARGET}/bin
!isEmpty(target.path): INSTALLS += target !isEmpty(target.path): INSTALLS += target
DISTFILES += \ DISTFILES += \
app/AppLayouts/Chat/components/EmojiPopup.qml \
fonts/InterStatus/InterStatus-Black.otf \ fonts/InterStatus/InterStatus-Black.otf \
fonts/InterStatus/InterStatus-BlackItalic.otf \ fonts/InterStatus/InterStatus-BlackItalic.otf \
fonts/InterStatus/InterStatus-Bold.otf \ fonts/InterStatus/InterStatus-Bold.otf \