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. Transparent QMainWindow for Raspberry Pi
Forum Updated to NodeBB v4.3 + New Features

Transparent QMainWindow for Raspberry Pi

Scheduled Pinned Locked Moved Solved General and Desktop
2 Posts 1 Posters 630 Views 1 Watching
  • 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
    RyanAR
    wrote on 27 Oct 2021, 15:14 last edited by
    #1

    Hello everyone,

    I can use the following on Windows 10 to make the QMainWindow transparent, without it affecting the children of the main window. I would like to replicate this on a Raspberry Pi.

    Inside constructor of MainWindow

    setStyleSheet("background:transparent;");
    setAttribute(Qt::WA_TranslucentBackground);
    setWindowFlags(Qt::FramelessWindowHint);
    

    Screenshot of program running on top of Desktop with Windows

    3a826463-7655-4f61-b014-5ac7af43c84a-image.png

    However, when I try to get this running on a Raspberry Pi, the background turns black.

    Same code, but on Raspberry Pi
    1c81f2b6-dafa-41fa-b4c1-d189e88853a3-image.png

    Does anyone know how to get this transparency working on a Raspberry Pi? I'm not sure if I have to use some platform-specific functions. Any help would be appreciated.

    System Specs

    Qt C++/XML
    Windows (10 Pro x64): Creator 5.0.2 / Qt 5.15.2
    Linux (Raspberry Pi 4 ): Raspberry Pi OS (based on Debian Stretch). Creator 4.8.2 / Qt 5.11.3
    

    Minimal Implementation

    #include "mainwindow.h"
    #include "ui_mainwindow.h"
    
    MainWindow::MainWindow(QWidget *parent)
        : QMainWindow(parent)
        , ui(new Ui::MainWindow)
    {
        ui->setupUi(this);
    
        setStyleSheet("background:transparent;");
        setAttribute(Qt::WA_TranslucentBackground);
        setWindowFlags(Qt::FramelessWindowHint); // activate for border removal
    }
    
    MainWindow::~MainWindow()
    {
        delete ui;
    }
    
    
    

    Minimal UI

    <?xml version="1.0" encoding="UTF-8"?>
    <ui version="4.0">
     <class>MainWindow</class>
     <widget class="QMainWindow" name="MainWindow">
      <property name="geometry">
       <rect>
        <x>0</x>
        <y>0</y>
        <width>800</width>
        <height>600</height>
       </rect>
      </property>
      <property name="windowTitle">
       <string>MainWindow</string>
      </property>
      <widget class="QWidget" name="centralwidget">
       <widget class="QGroupBox" name="groupBox">
        <property name="geometry">
         <rect>
          <x>310</x>
          <y>160</y>
          <width>271</width>
          <height>51</height>
         </rect>
        </property>
        <property name="styleSheet">
         <string notr="true">QGroupBox
    {
    	background-color:rgba(0,0,0,0.5);
    }</string>
        </property>
        <property name="title">
         <string/>
        </property>
        <widget class="QPushButton" name="pushButton">
         <property name="geometry">
          <rect>
           <x>10</x>
           <y>10</y>
           <width>91</width>
           <height>31</height>
          </rect>
         </property>
         <property name="styleSheet">
          <string notr="true">QPushButton
    {
    	background-color:rgb(255,0,0);
    	border:none;	
    	outline:none;
    }</string>
         </property>
         <property name="text">
          <string>PushButton</string>
         </property>
        </widget>
        <widget class="QLabel" name="label">
         <property name="geometry">
          <rect>
           <x>110</x>
           <y>20</y>
           <width>121</width>
           <height>16</height>
          </rect>
         </property>
         <property name="styleSheet">
          <string notr="true">QLabel
    {
    	color:white;
    }</string>
         </property>
         <property name="text">
          <string>TextLabel</string>
         </property>
        </widget>
       </widget>
      </widget>
      <widget class="QMenuBar" name="menubar">
       <property name="geometry">
        <rect>
         <x>0</x>
         <y>0</y>
         <width>800</width>
         <height>21</height>
        </rect>
       </property>
      </widget>
      <widget class="QStatusBar" name="statusbar"/>
     </widget>
     <resources/>
     <connections/>
    </ui>
    
    

    Thanks,
    Ryan

    1 Reply Last reply
    0
    • R Offline
      R Offline
      RyanAR
      wrote on 3 Nov 2021, 09:30 last edited by RyanAR 11 Apr 2021, 09:18
      #2

      It took a while to figure out, but it's finally working.

      For anyone else with this issue:

      Use the raspi-config command, go to advanced settings and enable Compositor. Run the xcompmgr command and then try the program again. Transparency now works!

      1 Reply Last reply
      4

      1/2

      27 Oct 2021, 15:14

      • Login

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