Transparency of QDeclarativeView containing QML on top of a QWidget playing a video (using either phonon or libvlc).

  • I am currently developing a video player.

    The GUI as the topmost layer is written in QML.
    It should be transparent to lower layers.

    It contains control elements, some Lists etc.,
    It's displayed using a QDeclarativeView.

    Source extract:

    @ QDeclarativeView *upperLayer = new QDeclarativeView(this);
    upperLayer->setStyleSheet(QString("background: transparent");


    The layer underneath is a QWidget.

    I use the libvlc to display the video content
    in this widget.

    Reason: I am receiving mpeg2-ts, which can not be decoded by phonon, afaik.
    Therefore I need the libvlc to decode the incoming *.ts stream and put the output onto the display.

    Source extract:

    @QWidget *lowerLayer = new QWidget(this);
    lowerLayer.setGeometry(QString("background: red"));
    QUrl* url = new QUrl("file:///home/projects/QtVideo/video.ts");
    vlcPlayer = NULL;
    if(vlcObject = libvlc_new(argc, argv)) == NULL)
         printf("Not able to initialize";
    if(vlcPlayer && libvlc_media_player_is_playing(vlcPlayer))
    vlcPlayer = libvlc_media_player_new(vlcObject);
    vlcMedia = libvlc_media_new_location(vlcObject, url.toString().toUtf8().constData());
    libvlc_media_player_set_media(vlcPlayer, vlcMedia);
    #if defined(Q_OS_MAC)
         libvlc_media_player_set_nsobject(vlcPlayer, lowerLayer->winId());
    #elif defined(Q_OS_UNIX)
         libvlc_media_player_set_x_window(vlcPlayer, lowerLayer->winId());
    #elif defined(Q_OS_WIN)
         libvlc_media_player_set_hwnd(vlcPlayer, lowerLayer->winId());

    Both Elements, the QDeclarativeView and the QWidget
    are embedded in a QMainWindow, lowerLayer created before the upperLayer,
    upperLayer Transparent to the lowerLayer.

    The Problem:

    As long as the lowerLayer is displaying static elements such as a picture, or some colored shapes, everything works fine, full transparency and funtionality.

    As soon as I start displaying a video, such as the described *.ts using the libvlc OR some random video using the Phonon::VideoPlayer, the parts of the upperLayer which are above the video parts of the lowerLayer are displayed in the color of the lowerLayer(default: gray),
    the parts of the upperLayer which are positioned above parts of the lowerLayer or others which do not contain video elements are displayed in correct behaviour.


    Is there any posibility and if so, how, to get the upperLayer transparent, even if there is a video playing?

    Kind regards and thanks in advance,


  • I had the same problem and after some fiddling about I found out that setting the autoFillBackground property of the viewport to false helps at least for me. I have an ordinary widget underneath tough. Don't know whether it works with a video.

    Just add
    @ after setting the qml source.

  • I am experiencing the same problem and
    "upperLayer->viewport()->setAutoFillBackground(false)" doesn`t help.

    Anyone found a solution so far?

  • Can you post a small example?

Log in to reply