| Qt 控件设置透明和半透明方法汇总 | 您所在的位置：网站首页 › 表格背景透明度 › Qt 控件设置透明和半透明方法汇总 |
Qt 控件设置透明和半透明方法汇总
|
遇到了好多次控件有需要设置为透明和半透明的情况，每次都是去网上搜一搜，看看别人怎么实现的，浪费了很多时间，故在这里进行一个总结，希望对自己有一个提升。 本文对透明的各种情况进行了分类： 整个窗口及窗口下的控件都是半透明的状态（分类一）只有窗口是透明状态，窗口下的子控件不受影响（分类二）窗口的透明状态可调整，窗口下子控件不受影响（分类三）看文字也是看的一脸懵逼，这里通过表格的方式再做进一步的阐述。 分类名称窗口透明状态窗口下子控件透明状态分类一透明度可调整透明度跟随窗口透明度变化分类二全透明，透明度无法调整子控件不透明分类三窗口的透明度可以调整子控件不透明下面分别分对三种方法进行分类汇总： 分类一此种方法通过调用setWindowOpacity(qreal level)来实现，调用该接口后出整个窗口包括窗口下的子控件的透明度都会发生变化。 分类二此种方法通多调用setAttribute(Qt::WA_TranslucentBackground)来实现。调用该属性后，该窗口会直接透明，但是该窗口下的子控件不受影响，依然是不透明的。 优点：可以快速的实现窗口的全透明，并且该接口只影响调用属性的控件本身，不影响子控件。 缺点：缺点也很明显，就是不能调整透明度，在某些场景下不太灵活。 注意事项：需要注意的是在对某个控件设置该属性后，只影响控件本身，对子控件或者父控件没有影响，有点时候会很纳闷，明明自己对某个控件设置了该属性，为什么还是感觉没有变透明呢？这里其实已生效了，只是设置该属性的父控件没有设置透明属性而已，为了更好的观察效果，建议对设置该属性的控件的父控件设置一个背景色，这样就很容易的看出是否生效了。 分类三我个人认为更多时候是使用分类三，以为这种情况下窗口的透明度可以调节，通过设置不同的背景可以实现更好的展示效果，更容易做出漂亮的界面。这里我也对这种情况进行了分类，以窗口为例： 窗口的背景指定的颜色(QColor)窗口的背景是指定的图片上面两种情况会有不同的方法来实现窗口的半透明，下面将针对每种情况一一进行说明。 窗口背景为指定的颜色(QColor)这种情况比较简单，直接在ui文件中对窗口设置样式表即可，例如： #customPageColor{background-color: rgb(170, 170, 255,100);} 上面的引用中可以看到rgb中前三个分别是红、绿、蓝三种颜色，最后一个数字100表示的是透明度，取值范围为（0~255）。感兴趣的朋友可以自行实验下。 需要注意的是如果窗口为顶层窗口，即在UI Designer中没有父窗口并且该窗口是以QWidget为基类时，设置的样式表没有生效。这个手需要在类的构造函数调用setAttribute(Qt::WA_StyledBackground);属性，重新运行样式表就可以生效了。原因是QWidget并么有重新实现paintEvent函数，当然不调用这个属性，重载paintEvent函数也是可以的。感兴趣的朋友可以自行尝试，网上也有相关的教程。 窗口背景为图片这种情况下就不能简单的通过样式表来完成窗口的透明度设置了，因为图片的样式表并不像QColor一样有透明通道，需要通过其他的方法来实现。通过实验有两种方法可以实现效果。 方法一： 通过重载paintEvent函数，QPainter类有一个成员函数setOpacity，在绘制之前通过调用调用该函数，绘制时就可以根据透明设置的透明度绘制图片。参考代码如下： QPainter painter(this); painter.setOpacity(0.4); painter.drawPixmap(rect(),QPixmap(":/image/2.jpg"),QRect()); 同样是重载paintEvent函数，不过是采用不同的方法，简要的是说还是通过QPainter提供的一些方法来实现图片的绘制。这里不进行赘述，直接上代码，感觉QPatiner这个类太强大了。 //方法二：该方法也可以实现图片背景的透明度设置，但是此种方法在实战中可能使用价值比较高 QPixmap covert_pixmap(":/image/2.jpg"); QPixmap pixmap(covert_pixmap.width(), covert_pixmap.height()); pixmap.fill(Qt::transparent); QPainter painter(&pixmap); QPoint start_point(0, 0); QPoint end_point(0, pixmap.height()); //QLinearGradient进行渐变色设置 QLinearGradient linear_gradient(start_point, end_point); linear_gradient.setColorAt(0, QColor(255, 255, 255, 100)); linear_gradient.setColorAt(0.5, QColor(255, 255, 255, 150)); linear_gradient.setColorAt(1, QColor(255, 255, 255, 255)); painter.fillRect(this->rect(), QBrush(linear_gradient)); painter.setCompositionMode(QPainter::CompositionMode_SourceIn); painter.drawPixmap(0, 0, covert_pixmap); painter.end(); QPainter painter2(this); painter2.drawPixmap(0, 0, pixmap);效果图给大家展示一下，首先是主界面：
上图中的“按钮测试”按钮点后展示的是分类二的全透明效果。原图如下： 设置透明后效果如下所示：
可以看到窗口的背景已经完全透明了，仅显示了两个子控件。 继续点击主界面中的“打开colorPage”按钮，显示的窗口是以指定的颜色为背景色。效果如下所示：
继续点击主界面中的“打开PicPage”按钮，效果如下所示：
代码资源下载地址（无需积分）：https://download.csdn.net/download/iqanchao/87699074 |
【本文地址】