QCustomPlot rounded corners stylesheet without border-radius

[lukutis222]

Hello. I use QCustomPlot library to draw a graph in my application. QcustomPlot is promoted from QWidget.

I want to make my QCustomPlot graph with rounded corners. I opened the StyleSheet of the QCustomPlot from thei mainwindow.ui and put the following :

border: 1px solid;
border-radius:30px;
background-color: rgb(0, 255, 255);
padding: 5px;

From looking at the mainwindow.ui, I can see that the corners are rounded:

However, when I build and run the application, corners are no longer rounded and the background color is not blue.

This is what it looks like when the application is launched:

In my mainwindow.cpp I call the following funciton to initialise graph:

void MainWindow::setup_graph(QCustomPlot *customPlot)
{

    current_upper_limit = 50;
    current_lower_limit = 0;



  //SETUP GRAPH 0
    customPlot->addGraph();
    customPlot->graph(0)->setScatterStyle(QCPScatterStyle::ssCircle);
    QPen pen_current;
    pen_current.setWidth(2);
    pen_current.setColor(QColor(80, 200, 120));
    customPlot->graph(0)->setPen(pen_current);
    //SETUP GRAPH 1
    customPlot->addGraph();
    customPlot->graph(1)->setScatterStyle(QCPScatterStyle::ssCross);
    QPen pen_voltage;
    pen_voltage.setWidth(2);
    pen_voltage.setColor(QColor(64, 224, 208));
    customPlot->graph(1)->setPen(pen_voltage);


    customPlot->graph()->setLineStyle(QCPGraph::lsLine);
    customPlot->xAxis->setLabel("Time(s)");
    customPlot->yAxis->setLabel("Current/Voltage(mA/V)");
    customPlot->xAxis->setRange(0,30);
    customPlot->yAxis->setRange(current_lower_limit,current_upper_limit);

    customPlot->legend->setVisible(true);
    customPlot->graph(0)->setName("Current");
    customPlot->graph(1)->setName("Voltage");


    ui->customPlot->setInteractions(QCP::iRangeDrag | QCP::iRangeZoom | QCP::iSelectPlottables | QCP::iMultiSelect);
    //QCustomPlot::setSelectionRectMode
    //ui->customPlot->setSelectionRectMode(QCP::srmSelect);


    ui->customPlot->graph(0)->setSelectable(QCP::stDataRange);
    //ui->customPlot->graph(0)->setSelection()
    ui->customPlot->graph(1)->setSelectable(QCP::stDataRange);



    foreach(QCPAxisRect *rect, ui->customPlot->axisRects()){
       rect->setRangeDrag(Qt::Horizontal);
       rect->setRangeZoom(Qt::Horizontal);
    }


}

I would like to know if there is any way to round the corners for the QCustomPlot widget. I have been reading up on the google and figure out that QWidget does not support border-radius. Since QCustomPlot is promoted from the QWidget I also think that it does not support border-radius.

How come it shows up as rounded corners in mainwindow.ui if it does not support border-radius? Additionally, how come it shows up as blue background but when I launch the application is actually white? Something does not seem right, it feels like it is not applying the stylesheets properly.

Does it matter if this QCustomPlot widget is placed withing horizontal layout? Maybe that could be an issue?

Please suggest how can I make rounded corers for my QCustomPlot graph. Any ideas are appreciated, thanks in advance.

[Pl45m4]

@lukutis222 said in QCustomPlot rounded corners stylesheet without border-radius:

From looking at the mainwindow.ui, I can see that the corners are rounded:

However, when I build and run the application, corners are no longer rounded and the background color is not blue.
This is what it looks like when the application is launched:

Just because you've set a stylesheet to the widget in the place of QCustomPlot, it doesn't mean that the stylesheet is also applied to your plot.

The same question was discussed in QCustomPlot forum here:

• https://www.qcustomplot.com/index.php/support/forum/1432

How come it shows up as rounded corners in mainwindow.ui

Because QtDesigner is a "dumb" tool (not in terms of "bad", but it doesn't know about logic and the code you add later, when your widget is replaced with QCustomPlot)
It's a WYSIWYG editor.
When opening your mainWindow.ui in design mode, there is still just a plain QWidget, which is styled according to the stylesheet you've set.

Something does not seem right, it feels like it is not applying the stylesheets properly.

When rendering/painting the QCustomPlot, the stylesheet is probably ignored/not supported. For more information you should check the QCustomPlot documention and forum, since it's a third-party tool.

• https://www.qcustomplot.com/documentation/index.html

Does it matter if this QCustomPlot widget is placed withing horizontal layout? Maybe that could be an issue?

No, definitely not the issue.