Removing borders from QWidgets in a QGraphicsGridLayout - c++

I currently have a QGraphicsScene that I am using with a QGraphicsGridLayout. I am trying to align QWidgets (QLabels and a custom graph QWidget) on this grid layout, and then export it to a QPrinter for pdf export.
The problem I'm having is that I have these grey divider lines between the QLabels that I can't seem to get rid of. I have tried settings spacing in the layout to 0, margins to 0, all the different properties of the QLabel palette, etc. all to no avail. Here's the relevant code:
main class:
QLabel lbl("some text");
lbl.setAutoFillBackground(true);
QPalette pal = lbl.palette();
pal.setColor(QPalette::Window, Qt::white);
lbl.setPalette(pal);
lbl.setFrameStyle(QFrame::NoFrame);
reportlayout->addWidget(&lbl);
reportlayout->generatePDF(reportfilename);
reportlayout class:
gridlayout->setContentsMargins(0,0,0,0);
gridlayout->setSpacing(0);
QGraphicsWidget* page = new QGraphicsWidget();
page->setLayout(gridlayout);
scene->addItem(page);
printer->setOutputFileName(filename);
painter->begin(printer);
scene->render(painter);
painter->end();
I have a feeling that it is the layout doing this, as the lines are between cells in the grid - but the layout doesn't have any color properties and I couldn't find anything to do with divider lines.
Thanks a bunch!

Have you tried stylesheets?
For example,
setStylesheet("QLabel { border:0px solid black; }");
You must investigate all possible selectors till find which one introduces the border.

Related

How can I style a QTabWidget without affecting the tabs/widgets inside?

I have a QTabWidget with two tabs inside. I want to set the background of both tabs to be transparent to see the color of the main window underneath, but when I set
QTabWidget *tabWidget = new QTabWidget(this);
tabWidget-setStyleSheet("background-color: transparent;");
it makes all the background of the widgets I have inside the tabs transparent, not the tab itself.
Album showing before stylesheet change:
after change,
and what I'm trying to achieve.
I can provide more code if needed. Thanks in advance!
Stylesheets are applied to touched widgets and all its children.
Currently your style definitions
QTabWidget *tabWidget = new QTabWidget(this);
tabWidget-setStyleSheet("background-color: transparent;");
says something like "Set background color for all widgets to transparent".
... but you can restrict stylesheet applicability.
E.g. you can say, that style definitions should be applied only to instances of certain classes like QLabel:
QTabWidget *tabWidget = new QTabWidget(this);
tabWidget-setStyleSheet("QLabel{ background-color: transparent; }");
There are even more possibilietes to define applicability in more details:
The Qt Style Sheet Syntax, Selector Types
Relevant for your case is the possibility to restrict the applicability of style definitions to objects with certain name:
QTabWidget *tabWidget = new QTabWidget(this);
tabWidget-setStyleSheet("QWidget#custom_tab, QWidget#templates_tab{"
" background-color: transparent; "
"}");
You must make sure, that object names match (here: 'custom_tab' and 'templates_tab'.

Design QFrame and QSizeGrip

I created a QFrame and added a layout which contain QSizeGrip to resize that QFrame.
Here is my code.pp:
DragWidget::DragWidget(QWidget *parent)
: QFrame(parent)
{
setFrameStyle(QFrame::Sunken | QFrame::StyledPanel);
//Set flag to resize
setWindowFlags(Qt::SubWindow);
QGridLayout *layout = new QGridLayout(this);
layout->setContentsMargins(QMargins());
layout->setSpacing(0);
//Add size grip (to resize) to layout
QSizeGrip * sizeGrip = new QSizeGrip(this);
layout->addWidget(sizeGrip, 0, 0, 1, 1, Qt::AlignBottom | Qt::AlignRight);
}
I want to design that QFrame has a background like this:
Moreover is there any way to customize the icon resize of QSizeGrip (make it more clearly...).
You can customize the QSizeGrip using style sheet.
Here an example: Customizing QSizeGrip
Here the Qt style sheet documentation: Qt Style Sheets
In your case you can add this line of code:
sizeGrip->setStyleSheet("QSizeGrip { image: url(yourFolder/yourImage.png); }");
In a similar way you can customize the QFrame background, setting an image that will be repeated. See Customizing QFrame and List of properties
EDIT
Another approach is subclassing the QSizeGrip and reimplement the paintEvent() method (and maybe sizeHint() depending on the icon size). Here an example Analog Clock Example

Making QMessageBox InformativeText Bold and increase font size

In my qt C++ gui application, I have a QMessageBox with 3 buttons and some standard functionality. I want to decorate all these with stylesheets and fonts and what not.
I am successfully able to do the following -
i. Set MessageBox background.
ii. Set Button background.
void MainWindow::on_pushButton_clicked()
{
QMessageBox msgbox;
msgbox.setInformativeText("YOLO");
msgbox.setStandardButtons(QMessageBox::Ok|QMessageBox::No|QMessageBox::Cancel);
msgbox.setWindowFlags(Qt::FramelessWindowHint);
msgbox.setStyleSheet("QMessageBox { background-image: url(:/res/bk.jpg) }");
msgbox.button(QMessageBox::Ok)->setStyleSheet("QPushButton { background-image: url(:/res/green_bk.jpg) }");
msgbox.button(QMessageBox::No)->setStyleSheet("QPushButton { background-image: url(:/res/red_bk.jpeg) }");
msgbox.exec();
}
But I am stuck on how to set a font (type and size) to the InformativeText field, and also how to make it Bold. I have referred to the InformativeText Properties but I am unable to sort things out. Any ideas on how to achieve this ? Thanks.
As an added query, can I change the fonts (type and size) of buttons as well and set Bold Italics etc ?
EDIT
I did the following changes to my code, and the results are baffling,
QFont font;
font.setBold(true);
msgbox.setFont(font);
After doing this, my informationText has become bold, my cancel button has become bold. But the Ok and No buttons are normal (non-bold). If I remove the setStylesheets for the two buttons, only then are they becoming bold (which is useless, since I want background images).
Any ideas to have a synergy in all these ???
I found solution for your problems.
QMessageBox msg(QMessageBox::Information,"Hey", "Dude", QMessageBox::Ok);
QFont font;
font.setBold(true);
msg.setFont(font);
msg.button(QMessageBox::Ok)->setFont(font);
msg.exec();

Qt Set Background Color of QLineEdit

I'm trying to change the background color of the QLineEdit and I can't figure it out at all.
I tried using stylesheets originally like this
QLineEdit *le = new QLineEdit();
le->setStyleSheet("background:#000;");
but that didn't do anything. I tried using QPalette like this
QPalette palette;
palette.setColor(QPalette::Base, Qt::black);
palette.setColor(QPalette::Background, Qt::black);
le.setPalette(palette);
but this didn't do anything either. I've been looking all day and can't find anything. am I doing something wrong or is there another way to do it?
You can set the background and text colors of line edit by setting the palette like :
QLineEdit *le = new QLineEdit();
QPalette palette;
palette.setColor(QPalette::Base,Qt::black);
palette.setColor(QPalette::Text,Qt::white);
le->setPalette(palette);
Works fine for me:
QLineEdit *le = new QLineEdit();
le->setStyleSheet("QLineEdit { background: rgb(0, 255, 255); selection-background-color: rgb(233, 99, 0); }");
Your code is almost correct. Only QLine edit uses the Base color. So if you do not want to replace existing stylesheet which can contain borders padding and margin and you want to change background only, use QPalette:
QPalette palette = _ui->lnSearch->palette();
palette.setColor(QPalette::Base, Qt::green);
_ui->lnSearch->setPalette(palette);
Thanks to: https://forum.qt.io/topic/64568/why-setting-background-color-of-qlineedit-has-no-effect
I had to use background-color from standard css like this:
QLineEdit* edit = new QLineEdit();
edit->setStyleSheet("QLineEdit {background-color: black;}");
I am using Qt 5.4

QToolButton and color

I'm trying to make a simple design to select a color and I'm using a QToolButton to open a QColorDialog.
My problem is that I would like the QToolButton to be of the selected color but I've only suceeded to set the background color, which is not what I want.
Here is a picture:
My code:
QColor color = QColorDialog::getColor(m_couleur);
if (color.isValid()) m_couleur=color;
m_labelCouleur->setPalette(QPalette(m_couleur));
m_labelCouleur->setAutoFillBackground(true);
m_buttonCouleur->setPalette(QPalette(m_couleur));
m_buttonCouleur->setAutoFillBackground(true);
Basically I would like the QToolButton to look something like this:
edit: Can anyone explain to me why the website won't let me add "Hi everybody" at the beginning?
QColor color = QColorDialog::getColor(m_couleur);
QPixmap px(20, 20);
px.fill(color);
m_buttonCouleur->setIcon(px);
No CSS involved in this case is (for me ofcourse) big pro
Use the setStylesheet function in order to change the background color of your button
m_buttonCouleur->setStyleSheet(QString("QToolButton{ background: %1; }").arg(m_couleur.name()));
I've done exactly that by using a QPushButton and setting its style sheet to the result from the color picker. I guess a tool button should probably be the same.
button->setStyleSheet(QString("background-color: %1; "
"border: 1px; "
"border-color: black; "
"border-style: outset;").arg(color.name()));