How to create a partially transparent overlay widget?

[neuclic]

I have a stacked layout with two widgets, stacked mode is set to all, widget in blue in the pic is the baselayer, and in pink is the overlay widget(actually it takes up the whole window but my intend is to limit it to the pink area); overlay wiget has two children, one is stretch and the other is a widget; I want to interact with both layers at the same time, so I try to set the stretch of the overlay widget to be transparent and set attribute transparent for mouse event mode, while maintaining the pink widget's state; but I found out I could just either set the entire overlay widget to transparent mode or not; does anybody have ideas? thx a lot

Code snippet:

QHBoxLayout *secondLayer = new QHBoxLayout(tab1);
    secondLayer->addStretch(1);
    secondLayer->addWidget(friendsListWidget);
    secondWidget = new QWidget();
    secondWidget->setLayout(secondLayer);
    friendsListWidget->setFixedWidth(200);
    secondWidget->setAttribute(Qt::WA_TransparentForMouseEvents);
    friendsListWidget->setAttribute(Qt::WA_TransparentForMouseEvents, false);
    secondWidget->setStyleSheet("background-color: transparent;");


    QStackedLayout *stackedLayout = new QStackedLayout(tab1);
    stackedLayout->setStackingMode(QStackedLayout::StackAll);
    stackedLayout->addWidget(secondWidget);
    stackedLayout->addWidget(firstlayerWidget);

    firstlayerWidget->setVisible(true);
    secondWidget->setVisible(true);