音量调节弹窗 自定义组件qt

1. Qt::Popup 无边框，无标题栏

模态行为：点击窗口外部，窗口自动关闭

2. Qt::FramelessWindowHint

无边框

volumeSlider::volumeSlider(QWidget *parent) : QWidget(parent, Qt::Popup | Qt::FramelessWindowHint)

3. Qt::WA_WindowPropagation 弹窗事件可以传递给父窗口

配合Qt::Popup 处理父子层级、焦点传递、防止弹窗莫名消失

setAttribute(Qt::WA_WindowPropagation);

volumeSlider::volumeSlider(QWidget *parent) : QWidget(parent, Qt::Popup
            | Qt::FramelessWindowHint)
{
    setAttribute(Qt::WA_WindowPropagaion);

    QVBoxLayout *vbox = new QVBoxLayout(this);
    setLauoyt(vbox);

    QSlider *slider = new QSlider(this);
    slider->setRange(0, 100);
    slider->setValue(50);
    vbox->addWidget(slider);

    vbox->setContentsMargins(12, 12, 12, 12);

    setFixedSize(240, 80);
    connect(slider, &QSlider::sliderReleased, this, [this, slider](){
        int value = slider->value();
        emit sendValue(value);
    });

}

void volumeSlider::showAboveWidget(QWidget *btn)
{
    QPoint globalPos = btn->mapToGlobal(QPoint(0, 0));
    int x = globalPos.x() + btn->width() - width();
    int y = globalPos.y() - 80;
    
    this->move(x,y);
    this->show();
}

qss

/* ==========8. volumeSlider弹窗（volumeSlider类，Qt::Popup 弹窗）内部的音量滑块 ========== */
/* volumeSlider 是QWidget，弹窗顶层，它内部的水平QSlider，没有objectName，用后代选择器 */
volumeSlider QSlider::groove:horizontal {
    height:5px;
    background:#cccccc;
    border-radius:2px;
}
volumeSlider QSlider::handle:horizontal {
    width:10px;
    height:12px;
    margin:-3px 0;
    background:#222222;
    border-radius:5px;
}
volumeSlider QSlider::sub-page:horizontal {
    background:#27ae60;
}

/* 音量弹窗本身的背景，volumeSlider继承QWidget */
volumeSlider{
    background-color:#f7f7f7;
    border:1px solid #bbbbbb;
    border-radius:6px;
}