Full-screen desktop application with QML

When using QQmlApplicationEngine in c++ you can do something like this in QML:

main.cpp

#include <QApplication>
#include <QQmlApplicationEngine>
#include <QQmlContext>

int main(int argc, char *argv[])
{
    QApplication app(argc, argv);

    QQmlApplicationEngine engine;
    engine.load(QUrl(QStringLiteral("qrc:/main.qml")));

    return app.exec();
}

main.qml

import QtQuick 2.7
import QtQuick.Window 2.2

Window {
    id: mainWindow

    Component.onCompleted: {
        mainWindow.showFullScreen();
    }
}

Tested with QT5.8


Here is yet another variation from previous answers, but this uses the (default Qt Quick Application - Empty) Window QML type and a Qt enum:

import QtQuick 2.6
import QtQuick.Window 2.2

Window {
    id: mainWindow
    objectName: "mainWindow"
    visible: true
    flags: Qt.FramelessWindowHint | Qt.Window
    color: "black"
    visibility: Qt.WindowFullScreen // << the solution
}

If you would like to use business logic written on C++ and some QML user interface you can use QDeclarativeView inside your application. It's just a regular Qt widget so it has method showFullScreen(). Actually this class is like "qmlviewer inside your application".

So you'll get something like this:

#include <QtGui/QApplication>
#include <QtDeclarative/QDeclarativeView>
#include <QtCore/QUrl>

int main(int _argc, char * _argv[])
{
    QApplication app(_argc, _argv);

    QDeclarativeView view;
    view.setSource(QUrl("qrc:/MyGui.qml"));    // if your QML files are inside 
                                               // application resources

    view.showFullScreen();    // here we show our view in fullscreen

    return app.exec();
}

You can find more information here.


There is also a QML-only way to go fullscreen. You can use this if you are not using QDeclarativeView but QQmlApplicationEngine, since the latter doesn't inherits QWidget and has not the method showFullScreen().

import QtQuick 2.2
import QtQuick.Controls 1.1

ApplicationWindow {
    id: window
    visible: true
    visibility: "FullScreen"
    width: 640
    height: 480

    Button {
        text: "exit fullscreen"
        onClicked: window.visibility = "Windowed"
    }
}

But it's important to use ApplicationWindow as the root-element and not Rectangle. For ApplicationWindow you have to import QtQuick.Controls.