Why does the border of QWidget cover the contents?

Question

I have a custom widget derived from QWidget, which has a minimumSize of (30, 30) and a QLabel as a childWidget:

MyWidget::MyWidget (QWidget *parent, QPoint p,
                  QWidget *childWidget) : QWidget (parent)
{
    childWidget = this->childWidget;
    setAttribute (Qt::WA_DeleteOnClose);
    this->move (p);
    verticalLayout = new QVBoxLayout (this);

    if (childWidget != NULL)
    {
        childWidget->setParent (this);
        childWidget->releaseMouse();
        childWidget->setAttribute (Qt::WA_TransparentForMouseEvents,     true);
        verticalLayout->addWidget (childWidget);
    }
    this->setLayout(verticalLayout);
};

MyWidget::mouseMoveEvent (QMouseEvent *e)
{
    if (! (e->button() == Qt::RightButton))
    {
        this->update();
        this->raise();
    }
}

void MyWidget::mouseReleaseEvent (QMouseEvent *evt)
{
    QWidget::mouseReleaseEvent(evt);
    this->update();
}

MyWidget::mousePressEvent (QMouseEvent *e)
{
    if (! (e->button() == Qt::RightButton))
    {

        this->update();
        this->raise();
    }
}

void MyWidget::paintEvent(QPaintEvent *)
{
    QPainter painter(this);
    painter.setRenderHint(QPainter::Antialiasing);
    painter.setPen(Qt::darkGreen);
    painter.drawRect(1, 2, 6, 4);
    painter.setPen(Qt::darkGray);
    painter.drawLine(2, 8, 6, 2);
}

//And some getter/setter methods.

In order to set a border to the widget I use the following code:

 customWidget->setStyleSheet("*{border-width:" +
    2 +
    ";border-style:solid;border-color:" +
    #FFFFFF + " ;color:white;}");

It looks like this (the parent widget has an orange background):

.

When I change the border-width to 10, the border covers the contents:

Both images show the widget in its minimum height.

To me it looks as if the border were applied inwards. What shall I modify to point the border outwards, so for a larger border-width the text remains visible?

Prevent the widget from being shrunk by setting its minimum size to an appropriate value using [`QWidget::setMinimumSize`](http://doc.qt.io/qt-5/qwidget.html#setMinimumSize-1). — scopchanov, Oct 08 '18 at 11:46
My custom widget already has a MinimumHeight and MinimumWidth.The pics(1 & 2) above are with the widget in its MinimumHeight.But for this height,when I set a border-width of 10,it is like pic2.Is there anyway by which I can make the border go outwards?? — adi, Oct 08 '18 at 11:58
The border does go outwards. See here: https://i.stack.imgur.com/EqClz.png You have a problem with the size. — scopchanov, Oct 08 '18 at 12:01
I tried setting the MinimumSize.But for that Minimum Size,when I set a bigger border-width,the same problem exists!! — adi, Oct 08 '18 at 12:05
What is the type of `customWidget`? What is the minimum size you set? — scopchanov, Oct 08 '18 at 12:09
I have set Minimize size as (30,30).Its just a normal custom widget with mouseEvents!! — adi, Oct 08 '18 at 12:22
(30, 30) is too small for this border. See here: https://i.stack.imgur.com/6cjmO.png Set a reasonable size, e.g. (100, 50). — scopchanov, Oct 08 '18 at 12:31
Alternatively you might implement `sizeHint` and `minimumSizeHint` of your widget in order to calculate the required size automatically. See how it is done in [QLabel](https://code.woboq.org/qt5/qtbase/src/widgets/widgets/qlabel.cpp.html#_ZNK6QLabel8sizeHintEv) for example. — scopchanov, Oct 08 '18 at 12:34
Why should we implement them?I cant understand the given link! — adi, Oct 08 '18 at 14:24
Setting the minimum size is not flexible, meaning, that it does not account for changes in the widget's content. If the `sizeHint` is implemented though, the necessary space will be reported whenever needed. — scopchanov, Oct 09 '18 at 10:08
I suggest you to show your custom widget class. Perhaps I would be able to propose an implementation of the size hint. — scopchanov, Oct 09 '18 at 18:46
Hi scopchanov,I have attached my custom Widget implementation.Apologies for a late response.. — adi, Oct 17 '18 at 09:55
please have a look at the edit:I have updated the constructor — adi, Oct 17 '18 at 10:09
How does the code you have provided produce the result shown in the image? — scopchanov, Oct 17 '18 at 10:26
Th orange is the Bg color set to the parent .Whereas my label is the childWidget to which I have already set text.Both of them are being passed as constructor arguments . — adi, Oct 17 '18 at 10:37
I am sorry, but I am still not able to reproduce the issue. For me the border is correct. See [here](https://i.stack.imgur.com/VBmNd.png). If you want to get help with your issue, you have to make it reproducible. For that purpose create a [Minimal, Complete, and Verifiable example](https://stackoverflow.com/help/mcve). — scopchanov, Oct 17 '18 at 10:52
In addition I have set the minimum width and height to (30,30) .Now ,the border will hide the label — adi, Oct 17 '18 at 17:16
But as per my requirement,I have this minimum size and for this size we need to set border also. — adi, Oct 17 '18 at 17:37
I hope you do realize that `30 - 2*10` (the minimum height - 2 times the width of the border) equals `10`. Your font is larger than 10px, so how do you imagine to fit it in the remaining space? — scopchanov, Oct 17 '18 at 21:16
oh..now I understand the actual problem.I will accept it as an answer.Could you add this. — adi, Oct 18 '18 at 09:13

score 2 · Accepted Answer · edited Jun 20 '20 at 09:12

2

Cause

The border does go outwards:

You have a problem with the size. (30, 30) is too small for this border. 30 - 2*10 (the minimum height - 2 times the width of the border) equals 10. Your font is larger than 10px, so it does not fit in the remaining space.

Solution

You might want to set a reasonable size, e.g. (100, 50). However, setting the minimum size is not flexible, meaning, that it does not account for changes in the widget's content. If the sizeHint and minimumSizeHint are implemented though, the necessary space will be reported whenever needed, as it is done in QLabel for example.

Since you already have a QLabel as a child widget, just avoid setting the minimumSize of your custom widget and the correct size will be calculated automatically.

edited Jun 20 '20 at 09:12

Community

1
1

answered Oct 18 '18 at 10:22

scopchanov

7,966
10
40
68

I would like to have a custom implementation of sizehint like the one you have shared,but as Im new to qt,Im unable to understand it;Could you share some tutorials or book so that I can understand and implement on my own!! – adi Oct 18 '18 at 10:42
@adi, [size hint is the preferred size of the widget, layouts will try to keep it as close to this as possible.](https://stackoverflow.com/a/20328179/5366641). Basically you have to return a `QSize`, which you calculate based on the widget space requirements, e.g. border width, margins, padding and contents. If you post a new question with a particular example content, I will try to implement a `sizeHint` for you. – scopchanov Oct 18 '18 at 10:49

Why does the border of QWidget cover the contents?

1 Answers1

Cause

Solution

Linked