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. QWebView opacity rendering trouble
Qt 6.11 is out! See what's new in the release blog

QWebView opacity rendering trouble

Scheduled Pinned Locked Moved General and Desktop
7 Posts 2 Posters 2.5k 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.
  • A Offline
    A Offline
    Antoine
    wrote on last edited by
    #1

    Hi eveybody,

    I have a strange problem with opacity in a webview.

    I am using a QWebView in front of a QGLWidget.

    The background of the QWebView is set to transparent, like this :

    this->setStyleSheet("background-color: transparent;");
    this->setWindowFlags(Qt::FramelessWindowHint); //No windowing
    this->setAttribute(Qt::WA_TranslucentBackground); // No background
    

    And the background of the HTML page is also set to transparent in the CSS of the page, like this :

    body{
    	background-color: rgba(255,255,255, 0) !important;
    	background:transparent !important;
    }
    

    I want to create a DIV on the left of the HTML page with a white background at 60% opacity, like this:
    the CSS property in the HTML page :

    background: rgba(255, 255, 255, 0.60);
    

    Normaly the result should be like this :
    Under Chrome
    (a small white transparency)

    But
    When I am running the program, here the result I've got :
    In the app
    (an ugly gray transparency)

    I have tried w/o any success, this :

    QPalette palette = this->palette(); //Get webView palette
    palette.setBrush(QPalette::Base, Qt::transparent);
    this->page()->setPalette(palette); //Set transparent palette
    
    this->setAutoFillBackground(false);
    this->setAttribute(Qt::WA_OpaquePaintEvent, false);//Remove opaque
    

    I really don't know how to handle this issue : (

    Please Can anyone help me on this ?

    A 1 Reply Last reply
    0
    • A Antoine

      Hi eveybody,

      I have a strange problem with opacity in a webview.

      I am using a QWebView in front of a QGLWidget.

      The background of the QWebView is set to transparent, like this :

      this->setStyleSheet("background-color: transparent;");
      this->setWindowFlags(Qt::FramelessWindowHint); //No windowing
      this->setAttribute(Qt::WA_TranslucentBackground); // No background
      

      And the background of the HTML page is also set to transparent in the CSS of the page, like this :

      body{
      	background-color: rgba(255,255,255, 0) !important;
      	background:transparent !important;
      }
      

      I want to create a DIV on the left of the HTML page with a white background at 60% opacity, like this:
      the CSS property in the HTML page :

      background: rgba(255, 255, 255, 0.60);
      

      Normaly the result should be like this :
      Under Chrome
      (a small white transparency)

      But
      When I am running the program, here the result I've got :
      In the app
      (an ugly gray transparency)

      I have tried w/o any success, this :

      QPalette palette = this->palette(); //Get webView palette
      palette.setBrush(QPalette::Base, Qt::transparent);
      this->page()->setPalette(palette); //Set transparent palette
      
      this->setAutoFillBackground(false);
      this->setAttribute(Qt::WA_OpaquePaintEvent, false);//Remove opaque
      

      I really don't know how to handle this issue : (

      Please Can anyone help me on this ?

      A Offline
      A Offline
      Antoine
      wrote on last edited by Antoine
      #2
      This post is deleted!
      1 Reply Last reply
      0
      • A Offline
        A Offline
        Antoine
        wrote on last edited by
        #3

        Nobody ?? =\

        1 Reply Last reply
        0
        • B. MarleyB Offline
          B. MarleyB Offline
          B. Marley
          wrote on last edited by
          #4

          try to set alpha value 0-255.

          ex: rgba(255, 255, 255, 102) instead of rgba(255, 255, 255, 0.60);

          1 Reply Last reply
          0
          • A Offline
            A Offline
            Antoine
            wrote on last edited by Antoine
            #5

            @B.-Marley No working cause it's not valid, css3 only accept alpha value between 0 and 1

            I also tried hsla() property but same problem.

            So I thought "ok whatever, I'll put a white background-image 1px repeating with a opacity of 0.6."

            It's not working too. Same result.

            So now I'm coming back to my first idea that this issue is from QWidget layering background.
            The 3D widget is a QOpenGLWidget and I have my QWebview in front with the properties :

            this->setStyleSheet("background-color: transparent;");
            this->setAttribute(Qt::WA_TranslucentBackground); // No background
            

            Maybe the idea of :

            this->setAttribute(Qt::WA_OpaquePaintEvent, false);//Remove opaque
            

            was a good way ?

            There is anyway to repaint the background or something else ?

            Please help

            1 Reply Last reply
            0
            • A Offline
              A Offline
              Antoine
              wrote on last edited by
              #6

              Can it be a sort of filter on the QOpenGlWidget ?

              1 Reply Last reply
              0
              • A Offline
                A Offline
                Antoine
                wrote on last edited by
                #7

                Somebody have a clue please ?

                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