1  import QtQuick 2.12
2  import QtQuick.Window 2.12
3  import QtQuick.Layouts 1.12
4  import QtQuick.Controls 2.12
5  import QtQml 2.3

6  Window {
7      visible: true
8      width: 840
9      height: 480
10     title: qsTr("Model-View-Delegate Demo")
11     id: mainWindowId
12     color: "white"
13     ListModel {
14        id: bookModelId

15         ListElement {
16             title: "C++ Programmin"
17             type: "Ebook, Printed"
18         }

19         ListElement {
20             title: "Introductory to Algorithms"
21             type: "Ebook, Printed, Video"
22         }

23         ListElement {
24             title: "Software Engineering      "
25             type: "Ebook, Printed, Video"
26         }

27         ListElement {
28             title: "Computer Networks          "
29             type: "Printed"
30        }

31         ListElement {
32             title: "DataMining in Python       "
33             type: "Ebook"
34         }
35     }

36     Component {
37         id: bookDelegateId
38         Rectangle {
39             width: parent.width
40             height: 50
41             color: "white"
42             border.color: "red"
43             RowLayout {
44                 spacing: 2
45                 anchors.fill: parent
46 
47                 Text {
48                     text: title
49                     font.pixelSize: 32
50                     Layout.alignment: Qt.AlignLeft
51                     Layout.margins: 5
52                 }
53                 Text {
54                     text: type
55                     font.pixelSize: 32
56                     Layout.alignment: Qt.AlignCenter
57                     Layout.margins: 5
58                 }
 
59                 Button {
60                     text: "Delete"
61                     Layout.alignment: Qt.AlignRight
62                     Layout.margins: 5
63                     onClicked: {
64                         if (index < bookModelId.count) {
65                             bookModelId.remove(index, 1);
66                         }
67                     }
68                 }
69             }
70         }
71     }

72     Component {
73         id: headerDelegateId
74         Rectangle {
75             width: parent.width; height: 50
76            color: "lightblue"
77             RowLayout {
78                 spacing: 2
79                 anchors.fill: parent
80                 Text {
81                     text: "Book Title"
82                     font.pixelSize: 32
83                     Layout.alignment: Qt.AlignLeft
84                     Layout.margins: 5
85                 }
86                 Text {
87                     text: "Type"
88                     font.pixelSize: 32
89                     Layout.alignment: Qt.AlignRight
90                     Layout.margins: 5
91                 }
92             }
93         }
94     }

95     Component {
96         id: footerDelegateId
97         Rectangle {
98             width: parent.width; height: 50
99             color: "lightblue"
100            Text {
101                text: "Count: " + bookModelId.count
102                font.pixelSize: 32
103            }
104        }
105    }

106    ColumnLayout {
107        anchors.fill: parent

108        ListView {
109            id: bookViewId
110            model: bookModelId
11             delegate: bookDelegateId
112            header: headerDelegateId
113            footer: footerDelegateId

114            Layout.fillWidth: true
115            Layout.fillHeight: true
116        }

117        Rectangle {
118            width: parent.width
119            height: 50
120            color: "cyan"
121            Layout.fillWidth: true
122            RowLayout {
123                spacing: 2
124                anchors.fill: parent
125                TextInput {
126                    id: bookModelInputId
127                    text: "Book Title"
128                    cursorVisible: true
129                    Layout.alignment: Qt.AlignLeft
130                    font.pixelSize: 32
131                    focus: true
132                }
133                ComboBox {
134                    id: bookTypeInputId
135                    width: 400
136                    font.pixelSize: 18
137                    model: [ "Ebook, Printed, Video", "Ebook, Printed", "Printed" ]
138                    Layout.alignment: Qt.AlignRight
139                }
140            }

141            Keys.onReturnPressed: {
142                bookModelId.append({"title" : bookModelInputId.text, "type" : bookTypeInputId.currentText })
143                bookModelInputId.clear()
144            }
145        }
146    }
147 }
