cellularnetwork/ui/PopupDialog.qml

0001 // SPDX-FileCopyrightText: 2021 Devin Lin <devin@kde.org>
0002 // SPDX-License-Identifier: GPL-2.0-or-later
0003
0004 import QtQuick 2.15
0005 import QtQuick.Layouts 1.2
0006 import QtQuick.Controls 2.15 as Controls
0007 import Qt5Compat.GraphicalEffects
0008 import org.kde.kirigami 2.12 as Kirigami
0009
0010 Controls.Dialog {
0011     id: dialog
0012
0013     anchors.centerIn: Controls.Overlay.overlay
0014     modal: true
0015     padding: Kirigami.Units.smallSpacing
0016     closePolicy: Controls.Popup.CloseOnEscape | Controls.Popup.CloseOnReleaseOutside
0017
0018     property int translateY: (1 - opacity) * Kirigami.Units.gridUnit * 2
0019
0020     NumberAnimation on opacity {
0021         from: 0; to: 1;
0022         duration: Kirigami.Units.veryShortDuration
0023         easing.type: Easing.InOutQuad
0024         running: true
0025     }
0026
0027     contentItem.transform: Translate { y: dialog.translateY }
0028     footer.transform: Translate { y: dialog.translateY }
0029
0030     header: Item {
0031         transform: Translate { y: dialog.translateY }
0032         implicitHeight: heading.implicitHeight + Kirigami.Units.largeSpacing * 2
0033
0034         Kirigami.Heading {
0035             id: heading
0036             level: 2
0037             text: dialog.title
0038             elide: Text.ElideRight
0039             anchors.left: parent.left
0040             anchors.right: parent.right
0041             anchors.leftMargin: Kirigami.Units.largeSpacing
0042             anchors.verticalCenter: parent.verticalCenter
0043
0044             // use tooltip for long text that is elided
0045             Controls.ToolTip.visible: truncated && titleHoverHandler.hovered
0046             Controls.ToolTip.text: dialog.title
0047             HoverHandler {
0048                 id: titleHoverHandler
0049             }
0050         }
0051     }
0052
0053     background: Item {
0054         transform: Translate { y: dialog.translateY }
0055
0056         RectangularGlow {
0057             anchors.fill: rect
0058             anchors.topMargin: 1
0059             cornerRadius: rect.radius * 2
0060             glowRadius: 2
0061             spread: 0.2
0062             color: Qt.rgba(0, 0, 0, 0.3)
0063         }
0064         Rectangle {
0065             id: rect
0066             anchors.fill: parent
0067             Kirigami.Theme.inherit: false
0068             Kirigami.Theme.colorSet: Kirigami.Theme.Window
0069             color: Kirigami.Theme.backgroundColor
0070             radius: Kirigami.Units.smallSpacing
0071
0072             Kirigami.Separator {
0073                 id: topSeparator
0074                 anchors.left: parent.left
0075                 anchors.right: parent.right
0076                 anchors.top: parent.top
0077                 anchors.topMargin: dialog.header.implicitHeight
0078             }
0079
0080             Kirigami.Separator {
0081                 id: bottomSeparator
0082                 anchors.left: parent.left
0083                 anchors.right: parent.right
0084                 anchors.bottom: parent.bottom
0085                 anchors.bottomMargin: dialog.footer.implicitHeight
0086             }
0087
0088             Rectangle {
0089                 Kirigami.Theme.inherit: false
0090                 Kirigami.Theme.colorSet: Kirigami.Theme.View
0091                 color: Kirigami.Theme.backgroundColor
0092                 anchors.left: parent.left
0093                 anchors.right: parent.right
0094                 anchors.top: topSeparator.bottom
0095                 anchors.bottom: bottomSeparator.top
0096             }
0097         }
0098     }
0099 }
0100