Files
neochat/imports/Spectral/Component/Emoji/EmojiPicker.qml
2018-11-18 10:47:12 +08:00

108 lines
2.6 KiB
QML

import QtQuick 2.9
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3
import QtQuick.Controls.Material 2.2
import Spectral.Component 2.0
import Spectral 0.1
import Spectral.Setting 0.1
ColumnLayout {
property string emojiCategory: "people"
property var textArea
property var emojiModel
spacing: 0
ListView {
Layout.fillWidth: true
Layout.preferredHeight: 48
Layout.leftMargin: 24
Layout.rightMargin: 24
boundsBehavior: Flickable.DragOverBounds
clip: true
orientation: ListView.Horizontal
model: ListModel {
ListElement { label: "😏"; category: "people" }
ListElement { label: "🌲"; category: "nature" }
ListElement { label: "🍛"; category: "food"}
ListElement { label: "🚁"; category: "activity" }
ListElement { label: "🚅"; category: "travel" }
ListElement { label: "💡"; category: "objects" }
ListElement { label: "🔣"; category: "symbols" }
ListElement { label: "🏁"; category: "flags" }
}
delegate: ItemDelegate {
width: 64
height: 48
contentItem: Text {
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
font.pointSize: 24
font.family: "Emoji"
text: label
}
Rectangle {
anchors.bottom: parent.bottom
width: parent.width
height: 2
visible: emojiCategory === category
color: Material.accent
}
onClicked: emojiCategory = category
}
}
Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 1
color: MSettings.darkTheme ? "#424242" : "#e7ebeb"
}
GridView {
Layout.fillWidth: true
Layout.preferredHeight: 180
cellWidth: 48
cellHeight: 48
boundsBehavior: Flickable.DragOverBounds
clip: true
model: emojiModel.model[emojiCategory]
delegate: ItemDelegate {
width: 48
height: 48
contentItem: Text {
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
font.pointSize: 20
font.family: "Emoji"
text: modelData.unicode
}
onClicked: textArea.insert(textArea.cursorPosition, modelData.unicode)
}
ScrollBar.vertical: ScrollBar {}
}
}