Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. General and Desktop
  4. Creating transparent window background
QtWS25 Last Chance

Creating transparent window background

Scheduled Pinned Locked Moved Unsolved General and Desktop
transparencyqtquick2qapplication
1 Posts 1 Posters 1.1k 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.
  • M Offline
    M Offline
    Matthew0x
    wrote on 8 Mar 2021, 12:19 last edited by Matthew0x 3 Aug 2021, 15:17
    #1

    Hello,

    answering the incoming questions:

    • setWindowFlag(Qt::FramelessWindowHint);
    • setAttribute(Qt::WA_TranslucentBackground);

    are tested, they don't work as I desire.

    My idea is to implement a transparent (or partially transparent) window, like the ones to be seen in UWP (metro) type of applications, for example on Windows 10.

    I have successfully implemented such on UWP, and ... partially even in Qt.
    The problem is that:

    Method A:

    • requires borderless window (that just doesn't work well for any type of user in my opinion)

    Method B:

    • is the most likely a "bug" (writing over an inherited property I believe, as the "color" one isn't natively available for that object)

    Therefore, I would like to try out a proper method that would be supported in the framework.
    By no means I am advanced in general programming, especially Qt. However, I understand the most of basic terms I believe.

    Method A:

    Using the aforementioned flags I could create a transparent window, however it lacks dragging event tracking, any maximize/minimize buttons etc. (presented below, the top part is a grid or something alike, that inherits the color thus they go one on another)

    924cfc52-28a6-4b43-acfa-76a54337ce51-image.png

    This is using the desktop type of application, with the main.cpp and mainwindow.cpp files.

    Method B:

    c12e967c-40ea-4856-9eb7-03610e81b4ab-image.png

    This is the result I wish to achieve, but I believe that this way is wrong.
    Not all colors work properly (the hex values, not every hex value is rendered), as well I get error messages (that aren't crucial in the compiling process).

    qrc:/main.qml:63:5: QML StackView: push: qrc:/Page1Form.ui.qml:7 Cannot assign to non-existent property "color" QQmlComponent: Component is not ready qrc:/main.qml:63:5: QML StackView: pop: qrc:/HomeForm.ui.qml:10 Cannot assign to non-existent property "color" QQmlComponent: Component is not ready qrc:/main.qml:63:5: QML StackView: push: qrc:/Page2Form.ui.qml:7 Cannot assign to non-existent property "color"

    Modifications made:
    Page files:

    Page {
    width: 600
    height: 400
    color: "#6655b4f7" - adding the line that probably overwrites the inherited color

    qtquickcontrols2.conf

    [Universal]
    Theme=System
    Background=#800000FF - setting the background property

    Results without the page file modification:

    f7a897af-c68f-4dad-b0ba-684ea42b22e8-image.png

    The colors overlap, this is what I wanted to evade.

    Am I doing something wrong, or is the transparency feature handled in restricted ways?

    Update:
    This post has helped me: https://forum.qt.io/post/339664

    Method 2:
    Background in .conf undefined, background color in ApplicationWindow

    ApplicationWindow {
    id: window
    width: 640
    height: 480
    opacity: 1
    visible: true
    color: "#6655b4f7"
    title: qsTr("Stack")

    for each

    Page {
    width: 600
    height: 400
    //color: "#6655b4f7"
    Universal.background: "transparent"

    Results:

    43f055f7-93dd-4ab1-b441-4d2ec2bb00c4-image.png

    I might have not tested enough the <theme>.background option... No errors this time.
    To the method 1, I have no idea if rendering frame transparent with the controls preserved is possible.

    1 Reply Last reply
    0

    1/1

    8 Mar 2021, 12:19

    • Login

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