QML simple program not running - qt

Question

I am trying to run the following, but nothing happens when I run it.
How can I debug such an issue?
import QtQuick 2.0
import QtQml.Models 2.1
Item{
id: main
width: 1500
height: 1500
GridView {
id: root
width: 1500
height: 1500
cellWidth: 200; cellHeight: 200
visible: true
model: DelegateModel {
model: ListModel {
ListElement {
color: "blue"
}
ListElement {
color: "white"
}
ListElement {
color: "red"
}
ListElement {
color: "green"
}
ListElement {
color: "orange"
}
ListElement {
color: "yellow"
}
ListElement {
color: "grey"
}
}
delegate: MouseArea {
objectName: "mousearea"
implicitHeight: parent.height
implicitWidth: parent.width
Rectangle {
anchors.fill: parent
color: model.color
}
drag{
target: parent
}
}
}
}
}
What I intend from this code is the following:
create few rectangles inside a GridView and add a MouseArea to them and try dragging them around afterwards. I am not sure if my model structure is correct here.
EDIT:
Adding main.cpp
#include <QGuiApplication>
#include <QQmlApplicationEngine>
int main(int argc, char *argv[])
{
QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
QGuiApplication app(argc, argv);
QQmlApplicationEngine engine;
engine.load(QUrl(QStringLiteral("qrc:/main.qml")));
if (engine.rootObjects().isEmpty())
return -1;
return app.exec();
}

Answer 1

QQmlApplicationEngine expects to have a Window as the root element as indicated by the docs:
...
Unlike QQuickView, QQmlApplicationEngine does not automatically create
a root window. If you are using visual items from Qt Quick, you will
need to place them inside of a Window.
...
So the solution is simple, change Item by Window:
main.qml
import QtQuick 2.0
import QtQuick.Window 2.11
import QtQml.Models 2.1
Window{
visible: true
id: main
width: 1500
height: 1500
GridView {
id: root
width: 1500
height: 1500
cellWidth: 200; cellHeight: 200
visible: true
model: DelegateModel {
model: ListModel {
ListElement {
color: "blue"
}
ListElement {
color: "white"
}
ListElement {
color: "red"
}
ListElement {
color: "green"
}
ListElement {
color: "orange"
}
ListElement {
color: "yellow"
}
ListElement {
color: "grey"
}
}
delegate: MouseArea {
objectName: "mousearea"
implicitHeight: parent.height
implicitWidth: parent.width
Rectangle {
anchors.fill: parent
color: model.color
}
drag{
target: parent
}
}
}
}
}