src/qml/EmojiDelegate.qml

0001 // SPDX-FileCopyrightText: 2022 Tobias Fella <tobias.fella@kde.org>
0002 // SPDX-License-Identifier: GPL-2.0-or-later
0003
0004 import QtQuick
0005 import QtQuick.Controls as QQC2
0006 import org.kde.kirigami as Kirigami
0007
0008 QQC2.ItemDelegate {
0009     id: root
0010
0011     property string name
0012     property string emoji
0013     property bool showTones: false
0014     property bool isImage: false
0015
0016     QQC2.ToolTip.text: root.name
0017     QQC2.ToolTip.visible: hovered && root.name !== ""
0018     QQC2.ToolTip.delay: Kirigami.Units.toolTipDelay
0019     leftInset: Kirigami.Units.smallSpacing
0020     topInset: Kirigami.Units.smallSpacing
0021     rightInset: Kirigami.Units.smallSpacing
0022     bottomInset: Kirigami.Units.smallSpacing
0023
0024     contentItem: Item {
0025         Kirigami.Heading {
0026             anchors.fill: parent
0027             visible: !root.emoji.startsWith("image") && !root.isImage
0028             text: root.emoji
0029             horizontalAlignment: Text.AlignHCenter
0030             verticalAlignment: Text.AlignVCenter
0031             font.family: "emoji"
0032
0033             Kirigami.Icon {
0034                 width: Kirigami.Units.gridUnit * 0.5
0035                 height: Kirigami.Units.gridUnit * 0.5
0036                 source: "arrow-down"
0037                 anchors.bottom: parent.bottom
0038                 anchors.right: parent.right
0039                 visible: root.showTones
0040             }
0041         }
0042         Image {
0043             anchors.fill: parent
0044             visible: root.emoji.startsWith("image") || root.isImage
0045             source: visible ? root.emoji : ""
0046         }
0047     }
0048
0049     background: Rectangle {
0050         color: root.checked ? Kirigami.Theme.highlightColor : Kirigami.Theme.backgroundColor
0051         radius: Kirigami.Units.smallSpacing
0052
0053         Rectangle {
0054             radius: Kirigami.Units.smallSpacing
0055             anchors.fill: parent
0056             color: Kirigami.Theme.highlightColor
0057             opacity: root.hovered && !root.pressed ? 0.2 : 0
0058         }
0059     }
0060 }