I would like to add push buttons to the layout. The newest item would be on the top of the layout.
I also would like position the buttons to the top, thus I am using QSpacerItem.
Here is what I have tried so far.
Constructor:
//frame is a QFrame
lVertical = new QVBoxLayout(frame); //private variable
lVertical->setMargin(0);
lVertical->setSpacing(0);
auto verticalSpacer = new QSpacerItem(10, 20, QSizePolicy::Minimum, QSizePolicy::Expanding);
lVertical->addItem(verticalSpacer);
connect(b, &QPushButton::clicked, this, &MainWindow::addToLayout);
Function:
void MainWindow::addToLayout() {
QPushButton* button = new QPushButton(frameSlider);
button->setText(QString::number(i));
++i; //private variable
layoutVertical->addWidget(button);
}
Currently I add like this:
But I would like to add like this:
The problem is that you have placed a spacer at the beginning so it will stretch all the widgets down.
One possible solution is to add a stretch and then insert an element before, You should not use QSpacerItem:
// constructor
layoutVertical = new QVBoxLayout(frame);
layoutVertical->setMargin(0);
layoutVertical->setSpacing(0);
layoutVertical->addStretch();
void MainWindow::addToLayout() {
QPushButton* button = new QPushButton();
layoutVertical->insertWidget(0, button);
}
Related
I want to get a Popup Widget to be shown when clicking on a QToolbutton.
This can be done by adding an action to the button itself.
The popup will contain a three buttons (update, create and cancel) and a text input field.
I have some sample code with only one button I have shared as a Github repository.
The most relevant part of the code is:
auto button = new QToolButton(this);
button->setText(" AA ");
auto popup = new Popup(button, this);
auto popupAction = new QWidgetAction(this);
popupAction->setDefaultWidget(popup);
button->setPopupMode(QToolButton::InstantPopup);
button->addAction(popupAction);
The result is as follow:
I have two issues I cannot solve:
Getting the popup widget to right align to the button.
Getting the popup widget to close when one of the buttons inside of it are clicked.
Right align the popup
There is already a similar question: Set position (to right) of Qt QPushButton popup menu.
I can add the suggested code:
void Popup::showEvent(QShowEvent*)
{
QPoint p = this->pos();
QRect geo = clickedButton->geometry();
this->move(p.x()+geo.width()-this->geometry().width(), p.y());
}
But only the content of the popup gets right aligned to the button, not the popup itself:
Closing the popup
If I click anywhere (but a widget) in the Popup it closes. I'm somehow fine with this.
But if I cannot manage to get a click on the button to close the popup.
I've tried to call the close() function but it only clears the content of the popup without closing it.
Can I get the button to trigger a signal and then close the popup?
I ask both questions as the same time, since they look very similar: both times it's the content and not the popup that is affected.
auto popup = new Popup(button, this);
auto popupAction = new QWidgetAction(this);
popupAction->setDefaultWidget(popup);
button->setPopupMode(QToolButton::InstantPopup);
button->addAction(popupAction);
Your Popup widget is not the actual popup, but just a widget inside the real popup.
So what you're moving is the widget inside the real popup and not the popup itself.
The solution in the question you linked to uses QMenu and it works with QMenu.
In your code replace
connect(button, &QToolButton::clicked, this, &MainWindow::showPopup);
auto updateButton = new QPushButton("Update");
auto popupAction = new QWidgetAction(this);
popupAction->setDefaultWidget(updateButton);
button->setPopupMode(QToolButton::InstantPopup);
button->addAction(popupAction);
with
button->setPopupMode(QToolButton::InstantPopup);
auto menu = new Popup(button, this);
auto action = new QAction("Test");
menu->addAction(action);
button->setMenu(menu);
Change your Popup class to extend/inherit QMenu, uncomment the showEvent method and remove everything from the constructor.
EDIT
You can set a layout to the qmenu and add widgets to it.
auto menuLayout = new QGridLayout();
auto menuBtn1 = new QPushButton("Btn1");
auto menuBtn2 = new QPushButton("Btn2");
auto menuBtn3 = new QPushButton("Btn3");
menuLayout->addWidget(menuBtn1, 0, 0);
menuLayout->addWidget(menuBtn2, 0, 1);
menuLayout->addWidget(menuBtn3, 1, 0);
button->setPopupMode(QToolButton::InstantPopup);
auto menu = new Popup(button, this);
menu->setLayout(menuLayout);
When you use a layout it has margins that prevent alignment.
The QMenu of the Popup can be accessed through kinship but this must be accessed when the button is pressed as this is created when it is first shown.
popup.h
#ifndef POPUP_H
#define POPUP_H
#include <QWidget>
class QToolButton;
class Popup : public QWidget
{
Q_OBJECT
public:
explicit Popup(QWidget* parent=nullptr);
Q_SIGNALS:
void clicked();
};
#endif
popup.cpp
#include "popup.h"
#include<QWidget>
#include<QVBoxLayout>
#include<QPushButton>
Popup::Popup(QWidget* parent)
: QWidget(parent)
{
auto layout = new QVBoxLayout(this);
layout->setContentsMargins(0, 0, 0, 0);
layout->addStretch();
auto updateButton = new QPushButton("Update");
layout->addWidget(updateButton);
connect(updateButton, &QPushButton::clicked, this, &Popup::clicked);
}
mainwindow.h
MainWindow::MainWindow()
{
auto widget = new QWidget;
setCentralWidget(widget);
auto layout = new QHBoxLayout(widget);
layout->addStretch();
auto button = new QToolButton;
button->setText(" AA ");
layout->addWidget(button);
auto popup = new Popup;
auto popupAction = new QWidgetAction(this);
popupAction->setDefaultWidget(popup);
button->setPopupMode(QToolButton::InstantPopup);
button->addAction(popupAction);
connect(popup, &Popup::clicked, [popup](){
if(QWidget *p = popup->parentWidget())
p->close();
});
}
I'm using QT 5.4.2 and trying to create a small panel at the bottom
of a subclassed QTreeWidget.
Here is the code:
void HmiScenarioAutoscriptPanel::searchEmitter() {
QWidget *child = new QWidget(ui->emitterTreeWidget);
//QMainWindow* child = new QMainWindow;
QLabel *labelSearch = new QLabel("Search");
QLineEdit *lineSearch = new QLineEdit();
lineSearch->setFixedSize(100, 20);
QHBoxLayout* layout = new QHBoxLayout(ui->emitterTreeWidget);
layout->setAlignment(Qt::AlignBottom);
layout->addWidget(child);
layout->addWidget(labelSearch);
layout->addWidget(lineSearch);
}
The label and search field correctly appear at the bottom of the tree,
however the fields overlap with the tree nodes (see image below).
Any idea why this behavior?
Ciao
Alf
enter image description here
It is not recommended to set layout on the tree widget. It is like other controls like a button, label etc..
I see that you are using designer. Add a blank widget (searchWidget) under the tree widget and then
void HmiScenarioAutoscriptPanel::searchEmitter() {
QWidget *child = new QWidget(ui->searchWidget);
//QMainWindow* child = new QMainWindow;
QLabel *labelSearch = new QLabel("Search", searchWidget);
QLineEdit *lineSearch = new QLineEdit(searchWidget);
lineSearch->setFixedSize(100, 20);
QHBoxLayout* layout = new QHBoxLayout(ui->searchWidget);
layout->setAlignment(Qt::AlignBottom);
layout->addWidget(child);
layout->addWidget(labelSearch);
layout->addWidget(lineSearch);
}
Just out of curiosity, why don't you add these using the designer as well?
From the ImageViewer example:
ImageViewer::ImageViewer()
{
imageLabel = new QLabel;
imageLabel->setBackgroundRole(QPalette::Base);
imageLabel->setSizePolicy(QSizePolicy::Ignored, QSizePolicy::Ignored);
imageLabel->setScaledContents(true);
scrollArea = new QScrollArea;
scrollArea->setBackgroundRole(QPalette::Dark);
scrollArea->setWidget(imageLabel);
setCentralWidget(scrollArea);
resize(500, 400);
}
I need the scroll area to appear not in the central widget, but in a dialog inside the central widget.
I tried with:
ImageViewer::ImageViewer()
{
QImage image(fileName);
plotImg = new QLabel;
plotImg->setBackgroundRole(QPalette::Base);
plotImg->setSizePolicy(QSizePolicy::Ignored, QSizePolicy::Ignored);
plotImg->setScaledContents(true);
plotImg->setPixmap(QPixmap::fromImage(image));
scrollArea = new QScrollArea(this);
scrollArea->setWidget(plotImg);
scrollArea->setBackgroundRole(QPalette::Dark);
printAct->setEnabled(true);
fitToWindowAct->setEnabled(true);
if(!fitToWindowAct->isChecked())
plotImg->adjustSize();
return true;
}
From this code, I get the dialog inside the central widget. This dialog, however, does not contain the image itself, but the scroll area which contains the image.
I would like the dialog and the scroll area to be "the same thing"...
Easy. Don't use a dialog, simply have ImageViewer inherit directly from QScrollArea.
I want to design a GUI using Qt. That contains lines and check-boxs, which are connected to each other like this :
----------[ ]-----------
------[ ]---------[ ]-------------
(where dash represents line and [] is for check-box)
Lines are created dynamically. And selecting the check-box will disable the corresponding line. So basically the lines and check-box should be on same layer.
Any hint/link about the implementation is appreciated.
You'll need a combination of QFrame, QCheckBox, and QHBoxLayout. For something a little fancier, you could sub-class your own QWidget for each section and add them incrementally to a QVBoxLayout. Something like this...
class CheckLine : public QWidget
{
Q_OBJECT
public:
CheckLine(int numboxes = 1, QObject* parent = 0) :
QWidget(parent)
{
m_layout = new QHBoxLayout;
m_layout->setSpacing(0); //you can also set the margins to zero if need be
setLayout(m_layout);
QFrame* firstline = new QFrame();
firstline->setFrameShape(QFrame::HLine);
m_layout->addWidget(firstline);
m_lines.append(firstline);
for(int i = 0; i < numboxes; ++i)
addBox();
}
void addBox()
{
QCheckBox* newbox = new QCheckBox(""); //add text here - or leave it blank if you want no label
m_newbox->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed);
m_layout->addWidget(newbox);
m_boxes.append(newbox);
QFrame* newline = new QFrame();
newline->setFrameShape(QFrame::HLine);
m_layout->addWidget(newline);
m_lines.append(newline);
/* link each checkbox to disable the line after it */
connect(newbox, SIGNAL(toggled(bool)), newline, SLOT(setEnabled(bool)));
// connect(newbox, SIGNAL(toggled(bool)), this, SLOT(setEnabled(bool))); //use this instead if you want it to disable the entire row
}
private:
QHBoxLayout* m_layout;
QList<QCheckBox*> m_boxes;
QList<QFrame*> m_lines;
};
Then, create a widget with a QVBoxLayout and new a CheckLine, incrementing numboxes by 1 each time. Tweak the code if you want any checkbox to disable the entire line.
My purpose is to create a scrollable control with a QVBoxLayout inside of it that has various controls (say buttons) on it. That control is put on a *.ui form. In the constructor for that control I write the following code:
MyScrollArea::MyScrollArea(QWidget *parent) :
QScrollArea(parent)
{
// create the scrollable container
this->container = new QWidget(); // container widget member
this->container->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
this->container->setContentsMargins(QMargins(0,0,0,0));
this->content = new QVBoxLayout(); // layout member
this->content->setMargin(0);
this->content->setSpacing(0);
for (int i=0; i<100; i++)
{
QPushButton * widget = new QPushButton();
widget->setText("button");
widget->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Fixed);
this->content->addWidget(widget);
}
this->container->setLayout(this->content);
this->content->layout();
this->setWidget(this->container);
}
My problem: the buttons have a fixed size and do not expand horizontally. they have a fixed size. i'd like them to expand horizontally to fill the row they're in. How can I get them expanding horizontally across their parent container?
Try calling this->setWidgetResizable(true);