Stylesheets for widgets on a Dynamic GUI

Sh1gs

Hello,

I am working on a project for work. Currently, I'm adding widgets to a dialog screen at runtime and using stylesheets to see how certain properties are changed. I am adding a QTableWidget, QPushButton, QTextEdit, QLineEdit, and QLabel, but I am having difficulty with the QTextEdit and QLineEdit. I currently have their stylesheets set to have the background as transparent. However, I'd like the background the be white when the widget has the focus.

I've tried:
tstTextEdit->setStyleSheet("QTextEdit:Focus{background:white};");
But this doesn't seem to work since my application builds the dialog screen at runtime. I'm still learning the intiricacies of QT, so any help would be much appreciated. Thanks!

mostefa

Hi @Sh1gs , i think that you have to reimplement your paintEvent function, of your dialog class with the following code:

void YourDialogClass::paintEvent(QPaintEvent *ev)
{
    QStyleOption o;
    o.initFrom(this);
    QPainter p(this);
    style()->drawPrimitive(
      QStyle::PE_Widget, &o, &p, this);
}

this is usually used to force custom class to support stylesheet,keep me informed if it works

Sh1gs

Hello @mostefa, thank you for your quick reply. For further information, I am doing something very similar to this QT Example: Config Dialog. I create my main Dialog screen similar to that of the configdialog.cpp style. I am adding my widgets on a "page" like that of the pages.cpp file. Is it here that I would reimplement the paintEvent? Also, how would I handle checking whether the widget has the focus or not?

For instance, when the application runs, I see all of my widgets on the screen. When I click on the QTextEdit box, it should now have the "focus" and do the logic like changing the background to white. Is this something I also need to add in the paintEvent? Like:

if(tstTextEdit->hasFocus() == true)
{
    tstTextEdit->setStyleSheet("QTextEdit:Focus{background:white};");
}

I apologize if I am not explaining things more clearly, I am confused with how and where to implement the paint function.

mostefa

@Sh1gs Yes you have to add paintEvent on your pages class

and add it just like that:

on your pages.h

void paintEvent(QPaintEvent *ev);

on your pages.cpp

void pages::paintEvent(QPaintEvent *ev);
{
    QStyleOption o;
    o.initFrom(this);
    QPainter p(this);
    style()->drawPrimitive(
      QStyle::PE_Widget, &o, &p, this);
}

and test !

SGaist

Hi,

Why set that part of the style sheet when the textedit gets the focus ? Set it directly when you created the widget. Focus in that context is a pseudo state that should be detected for you so there's no need for you to do it like that.

@mostefa there's no need to reimplement the paintEven unless you do something special no supported by the style.

Sh1gs

Hi @SGaist

Since I have multiple widgets on my application, I don't want the TextEdit to have automatic focus. I am building a simple application for the time being to see how the different widgets react to their own stylesheet as well as a parent stylesheet because that methodology will be used in my actual work project.

My actual project will have multiple textedits, lineedits, labels, etc on one page, so I need to figure out how to go about checking if one of the textedits has the focus, then to change the background on it accordingly. I unfortunately cannot go into much further detail than that, since that's the nature of my job.

This brings me to why I am still confused as to how to go about implementing it. From things that I've read in other forums, I assume that I would need something like a mousePressEvent or something similar?

mostefa

@Sh1gs

We are missing of something through your explanation, i tried an example which work for me without any problem, this is my sample code:

I have a mainWindow that containt QTextEdit named textEdit,

code of MainWindow.cpp

#include "mainwindow.h"
#include "ui_mainwindow.h"


//MainWindow constructor
MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    //Here define stylesheet for textEdit

setStyleSheet("QTextEdit{background: transparent}/** When we have QTextEdit , background will be transparent**/"
                  "QTextEdit:focus{background: yellow} /** When QTextEdit is focused, background will be white**/ ");
}

MainWindow::~MainWindow()
{
    delete ui;
}

Hope this can help you, if no , i am waiting for more informations!

Sh1gs

@mostefa

This works if you're using the designer to add the widget, I am not doing it this way. I am creating my widgets at runtime, so more logic is needed in order to do what I want to do. As I've stated before, because of the nature of my job, I cannot explain more than I already have. I appreciate your help, but I will continue to research this.

SGaist

There's no automatic focus here. That stylesheet pseudo state will be activated when the widget gets the focus. Whether you clicked on it or did it programmatically doesn't matter so you don't have to do any special manipulation. Just like the example of @mostefa is showing.

mrjj

Hi
If you make your stylesheets correctly, they are cascading so they work for
dynamically added widgets as well.
So if the PARENT of the widget you insert have a stylesheet targeting the
type of the child widget, it will automatically be affected.

So any child of MainWindow that is a QTextEdit will be affected following @mostefa sample.

Sh1gs

Unfortunately this does not work for me. However, I tried using an eventFilter and that worked the way I wanted it to. I appreciate everyone's input and will now mark this as solved.

racerXali

Try this , where you create ur control "dynamically"

QLineEdit * m_edit=new QLineEdit(this);
m_edit->setStyleSheet(":focus{background:white}"); /*this should set the stylesheet*/