I'm currently working with Qt 5.7-5.8 in C++ and I'm trying to underline a QLabel with a solid black line underneath it. Knowing my QLabel is inside a QGridLayout, I've tried this piece of code but it isn't displaying the line.
mViewerLayout->itemAtPosition(0, 0)->widget()->setStyleSheet("border-bottom: 8px solid black");
I've tried setting the object name and setting the stylesheet through its objectName(), I've tried writing "QWidget" instead of "QLabel" inside the quotation marks of setStyleSheet() function call in the code sample below, and I've tried without using the objectName().
mViewerLayout->itemAtPosition(0, 0)->widget()->setStyleSheet("QLabel {border-bottom: 8px solid black;}");
If I set the stylesheet to border: 8px solid black, then it works and covers all borders of the QLabel, but I only want to underline it and border-bottom doesn't seem to work, even though I know that's how you specify the bottom border in CSS, and even Qt documentation seems to specify this syntax. Can someone please correct me?
How about something like this:
QLabel * lab = static_cast<QLabel *>(mViewerLayout->itemAtPosition(0, 0)->widget());
QFont f = lab->font();
f.setUnderline(true);
lab->setFont(f);
I think that just using the built-in underline functionality will be easier and give a better result than trying to fake it.
The following style sheet on the QLabel should do the trick:
border-bottom-width: 1px;
border-bottom-style: solid;
border-radius: 0px;
There might be a better way, but what I see is that if you do not specify the radius, the line is not shown.
Full code to show the working:
#include <QApplication>
#include <QLabel>
#include <QLayout>
int main(int argc, char *argv[])
{
QApplication a(argc, argv);
QWidget widget;
QVBoxLayout *l = new QVBoxLayout(&widget);
QLabel label;
label.setText("This text is underlined");
label.setStyleSheet("border-bottom-width: 1px; border-bottom-style: solid; border-radius: 0px;");
l->addWidget(&label);
l->addWidget(new QWidget());
widget.show();
return a.exec();
}
The result is:
Do you perhaps have other stylesheets set on your application that is conflicting with the style set on the label?
Related
I have a small qt application written in c++. I want the same application to run in small embedded device with a touchscreen but the size of few QToolButton was too small to be visible comfortably. I have tired to increase the size by modifying following function (adding setfont member call):
QToolButton* ColorToolBar::setupToolButton(QString name, QString iconPath, bool isCheckable)
{
QToolButton *p_btn = new QToolButton(this);
p_btn->setCheckable(isCheckable);
p_btn->setIcon(QIcon(iconPath));
p_btn->setIconSize(QSize(ICON_WIDTH, ICON_HEIGHT));
p_btn->setToolButtonStyle(Qt::ToolButtonTextBesideIcon);
QFont font = p_btn->font();
font.setPointSize(10);
p_btn->setFont(font);
if (!name.isEmpty())
p_btn->setText(name);
p_btn->setMinimumWidth(MINIMUM_WIDTH);
p_btn->setMinimumHeight(MINIMUM_HEIGHT);
return p_btn;
}
I am able to change the Icon size using setIconSize member function but setPointSize and setFont doesn't do anything. I want to have larger text and icon.
I have a class AdvancePlotToolBar which has all the QToolButton.My qss file looks like :
AdvancePlotToolBar QToolButton {
border: none;
padding-right: 10px;
padding-bottom: 5px;
}
AdvancePlotToolBar QToolButton:hover {
border-bottom: 3px solid #52ce90;
padding-bottom: 5px;
}
AdvancePlotToolBar QToolButton:pressed {
border-bottom: 3px solid #52ce90;
}
AdvancePlotToolBar QToolButton:checked {
border-bottom: 3px solid #52ce90;
margin: 0px;
}
EDIT:
The code below shows how I add QToolButton to the layout of AdvancePlotToolbar.
AdvancePlotToolBar::AdvancePlotToolBar(QWidget *parent) : QWidget(parent)
{
transformationButton_ = setupToolButton("Transformations", "://images//summation.png", true);
QHBoxLayout *layout = new QHBoxLayout;
layout->addWidget(transformationButton_);
setLayout(layout);
}
Setting a style sheet is overriding the font size you're setting in the C++ code. Try it w/out any style sheet applied (even to QApplication) and check. (Also How to set the font size of the label on pushbutton in Qt? )
I have the same issue with a completely custom QToolButton which overrides initStyleOption() and sets own font details in there (so it happens each time just before the button is painted, unrelated to setFont() at all). This works until an app-wide style-sheet is applied (even if it doesn't affect QToolButton directly! *), or a style sheet is applied specifically to the button instance or to its parent. I haven't tracked down where exactly this is happening (somewhere in QStyleSheetStyle I imagine), so I do not have a workaround yet **. In your case since you're using CSS for the tool button anyway, that would probably be best place to set the font size as well.
* The reason setting a style sheet may affect elements which are not styled specifically in the CSS rules is that the whole underlying QStyle is replaced with QStyleSheetStyle, and the original style (Fusion, WindowsVista, Macintosh, etc) becomes a proxy/fallback for QStyleSheetStyle. Or IOW all painting is filtered through the CSS style first. This includes setting style sheet on individual elements as well as globally on QApplication.
** I suspect this is a Qt bug.
I need to align elements on GUI: actually, a single label, but at the specific position. I know how to use QGridLayout, QHBoxLayout, I know how to change the font to have the specified size. However, I don't know how to align the label like on this picture below. Any advices?
Here is the most direct, but hardcoded way.
#include "widget.h"
#include <QLabel>
#include <QFont>
Widget::Widget(QWidget *parent)
: QWidget(parent)
{
QSize frameSize = this->frameGeometry().size() - this->geometry().size();
this->resize(frameSize + QSize(250, 125));
QLabel * label = new QLabel(this);// parenting instead of layouts
label->resize(130, 32);
label->move(60, 40);
QFont f = label->font();
f.setPointSize(16);
label->setFont(f);
label->setText("Sample");
label->setFrameStyle(QFrame::Box);
}
Widget::~Widget()
{
}
Layouts and alignments are a much better solution, but if you really want to give numbers to everything... Also look into using forms. It makes "hardcoding" sizes and layouts a lot easier.
Hope that helps.
If you want the proportions, but have it resizeable, you can use QBoxLayouts and the addStretch() method. Roughly you have a 1/2/1 proportion, so you first add a stretch with stretch 1, then your widget with stretch 2 and then another stretch with stretch 1. That would be for the horizontal layout, you would then take that layout and put it in a vertical layout with 1/1/1 stretches.
If you know abut layouts and how to use them than great.
To tweak this after you have a layout you should use a style sheet. Here are some examples. You can set a style sheet on QApplication.
QPushButton#buttonName {
margin-top: 30px;
margin-bottom: 30px;
margin-left: 60px;
margin-right: 60px;
min-width: 130px;
min-height : 32px;
}
PS. I know this is student homework :P
I'm trying to style the pop-up of a QComboBox.
Right now I have this pop-up:
I want to give it a border, so I insert the following code in my QComboBox class:
QWidget* popUp = findChild<QFrame*>();
popUp->setStyleSheet("QWidget {border: 1px solid rgb(74, 74, 74);}");
which gives me this result:
A pop-up with two borders: an internal one and an external one. And I only want the external one. Any ideas, thoughts or corrections?
Like Theolodis said, you just have to specify which QWidget you want to modify with your CSS.
popUp->setStyleSheet("QWidget#popUp {border: 1px solid rgb(74, 74, 74);}");
How can I load a style sheet (.qss style resource) globally with Qt?
I am trying to make things a bit more efficient than:
middleIntText -> setStyleSheet("QLineEdit { border: 1px solid gray;
border-radius: 5px;padding: 0 8px;
selection-background-color:darkgray;
height:40px;font-size:15px;}");
I thought the following would work at loading QLineEdit the one time for all QLineEdit widgets:
qss file:
QLineEdit { border: 1px solid gray;
border-radius: 5px;
padding: 0 8px;
selection-background-color:darkgray;
height:40px;
font-size:15px;}
cpp file:
QApplication a(argc, argv);
QFile stylesheet("formStyle.qss");
stylesheet.open(QFile::ReadOnly);
QString setSheet = QLatin1String(stylesheet.readAll());
a.setStyleSheet(setSheet);
Perhaps this is right and I am doing something else wrong?
You called QStyle * QApplication::setStyle ( const QString & style ) which requests a QStyle object for style from the QStyleFactory.
Instead, you should call void QApplication::setStyleSheet ( const QString & sheet ) which sets the application style sheet.
The above attempt is correct syntax but there are reasons it may not work.
Possible problems:
Source file(.qss) is not being retrieved
Incorrect top widget being chosen to apply cascade.
Syntax of the .qss (CSS) code.
Reason I had to ask my question above is I had two of these three issues. I first had to point to the files correct location and second I had to apply directly to QWidget.
QFile stylesheet("G:/Applications/Projects/ProspectTracker/formStyle.qss");
stylesheet.open(QFile::ReadOnly);
QString setSheet = QLatin1String(stylesheet.readAll());
QWidget::setStyleSheet(setSheet);
#Bill Thank for your assistance. He pointed out that I had posted .setStyle and not .setStyleSheet. The sample code above no longer reflects this but if I didn't change that nothing I did would have worked.
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()));