131 lines
3.6 KiB
QML
131 lines
3.6 KiB
QML
import QtQuick 2.4
|
|
import QtQuick.Window 2.2
|
|
|
|
Window {
|
|
id : mainWindow
|
|
visible: true
|
|
width: 800
|
|
height: 480
|
|
|
|
property real gridListWidth : (width * 0.60)
|
|
property real gridListHeight : (height * 0.50)
|
|
|
|
property real gridCellSpacing : (height * 0.004)
|
|
property real gridCellHeight : (height * 0.039)
|
|
property real gridCellWidth : (width * 0.20)
|
|
|
|
Rectangle {
|
|
id : rectBackground
|
|
anchors.fill: parent
|
|
color : "white"
|
|
|
|
ListView {
|
|
id : ls
|
|
width: mainWindow.gridListWidth
|
|
height: mainWindow.gridListHeight
|
|
clip : true
|
|
headerPositioning: ListView.OverlayHeader
|
|
spacing : mainWindow.gridCellSpacing
|
|
|
|
model: ListModel {
|
|
ListElement {
|
|
name: "Bill Smith"
|
|
number: "555 3264"
|
|
hairColor: "red"
|
|
}
|
|
ListElement {
|
|
name: "John Brown"
|
|
number: "484 7789"
|
|
hairColor: "blue"
|
|
}
|
|
ListElement {
|
|
name: "Sam Wise"
|
|
number: "284 1547"
|
|
hairColor: "yellow"
|
|
}
|
|
}
|
|
|
|
header : Row {
|
|
spacing : mainWindow.gridCellSpacing
|
|
|
|
Rectangle {
|
|
width : mainWindow.gridCellWidth
|
|
height : mainWindow.gridCellHeight
|
|
color : "blue"
|
|
|
|
Text {
|
|
anchors.centerIn: parent
|
|
color : "white"
|
|
text: "Name"
|
|
}
|
|
}
|
|
|
|
Rectangle {
|
|
width : mainWindow.gridCellWidth
|
|
height : mainWindow.gridCellHeight
|
|
color : "blue"
|
|
|
|
Text {
|
|
anchors.centerIn: parent
|
|
color : "white"
|
|
text: "Number"
|
|
}
|
|
|
|
}
|
|
|
|
Rectangle {
|
|
width : mainWindow.gridCellWidth
|
|
height : mainWindow.gridCellHeight
|
|
color : "blue"
|
|
|
|
Text {
|
|
anchors.centerIn: parent
|
|
color : "white"
|
|
text: "Hair Color"
|
|
}
|
|
}
|
|
}
|
|
|
|
delegate: Row {
|
|
spacing : mainWindow.gridCellSpacing
|
|
|
|
Rectangle {
|
|
width : mainWindow.gridCellWidth
|
|
height : mainWindow.gridCellHeight
|
|
color : "red"
|
|
|
|
Text {
|
|
anchors.centerIn: parent
|
|
color : "white"
|
|
text: name
|
|
}
|
|
}
|
|
|
|
Rectangle {
|
|
width : mainWindow.gridCellWidth
|
|
height : mainWindow.gridCellHeight
|
|
color : "red"
|
|
|
|
Text {
|
|
anchors.centerIn: parent
|
|
color : "white"
|
|
text: number
|
|
}
|
|
}
|
|
|
|
Rectangle {
|
|
width : mainWindow.gridCellWidth
|
|
height : mainWindow.gridCellHeight
|
|
color : "red"
|
|
|
|
Text {
|
|
anchors.centerIn: parent
|
|
color : "white"
|
|
text: hairColor
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|