Как создать прозрачный QWidget поверх одноуровневого QVideoWidget? - PullRequest
Новая
       67

Как создать прозрачный QWidget поверх одноуровневого QVideoWidget?

0 голосов
/ 01 октября 2018

Я хочу добавить некоторые элементы управления и информацию поверх полноэкранного QVideoWidget.Поэтому я создаю QMainWindow пользовательский интерфейс, а затем повышаю центральный виджет до QVideoWidget как: enter image description here

<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
 <class>VideoScreen</class>
 <widget class="QMainWindow" name="VideoScreen">
  <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>
  <property name="styleSheet">
   <string notr="true"/>
  </property>
  <widget class="QVideoWidget" name="videoScreen">
   <property name="styleSheet">
    <string notr="true"/>
   </property>
  </widget>
 </widget>
 <customwidgets>
  <customwidget>
   <class>QVideoWidget</class>
   <extends>QWidget</extends>
   <header>QVideoWidget</header>
   <container>1</container>
  </customwidget>
 </customwidgets>
 <resources/>
 <connections/>
</ui>

И ControlBoards пользовательский интерфейс: enter image description here

<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
 <class>ControlBoard</class>
 <widget class="QWidget" name="ControlBoard">
  <property name="geometry">
   <rect>
    <x>0</x>
    <y>0</y>
    <width>1044</width>
    <height>520</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string>Form</string>
  </property>
  <property name="styleSheet">
   <string notr="true"/>
  </property>
  <widget class="QLabel" name="title">
   <property name="geometry">
    <rect>
     <x>210</x>
     <y>90</y>
     <width>59</width>
     <height>17</height>
    </rect>
   </property>
   <property name="styleSheet">
    <string notr="true">
</string>
   </property>
   <property name="text">
    <string>Title</string>
   </property>
  </widget>
  <widget class="QPushButton" name="play">
   <property name="geometry">
    <rect>
     <x>320</x>
     <y>120</y>
     <width>101</width>
     <height>31</height>
    </rect>
   </property>
   <property name="styleSheet">
    <string notr="true"/>
   </property>
   <property name="text">
    <string>play</string>
   </property>
  </widget>
  <widget class="QPushButton" name="stop">
   <property name="geometry">
    <rect>
     <x>210</x>
     <y>120</y>
     <width>101</width>
     <height>31</height>
    </rect>
   </property>
   <property name="styleSheet">
    <string notr="true"/>
   </property>
   <property name="text">
    <string>stop</string>
   </property>
  </widget>
 </widget>
 <resources/>
 <connections/>
</ui>

Затем в videoscreen.cpp я также добавляю ControlBoard в качестве брата QVideoWidget: 

VideoScreen::VideoScreen(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::VideoScreen), player(new QMediaPlayer)
{

    ui->setupUi(this);

    player->setVideoOutput(ui->videoScreen);
    ui->videoScreen->lower();
    ControlBoard *cb = new ControlBoard(this);
}

Когда я воспроизводю видео, результат:enter image description here

Как сделать ControlBoard прозрачным, чтобы мы могли видеть видео позади?
Я пробовал код в ControlBoard конструкторе: 

//    setWindowFlags(Qt::Widget | Qt::FramelessWindowHint);
//    setAttribute(Qt::WA_NoSystemBackground);
//    setAttribute(Qt::WA_TranslucentBackground);
//    setAttribute(Qt::WA_PaintOnScreen);
//    setAttribute(Qt::WA_TransparentForMouseEvents);
//    setAutoFillBackground(false);

Но это только показывает фон родителя, а не видео родного брата.Поддерживает ли это Qt5?Спасибо!

ОБНОВЛЕНИЕ :
Я также попробовал кое-что подобное (база на ): 

class OverlayWidget : public QWidget
{
   void newParent() {
      if (!parent()) return;
      parent()->installEventFilter(this);
      raise();
   }
public:
   explicit OverlayWidget(QWidget * parent = {}) : QWidget{parent} {
      setAttribute(Qt::WA_NoSystemBackground);
      setAttribute(Qt::WA_TransparentForMouseEvents);
      newParent();
   }
protected:
   //! Catches resize and child events from the parent widget
   bool eventFilter(QObject * obj, QEvent * ev) override {
      if (obj == parent()) {
         if (ev->type() == QEvent::Resize)
         {
//            resize(static_cast<QResizeEvent*>(ev)->size());
         }
         else if (ev->type() == QEvent::ChildAdded)
            raise();
      }
      return QWidget::eventFilter(obj, ev);
   }
   //! Tracks parent widget changes
   bool event(QEvent* ev) override {
      if (ev->type() == QEvent::ParentAboutToChange) {
         if (parent()) parent()->removeEventFilter(this);
      }
      else if (ev->type() == QEvent::ParentChange)
         newParent();
      return QWidget::event(ev);
   }
};

class LoadingOverlay : public OverlayWidget
{
public:
   LoadingOverlay(QWidget * parent = {}) : OverlayWidget{parent} {
      setAttribute(Qt::WA_TranslucentBackground);
   }
protected:
   void paintEvent(QPaintEvent *) override {
      QPainter p(this);
//      p.fillRect(rect(), {10, 10, 10, 100});
      p.setPen({200, 200, 255});
      p.setFont({"arial,helvetica", 48});
      p.drawText(rect(), "Loading...", Qt::AlignHCenter | Qt::AlignVCenter);
   }
};

int main(int argc, char * argv[])
{
   QApplication a(argc, argv);

   QMainWindow window;
   QVideoWidget central(&window);
   central.setMinimumSize(600, 700);
   window.setCentralWidget(&central);

   QMediaPlayer player;
   player.setMedia(QUrl::fromLocalFile("dolbycanyon.mov"));
   player.setVideoOutput(&central);

   LoadingOverlay overlay(&window);
   overlay.resize(400, 300);
   overlay.setWindowOpacity(.4);
   overlay.setWindowFlags(Qt::Widget | Qt::FramelessWindowHint);
   overlay.setAttribute(Qt::WA_PaintOnScreen);
   overlay.setAutoFillBackground(false);
//   QTimer::singleShot(5000, &overlay, SLOT(hide()));
//   QTimer::singleShot(7000, &player, SLOT(play()));

   player.play();
   window.show();

   return a.exec();
}

Но результатвсе еще непрозрачный, не прозрачный:
enter image description here

1 Ответ

0 голосов
/ 02 октября 2018

Демонстрация наложения прозрачного фона на видео: 

#include <QApplication>
#include <QGraphicsView>
#include <QGraphicsScene>
#include <QGraphicsVideoItem>
#include <QMediaPlayer>
#include <QFileDialog>
#include <QPushButton>
#include <QLabel>
#include <QGraphicsProxyWidget>

#define VideoSize 500, 500

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);

    QMediaPlayer player;
    QGraphicsView v;
    QGraphicsScene scene;
    QGraphicsVideoItem video;
    v.setScene(&scene);
    video.setSize(QSizeF(VideoSize));
    scene.setSceneRect(0, 0, VideoSize);
    scene.addItem(&video);
    player.setVideoOutput(&video);
    player.setMedia(QMediaContent(QFileDialog::getOpenFileUrl()));

    // Recommend using QGraphicsItems for overlay component
    QGraphicsTextItem text("Loading...",&video); 
    text.setPos(100, 150);

    // If you need a button...
    QPushButton button("ButtonTest");
    QGraphicsProxyWidget* proxyButton = scene.addWidget(&button);
    proxyButton->setPos(100, 200);

    // Instead of QGraphicsItems, if you really need a QWidget...
    QLabel label("LabelTest");
    label.setAttribute(Qt::WA_TranslucentBackground); // You can delete this line to see different
    QGraphicsProxyWidget* proxyLabel = scene.addWidget(&label);
    proxyLabel->setPos(100, 250);

    v.show();
    player.play();

    return a.exec();
}
...