Results 1 to 9 of 9

Thread: Transparent Widgets

  1. #1
    Join Date
    Dec 2017
    Posts
    19
    Thanks
    10
    Qt products
    Qt5 Qt/Embedded
    Platforms
    MacOS X Unix/X11 Windows Android

    Default Transparent Widgets

    Hi everyone,
    I want to make a transparent window like:
    trpr.png

    I tried following codes:

    Qt Code:
    1. MainWindow::MainWindow(QWidget *parent) :
    2. QMainWindow(parent),
    3. ui(new Ui::MainWindow)
    4. {
    5. ui->setupUi(this);
    6.  
    7. setAutoFillBackground( false );
    8. setWindowFlags(Qt::FramelessWindowHint);
    9. // setAttribute(Qt::WA_TranslucentBackground);
    10. // setAttribute(Qt::WA_TransparentForMouseEvents);
    11.  
    12. QLinearGradient alphaGradient(rect().topLeft(), rect().bottomLeft());
    13. alphaGradient.setColorAt(0.0, Qt::transparent);
    14. alphaGradient.setColorAt(0.5, Qt::black);
    15. alphaGradient.setColorAt(1.0, Qt::transparent);
    16. QGraphicsOpacityEffect *effect = new QGraphicsOpacityEffect(this);
    17. effect->setOpacityMask(alphaGradient);
    18. effect->setOpacity(0.8);
    19. setGraphicsEffect(effect);
    20. }
    To copy to clipboard, switch view to plain text mode 
    If I use "WA_TranslucentBackground" background will be omitted from the widget (you can select anything behind it !) but, I need a semi transparent window which its opacity/transparency can be adjusted.
    Thanks.
    Last edited by CodeFreak; 3rd August 2018 at 19:40.

  2. #2
    Join Date
    Jan 2008
    Location
    Alameda, CA, USA
    Posts
    5,230
    Thanks
    302
    Thanked 864 Times in 851 Posts
    Qt products
    Qt5
    Platforms
    Windows

    Default Re: Transparent Widgets

    If I use "WA_TransparentForMouseEvents" background will be omitted from the widget
    I don't think that is right. "Transparent for mouse events" doesn't mean the widget is visibly transparent, it just means it ignores mouse events and passes them to whatever widget(s) are underneath it.

    I want to make a transparent window ... I need an opaque widget.
    These two statements are contradictory. Which is it that you need - a widget that shows what is under it (transparent / translucent) or one that doesn't (opaque)?
    <=== The Great Pumpkin says ===>
    Please use CODE tags when posting source code so it is more readable. Click "Go Advanced" and then the "#" icon to insert the tags. Paste your code between them.

  3. #3
    Join Date
    Dec 2017
    Posts
    19
    Thanks
    10
    Qt products
    Qt5 Qt/Embedded
    Platforms
    MacOS X Unix/X11 Windows Android

    Default Re: Transparent Widgets

    Thanks for your hint.
    I've edited the post.
    I need a semi transparent window which its opacity/transparency can be adjusted.
    Last edited by CodeFreak; 3rd August 2018 at 19:30.

  4. #4
    Join Date
    Jan 2008
    Location
    Alameda, CA, USA
    Posts
    5,230
    Thanks
    302
    Thanked 864 Times in 851 Posts
    Qt products
    Qt5
    Platforms
    Windows

    Default Re: Transparent Widgets

    So you want the entire MainWindow to be translucent, toolbars, menubar and all? If not, then you should apply the effect only to the central widget.

    I think you need to remove the setAutoFillBackground() statement, because you do want the widget to fill its background, and I think you should move the gradient code to the resizeEvent(), because otherwise the gradient will no longer match the widget's size when the window is resized. I don't know how the WA_TranslucentBackground attribute works in combination with a graphics effect, so you'll have to try it both ways.

    An alternative is to set a gradient QBrush as the QPalette brush for the QPalette::Window color role.
    <=== The Great Pumpkin says ===>
    Please use CODE tags when posting source code so it is more readable. Click "Go Advanced" and then the "#" icon to insert the tags. Paste your code between them.

  5. The following user says thank you to d_stranz for this useful post:

    CodeFreak (3rd August 2018)

  6. #5
    Join Date
    Dec 2017
    Posts
    19
    Thanks
    10
    Qt products
    Qt5 Qt/Embedded
    Platforms
    MacOS X Unix/X11 Windows Android

    Default Re: Transparent Widgets

    I want to make something like a semi transparent QTabWidget object which whole the background be semi transparent (even the icons) but the text of the icons and also whole the contents don't be.
    To simplify the procedures, I'm trying to make a transparent window, first.
    I tried following codes:

    Qt Code:
    1. void MainWindow::paintEvent(QPaintEvent* ) {
    2. QPalette pal = palette();
    3. pal.setBrush(QPalette::Window, QColor(0, 0, 255, 0) );
    4. setPalette(pal);
    5. setAutoFillBackground(true);
    6. }
    To copy to clipboard, switch view to plain text mode 
    missed1.png

    Qt Code:
    1. void MainWindow::paintEvent(QPaintEvent* ) {
    2. QPalette pal = palette();
    3. pal.setBrush(QPalette::Window, QColor(0, 0, 255, 255) );
    4. setPalette(pal);
    5. setAutoFillBackground(true);
    6. }
    To copy to clipboard, switch view to plain text mode 
    missed2.png

    Qt Code:
    1. void MainWindow::paintEvent(QPaintEvent* /*event*/) {
    2. // QColor backgroundColor = palette().light().color();
    3. // backgroundColor.setAlpha(0);
    4. QColor backgroundColor =Qt::TransparentMode;
    5. QPainter customPainter(this);
    6. customPainter.fillRect(rect(),backgroundColor);
    7. }
    To copy to clipboard, switch view to plain text mode 
    missed3.png

    Qt Code:
    1. MainWindow::MainWindow(QWidget *parent) :
    2. QMainWindow(parent),
    3. ui(new Ui::MainWindow)
    4. {
    5. ui->setupUi(this);
    6. setWindowFlags(Qt::FramelessWindowHint);
    7. QGraphicsOpacityEffect *effect = new QGraphicsOpacityEffect(this);
    8. effect->setOpacity(1.0);
    9. setGraphicsEffect(effect);
    10. }
    To copy to clipboard, switch view to plain text mode 
    missed4.png

    Qt Code:
    1. MainWindow::MainWindow(QWidget *parent) :
    2. QMainWindow(parent),
    3. ui(new Ui::MainWindow)
    4. {
    5. ui->setupUi(this);
    6. setWindowFlags(Qt::FramelessWindowHint);
    7. QGraphicsOpacityEffect *effect = new QGraphicsOpacityEffect(this);
    8. effect->setOpacity(0.0);
    9. setGraphicsEffect(effect);
    10. }
    To copy to clipboard, switch view to plain text mode 
    missed5.png

    Anyway "QGraphicsOpacityEffect" is not the thing that I want.
    I also tried many other things...

  7. #6
    Join Date
    Jan 2008
    Location
    Alameda, CA, USA
    Posts
    5,230
    Thanks
    302
    Thanked 864 Times in 851 Posts
    Qt products
    Qt5
    Platforms
    Windows

    Default Re: Transparent Widgets

    Saw this in an answer on another forum:

    Qt Code:
    1. ChildWidget( QWidget* parent = 0 ) : QLabel( parent )
    2. {
    3. QPalette pal = palette();
    4. pal.setBrush(QPalette::Window, QColor(0, 0, 255, 128) );
    5. setPalette(pal);
    6. setAutoFillBackground(true);
    7. }
    To copy to clipboard, switch view to plain text mode 

    Essentially what I suggested in an earlier post.
    <=== The Great Pumpkin says ===>
    Please use CODE tags when posting source code so it is more readable. Click "Go Advanced" and then the "#" icon to insert the tags. Paste your code between them.

  8. #7
    Join Date
    Dec 2017
    Posts
    19
    Thanks
    10
    Qt products
    Qt5 Qt/Embedded
    Platforms
    MacOS X Unix/X11 Windows Android

    Default Re: Transparent Widgets

    Main Window: With a method like this a black background still exist (in main window) even you set the alpha to 0.
    Child Widget : A simple empty "child QWidget" will be transparent or semi transparent but if you want to make another Widgets (like QTabWidgets) transparent, it do not work.

  9. #8
    Join Date
    Jan 2008
    Location
    Alameda, CA, USA
    Posts
    5,230
    Thanks
    302
    Thanked 864 Times in 851 Posts
    Qt products
    Qt5
    Platforms
    Windows

    Default Re: Transparent Widgets

    OK. I really don't understand what it is you are trying to do, so good luck.
    <=== The Great Pumpkin says ===>
    Please use CODE tags when posting source code so it is more readable. Click "Go Advanced" and then the "#" icon to insert the tags. Paste your code between them.

  10. #9
    Join Date
    Dec 2017
    Posts
    19
    Thanks
    10
    Qt products
    Qt5 Qt/Embedded
    Platforms
    MacOS X Unix/X11 Windows Android

    Default Re: Transparent Widgets

    I wan to make an application which be totally semi-transparent; Main Window and all the widgets (TabWiget, PushButton, Label, ProgressBar and etc.) inside it be semi-transparent.

    Opacity function influences whole the MainWindow and its children; title, close button, minimize and maximize button and content will be affected by opacity function. Then its not the thing that I want.

    Qt::WA_TranslucentBackground ; for Main Window any content behind it, is accessible for all mouse/touch events (In Windows 8.1).
    > And I can't use it for TabWidget, PushButton, Label, ProgressBar and etc.

    It is almost like what I want:
    qq16-bg2.png

    Anyway, thanks for your reply.
    Last edited by CodeFreak; 7th August 2018 at 17:29.

Similar Threads

  1. Replies: 2
    Last Post: 31st May 2010, 12:57
  2. Qt3 - Multiple transparent widgets
    By bythesea in forum Qt Programming
    Replies: 4
    Last Post: 11th September 2009, 12:24
  3. Mac OS X Top-Level Transparent Widgets
    By tinsuke in forum Qt Programming
    Replies: 0
    Last Post: 17th October 2008, 17:01
  4. Transparent widgets on top of QGLWidget
    By tseval in forum Qt Programming
    Replies: 1
    Last Post: 12th May 2007, 22:03
  5. Transparent widgets
    By incapacitant in forum Newbie
    Replies: 10
    Last Post: 21st March 2006, 19:01

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
Digia, Qt and their respective logos are trademarks of Digia Plc in Finland and/or other countries worldwide.