qtbackground-colorapplicationwindow

Qt quick ApplicationWindow 'color' for background color doesn't work


I created a simple Qt quick application with a single main.qml, which is like the code below. The problem is the background color of window wasn't set to #ffffff, instead it's set to light gray (the default color of window on Windows I thought). The rectangle's color is set correctly.

I'm using Qt Creator 3.3.1 (opensource) based on Qt 5.4.1 on windows.

import QtQuick 2.4
import QtQuick.Layouts 1.1
import QtQuick.Controls.Styles 1.3
import QtQuick.Controls 1.3
import QtQuick.Window 2.2
import QtQuick.Dialogs 1.2

ApplicationWindow {
    title: qsTr("Hello")
    width: 200
    height: 200
    visible: true
    color: "#FFFFFF"

    Rectangle {
        id: rectangle1
        width: 100
        height: 100
        color: "#ffffff"
    }
}

Solution

  • ApplicationWindowStyle QML Type provide styling for ApplicationWindow. Default ApplicationWindowStyle represent background as:

    background: Rectangle {
            visible: !styleData.hasColor
            color: SystemPaletteSingleton.window(true)
    }
    

    styleData.hasColor property is defined as:

    property QtObject styleData: QtObject {
        readonly property bool hasColor: window.color != "#ffffff"
    }
    

    So, if your ApplicationWindow color is #FFFFFF, you see light gray rectangle over window background.

    To make white background, you need to set custom ApplicationWindowStyle.

    ApplicationWindow {
        visible: true
        width: 640
        height: 480
        style: ApplicationWindowStyle {
            background: Rectangle {
                color: "#FFFFFF"
            }
        }
    }