Qt4: Decorating a QLineEdit (painting around it)

Question

I am trying to "decorate" a QLineEdit , or to be more accurate, to paint my own custom frame around it, to get the following result:

I tried to use Qt Style Sheets (CSS), but this will only enable trivial frame decorating (changing width/color/size etc...), nothing fancy like the above.

I also tried inheriting from QLineEdit and overriding its void QLineEdit::paintEvent(QPaintEvent* e) , but then I realized that reimplementing it means I will lose the QLineEdit s "editness" (sorry for butchering the language here) - the textbox, the cursor, and the ability to insert text.

How can I achieve the above text box?
Is this a combination of QLabel perfectly located behind a QLineEdit ?

Answer 1

Try to use composition. Create your own Widget inherited it from QWidget , paint what you want in QWidget::paintEvent and place QLineEdit above it. Probably you'll have to center it and use css for QLineEdit to make it look smooth.

class MyWidget: public QWidget
{
explicit MyWidget(QWidget* parent = 0):
QWidget(parent),
line_edit(new QLineEdit(this))
{
     //  place line_edit in center of QWidget
}

private: 
QLineEdit* line_edit;
}

Or you can override void QLineEdit::paintEvent(QPaintEvent* e) like this

void QLineEdit::paintEvent(QPaintEvent* e)
{
      //paint your border
      QLineEdit::paintEvent(e);
}

And you won't lose the QLineEdits "editness".