Custom Titlebar, Top-left, right border rounded; But left over part still visible

[rawfool]

I've implemented a custom titlebar using QToolBar. I've applied the style to it as shown below.

this->setStyleSheet("background: #646464; border: 0px; border-top-left-radius: 10px; border-top-right-radius: 10px;");
Now I got the rounded edges, but the left-over part after the border-radius is still visible. How do I "cut" it or How do I make it transparent ?
Thank you.

[pradeepreddyg95]

paste the screen shot of your gui

[rawfool]

Hi Pradeep,
PFB the screenshot of TitleBar with rounded top-edges, with the residue part.
Thank you.

8946

[pradeepreddyg95]

set same stylesheet for your base widget to cut top edges.

[rawfool]

Hi Pradeep,

I did apply the same stylesheet to the base widget also. But no luck. Pls find the code below. Thank you.



CTitleBar::CTitleBar(QWidget *parent) :
QToolBar(parent)
{
this->setFixedHeight(24);
this->setWindowOpacity(100);
this->setStyleSheet("background-color: #646464; border: 0px; border-top-left-radius: 8px; border-top-right-radius: 8px;");
this->setContentsMargins(0, 0, 0, 0);
setWidgetStyling();
connect(closeButton, SIGNAL(clicked()), this, SIGNAL(sig_CloseButtonClicked()));
}

void CTitleBar::setWidgetStyling()
{
holderWidget = new QWidget;
holderWidget->setStyleSheet("background-color: transparent; border-top-left-radius: 8px; border-top-right-radius: 8px;");
holderWidget->setMouseTracking(true);
holderWidget->setContentsMargins(0, 0, 0, 0);
this->addWidget(holderWidget);

titleLyt = new QHBoxLayout();
titleLyt->setContentsMargins(0, 0, 0, 0);
holderWidget->setLayout(titleLyt);

closeButton = new QToolButton();
closeButton->setMouseTracking(false);
closeButton->setText("X");
closeButton->setContentsMargins(0, 0, 0, 0);
closeButton->setToolButtonStyle(Qt::ToolButtonTextOnly);
closeButton->setFixedSize(20, 20);
closeButton->setStyleSheet("QToolButton { color: white; font-size: 12px; background: #ec6c3f; border: 0px; border-radius: 8px;}"
"QToolButton: hover { color: lightGray; background: #e44d2e; padding: 0px; border: 2px solid #f9d654;}"
"QToolButton: pressed {color: lightGray; font-size: 9px; background: #ec633f; border: 0px solid #f9d456;}");

titleIcon = new QLabel();
titleIcon->setPixmap(QPixmap(TRAY_ICON));
titleIcon->setStyleSheet("border: none; background: transparent;");

titleText = new QLabel(APP_NAME);
titleText->setContentsMargins(0, 0, 0, 0);
titleText->setStyleSheet("color: orange; font: Arial; font-weight: bold; font-size: 12px");

titleLyt->addWidget(titleIcon);
titleLyt->addWidget(titleText, 2);
titleLyt->addWidget(closeButton);
}

[pradeepreddyg95]

where your creating instance for CTitleBar set stylesheet for that widget.
CTitleBar *pToolbar = new CTitleBar (this);
this->setStyleSheet("background-color: transparent; border-top-left-radius: 8px; border-top-right-radius: 8px;");
should work ...

[Santosh Reddy]

I guess you are using the CTitleBar to replace the system provided title bar by using setWindowFlags(Qt::FramelessWindowHint) on the top level widget. In such case you also need to set the translucent attribute setAttribute(Qt::WA_TranslucentBackground); on the top level widget.