kirigami/tests/CardTest.qml

0001 import QtQuick 2.15
0002 import QtQuick.Controls 2.15
0003 import QtQuick.Layouts 1.15
0004
0005 import org.kde.kirigami 2.20 as Kirigami
0006
0007 Item {
0008     width: 600
0009     height: 600
0010
0011     Kirigami.Card {
0012         width: 300
0013         anchors.centerIn: parent
0014
0015         banner.title: "Card"
0016         banner.titleIcon: "document-new"
0017         banner.titleAlignment: alignCombo.currentValue
0018         banner.source: "/usr/share/wallpapers/Next/contents/screenshot.png"
0019
0020         headerOrientation: orientationCombo.currentValue
0021
0022         contentItem: Label {
0023             text: "Card Contents"
0024         }
0025
0026         actions: [
0027             Kirigami.Action {
0028                 icon.name: "document-new"
0029                 text: "Action 1"
0030             },
0031             Kirigami.Action {
0032                 icon.name: "document-new"
0033                 text: "Action 2"
0034             }
0035         ]
0036     }
0037
0038     RowLayout {
0039         anchors.bottom: parent.bottom
0040         anchors.horizontalCenter: parent.horizontalCenter
0041
0042         ComboBox {
0043             id: alignCombo
0044
0045             model: [
0046                 { text: "Top Left", align: Qt.AlignLeft | Qt.AlignTop },
0047                 { text: "Top Center", align: Qt.AlignHCenter | Qt.AlignTop },
0048                 { text: "Top Right", align: Qt.AlignRight | Qt.AlignTop },
0049                 { text: "Center Left", align: Qt.AlignLeft | Qt.AlignVCenter },
0050                 { text: "Center", align: Qt.AlignHCenter | Qt.AlignVCenter },
0051                 { text: "Center Right", align: Qt.AlignRight | Qt.AlignVCenter },
0052                 { text: "Bottom Left", align: Qt.AlignLeft | Qt.AlignBottom },
0053                 { text: "Bottom Center", align: Qt.AlignHCenter | Qt.AlignBottom },
0054                 { text: "Bottom Right", align: Qt.AlignRight | Qt.AlignBottom }
0055             ]
0056
0057             textRole: "text"
0058             valueRole: "align"
0059         }
0060
0061         ComboBox {
0062             id: orientationCombo
0063
0064             model: [
0065                 { text: "Vertical", orientation: Qt.Vertical },
0066                 { text: "Horizontal", orientation: Qt.Horizontal }
0067             ]
0068
0069             textRole: "text"
0070             valueRole: "orientation"
0071         }
0072     }
0073 }