Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. How to change color of the window dynamically?
Forum Updated to NodeBB v4.3 + New Features

How to change color of the window dynamically?

Scheduled Pinned Locked Moved Unsolved QML and Qt Quick
14 Posts 3 Posters 2.5k Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • R Offline
    R Offline
    rakeshthp
    wrote on 26 Jun 2020, 14:28 last edited by
    #1

    Hi

    I am facing this weird issue. Since the code is part of a big project, I can't post it here. But I will try to give as much as possible. Suppose I have two windows, windowCreator and mainWindow. mainWindow is embedded within windowCreator. No other component or control exists in windowCreator. Below is the WindowCreator.qml

    Window {
        id: windowCreator
    
        height: 300
        width: 240 
    
        opacity: 0
    
        flags: Qt.Tool | Qt.WindowTitleHint | Qt.WindowTransparentForInput
    
        function createMainWindow() {
            var component = Qt.createComponent(“MainWindow.qml")
            if (component.status === Component.Ready) {
                var mainWindow = component.createObject(windowCreator)
                return mainWindow
            }
        }
    }
    

    createMainWindow method is called in some other part of the application which launches this window.
    Below is the code for MainWindow.qml

    Window {
        id: mainWindow
        property bool isMinimized: false
    
        flag: Qt.FramelessWindowHint | Qt.WA_TranslucentBackground | Qt.Window
    
        color: !isMinimized ? "red" : "transparent"
        opaque: 1
        …
    }
    

    isMinimized is set from another QML. The problem we are facing here is, based on the value of isMinimized, the color of mainWindow does not change. It always shows black for transparent. It works the other way round, i.e.

    color: isMinimized ? "red" : "transparent"
    

    But in this case, some part of mainWindow is getting cropped/clipped. We want the code in MainWindow.qml to get working, i.e. the color must change based on the value of isMinimized. The black must be rendered as transparent.

    Experts put in your comments as what mistake am I doing, or what is that I am missing. Surely something is missing and that's why it is acting weird. Let me know if you guys need any further information.

    Thanks in advance.

    1 Reply Last reply
    0
    • D Offline
      D Offline
      dheerendra
      Qt Champions 2022
      wrote on 26 Jun 2020, 16:24 last edited by
      #2

      isMinimized may not be set by the time you create the object. Can you try setting/change the values in Component.onComplete(...) signal ? Object is constructed by this time.

      Dheerendra
      @Community Service
      Certified Qt Specialist
      http://www.pthinks.com

      1 Reply Last reply
      1
      • F Offline
        F Offline
        fcarney
        wrote on 26 Jun 2020, 16:35 last edited by
        #3

        Does the code you posted reproduce the problem? If not can you post minimal code that does?

        C++ is a perfectly valid school of magic.

        1 Reply Last reply
        1
        • R Offline
          R Offline
          rakeshthp
          wrote on 26 Jun 2020, 16:52 last edited by
          #4

          @dheerendra : isMinimized is a property declared in the MainWindow.qml. It's value is set to true when user clicks on minimize button on the customized titlebar. So when mainWindow object is constructed, and when user clicks on minimize button, I need maunwindow's color to be transparent. And red color when it is restored back.

          @fcarney : It's reproducing in my code base, which is based on Qt 5.12. Let me try getting minimal code to reproduce this issue.

          1 Reply Last reply
          0
          • D Offline
            D Offline
            dheerendra
            Qt Champions 2022
            wrote on 30 Jun 2020, 06:27 last edited by
            #5

            @rakeshthp Are you able to see the problem with sample reproducible program ? If yes, can you send the same ?

            Dheerendra
            @Community Service
            Certified Qt Specialist
            http://www.pthinks.com

            1 Reply Last reply
            1
            • R Offline
              R Offline
              rakeshthp
              wrote on 10 Jul 2020, 11:36 last edited by rakeshthp 7 Oct 2020, 12:38
              #6

              Hi @dheerendra , @fcarney

              Here is the sample reproducible program. In main.qml, there are four set of statements to set color to the window. All four can be tested one by one. Once you run this, there will be a small black colored rectangle. On clicking that rectangle the background color of the window changes. Below are the observations

              1.    color: "transparent"
              

              Works fine, I see transparent window

              2.    color: isMinimized ? "red" : "green"
              

              This also works fine. I see red and green colors alternatively

              3.   color: isMinimized ? "transparent" : "green"
              

              This one fails: I don't see transparent background while toggling color

              4.   color: !isMinimized ? "transparent" : "green"
              

              Works fine: I see expected colors while toggling.

              Not sure why #3 is failing, which is exactly we are facing issue in our project.

              So what do you guys think, is missing here or wrong here?

              NOTE: This is tested with Qt 5.12.5 with MSVC2015 on Windows 10 Pro, with Intel(R) Core(TM) i7-6699U CPU@2.60GHz

              Let me know if you guys need any other info.

              Thanks

              1 Reply Last reply
              0
              • R Offline
                R Offline
                rakeshthp
                wrote on 10 Jul 2020, 12:15 last edited by
                #7

                main.qml

                import QtQuick 2.12
                import QtQuick.Window 2.12
                
                Window {
                
                    property bool isMinimized: false
                
                    flags: Qt.Window | Qt.FramelessWindowHint | Qt.WA_TranslucentBackground
                
                    visible: true
                    width: 640
                    height: 480
                    title: qsTr("Hello World")
                //    color: "transparent"
                //    color: isMinimized ? "red" : "green"
                //    color: isMinimized ? "transparent" : "green"
                    color: !isMinimized ? "transparent" : "green"
                
                    Rectangle {
                        color: "transparent"
                        height: parent.height
                        width: parent.width
                        anchors.fill: parent
                        border.width: 2
                        border.color: "blue"
                
                        Rectangle {
                            height: parent.height * 0.1
                            width: parent.width * 0.02
                
                            color: "black"
                            anchors {
                                left: parent.left
                                verticalCenter: parent.verticalCenter
                            }
                
                            MouseArea {
                                anchors.fill: parent
                                onClicked: {
                
                                    isMinimized = !isMinimized
                                    console.log("Clicked")
                                }
                            }
                        }
                    }
                }
                

                main.cpp

                #include <QGuiApplication>
                #include <QQmlApplicationEngine>
                #include <QQuickWindow>
                #include <QPalette>
                
                int main(int argc, char *argv[])
                {
                    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
                
                    QQuickWindow::setSceneGraphBackend(QSGRendererInterface::Software);
                
                    QGuiApplication app(argc, argv);
                    QPalette palette;
                    palette.setColor(QPalette::Base, Qt::transparent);
                    app.setPalette(palette);
                
                    QQmlApplicationEngine engine;
                    const QUrl url(QStringLiteral("qrc:/main.qml"));
                    QObject::connect(&engine, &QQmlApplicationEngine::objectCreated,
                                     &app, [url](QObject *obj, const QUrl &objUrl) {
                        if (!obj && url == objUrl)
                            QCoreApplication::exit(-1);
                    }, Qt::QueuedConnection);
                    engine.load(url);
                
                    return app.exec();
                }
                
                

                .pro file

                QT += quick
                
                CONFIG += c++11
                
                # The following define makes your compiler emit warnings if you use
                # any Qt feature that has been marked deprecated (the exact warnings
                # depend on your compiler). Refer to the documentation for the
                # deprecated API to know how to port your code away from it.
                DEFINES += QT_DEPRECATED_WARNINGS
                
                # You can also make your code fail to compile if it uses deprecated APIs.
                # In order to do so, uncomment the following line.
                # You can also select to disable deprecated APIs only up to a certain version of Qt.
                #DEFINES += QT_DISABLE_DEPRECATED_BEFORE=0x060000    # disables all the APIs deprecated before Qt 6.0.0
                
                SOURCES += \
                        main.cpp
                
                RESOURCES += qml.qrc
                
                # Additional import path used to resolve QML modules in Qt Creator's code model
                QML_IMPORT_PATH =
                
                # Additional import path used to resolve QML modules just for Qt Quick Designer
                QML_DESIGNER_IMPORT_PATH =
                
                # Default rules for deployment.
                qnx: target.path = /tmp/$${TARGET}/bin
                else: unix:!android: target.path = /opt/$${TARGET}/bin
                !isEmpty(target.path): INSTALLS += target
                
                1 Reply Last reply
                0
                • D Offline
                  D Offline
                  dheerendra
                  Qt Champions 2022
                  wrote on 11 Jul 2020, 07:08 last edited by
                  #8

                  I don't see a issue. I tried your same program. It works fine. I tried with QtQuick 2.14.

                  Which platform are you trying ?

                  Dheerendra
                  @Community Service
                  Certified Qt Specialist
                  http://www.pthinks.com

                  R 1 Reply Last reply 11 Jul 2020, 10:33
                  1
                  • D dheerendra
                    11 Jul 2020, 07:08

                    I don't see a issue. I tried your same program. It works fine. I tried with QtQuick 2.14.

                    Which platform are you trying ?

                    R Offline
                    R Offline
                    rakeshthp
                    wrote on 11 Jul 2020, 10:33 last edited by
                    #9

                    @dheerendra did you try all four ways of setting colour to the window? Three of them are commented.

                    1 Reply Last reply
                    0
                    • D Offline
                      D Offline
                      dheerendra
                      Qt Champions 2022
                      wrote on 11 Jul 2020, 10:42 last edited by
                      #10

                      yes. All tried.

                      Dheerendra
                      @Community Service
                      Certified Qt Specialist
                      http://www.pthinks.com

                      1 Reply Last reply
                      1
                      • R Offline
                        R Offline
                        rakeshthp
                        wrote on 11 Jul 2020, 15:27 last edited by
                        #11

                        That's really strange, as I am seeing it in the configuration mentioned above. Are you running it on Windows?

                        1 Reply Last reply
                        0
                        • R Offline
                          R Offline
                          rakeshthp
                          wrote on 12 Jul 2020, 08:38 last edited by
                          #12

                          @dheerendra : This is tested with Qt 5.12.5 with MSVC2015 on Windows 10 Pro, with Intel(R) Core(TM) i7-6699U CPU@2.60GHz

                          @fcarney : Do you also see it working fine?

                          1 Reply Last reply
                          0
                          • R Offline
                            R Offline
                            rakeshthp
                            wrote on 12 Jul 2020, 09:00 last edited by
                            #13

                            Attached screenshot of issue what I am noticing with this piece of code.

                            transparent_issue.PNG

                            Thanks in advance

                            1 Reply Last reply
                            0
                            • R Offline
                              R Offline
                              rakeshthp
                              wrote on 14 Jul 2020, 04:50 last edited by
                              #14

                              @dheerendra ,

                              Do you think it may be bug in QtQuick 2.12 ?

                              1 Reply Last reply
                              0

                              • Login

                              • Login or register to search.
                              • First post
                                Last post
                              0
                              • Categories
                              • Recent
                              • Tags
                              • Popular
                              • Users
                              • Groups
                              • Search
                              • Get Qt Extensions
                              • Unsolved