Title bar background qml

Question

How can I change background and icon on this title bar in qml?

Answer 1

This depends on how exactly your GUI is done.

Regarding the icon, the easiest and most consistent way to set it is via QGuiApplication::windowIcon. This will set the icon for all windows and dialogs of the application:

int main(int argc, char *argv[]) {
    QApplication app(argc, argv);
    app.setWindowIcon(QIcon(":/MyAppIcon.png"));
    QQmlApplicationEngine engine;
    engine.load(QUrl("qrc:/main.qml"));
    // ...

For the window title, if you use a Window or ApplicationWindow, then have a look at the Window::title property, e.g.:

import QtQuick 2.0
import QtQuick.Controls 2.2

ApplicationWindow {
    width: 800
    height: 600
    title: qsTr("Hello World")
}

Update: If you need more customization like changing the background color of the title bar, then you will have to use platform native means to do so. I guess this is due to such things are highly platform specific and might not even be possible on some systems, so Qt does not provide any APIs for such tasks.

You can try to get the platform window handle of a QQuickWindow (which is a QWindow) using QWindow::winId and use e.g. the Windows API to do some custom drawing. Here is a similar post you could look into to get started.

However, keep in mind that doing so means you have to introduce platform specific code in your project, so better wrap that away if Windows is not the only target for your application.

An alternative might be to request the window to be created completely without the system title bar. Than you can draw a custom title bar completely in QML. However, this means you would have to "recreate" the Windows window title bar and - if this is a requirement - also do the same for other OS you want to run your app on (or live with the fact that the app looks "alien" on non-Windows). However, this might be perceived as bad by users who prefer to have a consistent look and feel for all applications.

Answer 2

how is your qml application launched? there isn't much you can do if you run it via qmlscene.

but if you build your own app by subclass QQuickView then you have full set of API at your disposal (http://doc.qt.io/qt-5/qquickview-members.html):

setIcon() 
setTitle()