Changeset View
Changeset View
Standalone View
Standalone View
src/data/contents/ui/gallery/CardsListViewGallery.qml
| Show All 16 Lines | |||||
| 17 | * 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. | 17 | * 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. | ||
| 18 | */ | 18 | */ | ||
| 19 | 19 | | |||
| 20 | import QtQuick 2.6 | 20 | import QtQuick 2.6 | ||
| 21 | import QtQuick.Controls 2.0 as Controls | 21 | import QtQuick.Controls 2.0 as Controls | ||
| 22 | import QtQuick.Layouts 1.2 | 22 | import QtQuick.Layouts 1.2 | ||
| 23 | import org.kde.kirigami 2.4 as Kirigami | 23 | import org.kde.kirigami 2.4 as Kirigami | ||
| 24 | 24 | | |||
| 25 | import "components" | ||||
| 26 | | ||||
| 25 | Kirigami.ScrollablePage { | 27 | Kirigami.ScrollablePage { | ||
| 26 | id: page | 28 | id: page | ||
| 27 | 29 | | |||
| 28 | title: qsTr("List view of simple cards") | 30 | title: qsTr("List view of simple cards") | ||
| 29 | 31 | | |||
| 30 | actions.main: Kirigami.Action { | 32 | actions.main: Kirigami.Action { | ||
| 31 | iconName: "documentinfo" | 33 | iconName: "documentinfo" | ||
| 32 | text: qsTr("Info") | 34 | text: qsTr("Info") | ||
| 33 | checkable: true | 35 | checkable: true | ||
| 34 | onCheckedChanged: sheet.sheetOpen = checked; | 36 | onCheckedChanged: sheet.sheetOpen = checked; | ||
| 35 | shortcut: "Alt+I" | 37 | shortcut: "Alt+I" | ||
| 36 | } | 38 | } | ||
| 37 | 39 | | |||
| 38 | Kirigami.OverlaySheet { | 40 | //Close the drawer with the back button | ||
| 39 | id: sheet | 41 | onBackRequested: { | ||
| 40 | onSheetOpenChanged: page.actions.main.checked = sheetOpen | 42 | if (sheet.sheetOpen) { | ||
| 41 | header: RowLayout { | 43 | event.accepted = true; | ||
| 42 | Kirigami.Heading { | 44 | sheet.close(); | ||
| 43 | Layout.fillWidth: true | | |||
| 44 | text: qsTr("Cards List View") | | |||
| 45 | } | | |||
| 46 | Controls.ToolButton { | | |||
| 47 | text: qsTr("HIG...") | | |||
| 48 | enabled: false | | |||
| 49 | onClicked: Qt.openUrlExternally("") | | |||
| 50 | } | | |||
| 51 | Controls.ToolButton { | | |||
| 52 | text: qsTr("Source code...") | | |||
| 53 | onClicked: Qt.openUrlExternally("https://cgit.kde.org/kirigami.git/tree/examples/gallerydata/contents/ui/gallery/CardsListViewGallery.qml") | | |||
| 54 | } | 45 | } | ||
| 55 | } | 46 | } | ||
| 56 | 47 | | |||
| 57 | Controls.Label { | 48 | InfoSheet { | ||
| 58 | property int implicitWidth: Kirigami.Units.gridUnit * 25 | 49 | id: sheet | ||
| 59 | wrapMode: Text.WordWrap | 50 | | ||
| 60 | text: qsTr("The Kirigami types AbstractCard and Card are used to implement the popular Card pattern used on many mobile and web platforms that is used to display a collection of information or actions.\n Besides the Card components, Kirigami offers also 3 kinds of views and positioners to help to present cards with beautiful and responsive layouts.\n\nIn this page, CardsListView is used to do a list view of AbstractCard subclasses with a custom layout inside.\n CardsListView should be used only with cards which can look good at any horizontal size, so it is recommended to use directly AbstractCard with an appropriate layout inside, because they are stretching for the whole list width.\nTherefore is discouraged to use it with the Card type, unless it has Horizontal as headerOrientation.\n The choice between using this view with AbstractCard or a normal ListView with AbstractListItem/BasicListItem is purely a choice based on aesthetics alone.") | 51 | page: page | ||
| 61 | } | 52 | component: "CardsListViewGallery" | ||
| 62 | } | 53 | } | ||
| 63 | 54 | | |||
| 64 | Kirigami.CardsListView { | 55 | Kirigami.CardsListView { | ||
| 65 | id: view | 56 | id: view | ||
| 66 | model: 100 | 57 | model: 100 | ||
| 67 | 58 | | |||
| 68 | delegate: Kirigami.AbstractCard { | 59 | delegate: Kirigami.AbstractCard { | ||
| 69 | //NOTE: never put a Layout as contentItem as it will cause binding loops | 60 | //NOTE: never put a Layout as contentItem as it will cause binding loops | ||
| ▲ Show 20 Lines • Show All 46 Lines • Show Last 20 Lines | |||||