Qt之动态布局(DynamicLayout)

简述

一个应用程序为了适应不同场合、不同人的偏好,常常需要在程序的运行过程中能够灵活地改变控件的排布方式。

动态布局介绍了如何在程序运行的过程中改变控件的布局,控件的排布方式依赖于程序运行过程中的设置。

实现

下面用一个小例子来介绍这种效果的实现方式

效果

通过方向选择按钮实现按钮面板的垂直与水平排布。

通过点击RotateWidgets按钮来实现Rotatable Widgets内部控件的旋转排布。

源码

dialog.h

#ifndef DIALOG_H
#define DIALOG_H

#include <QDialog>
#include <QQueue>

class QComboBox;
class QDialogButtonBox;
class QGridLayout;
class QGroupBox;
class QLabel;
class QPushButton;

class Dialog : public QDialog
{
    Q_OBJECT

public:
    Dialog(QWidget *parent = 0);

private slots:
    void buttonsOrientationChanged(int index);
    void rotateWidgets();
    void help();

private:
    void createRotatableGroupBox();
    void createOptionsGroupBox();
    void createButtonBox();

    QGroupBox *rotatableGroupBox;
    QQueue<QWidget *> rotatableWidgets;

    QGroupBox *optionsGroupBox;
    QLabel *buttonsOrientationLabel;
    QComboBox *buttonsOrientationComboBox;

    QDialogButtonBox *buttonBox;
    QPushButton *closeButton;
    QPushButton *helpButton;
    QPushButton *rotateWidgetsButton;

    QGridLayout *mainLayout;
    QGridLayout *rotatableLayout;
    QGridLayout *optionsLayout;
};

#endif // DIALOG_H

dialog.cpp

#include <QtWidgets>

#include "dialog.h"

Dialog::Dialog(QWidget *parent)
    : QDialog(parent)
{
    createRotatableGroupBox();
    createOptionsGroupBox();
    createButtonBox();

    mainLayout = new QGridLayout;
    mainLayout->addWidget(rotatableGroupBox, 0, 0);
    mainLayout->addWidget(optionsGroupBox, 1, 0);
    mainLayout->addWidget(buttonBox, 2, 0);
    setLayout(mainLayout);

    mainLayout->setSizeConstraint(QLayout::SetMinimumSize);

    setWindowTitle(tr("Dynamic Layouts"));
}

void Dialog::buttonsOrientationChanged(int index)
{
    mainLayout->setSizeConstraint(QLayout::SetNoConstraint);
    setMinimumSize(0, 0);

    Qt::Orientation orientation = Qt::Orientation(
            buttonsOrientationComboBox->itemData(index).toInt());

    if (orientation == buttonBox->orientation())
        return;

    mainLayout->removeWidget(buttonBox);

    int spacing = mainLayout->spacing();

    QSize oldSizeHint = buttonBox->sizeHint() + QSize(spacing, spacing);
    buttonBox->setOrientation(orientation);
    QSize newSizeHint = buttonBox->sizeHint() + QSize(spacing, spacing);

    if (orientation == Qt::Horizontal) {
        mainLayout->addWidget(buttonBox, 2, 0);
        resize(size() + QSize(-oldSizeHint.width(), newSizeHint.height()));
    } else {
        mainLayout->addWidget(buttonBox, 0, 3, 2, 1);
        resize(size() + QSize(newSizeHint.width(), -oldSizeHint.height()));
    }

    mainLayout->setSizeConstraint(QLayout::SetDefaultConstraint);
}

void Dialog::rotateWidgets()
{
    Q_ASSERT(rotatableWidgets.count() % 2 == 0);

    foreach (QWidget *widget, rotatableWidgets)
        rotatableLayout->removeWidget(widget);

    rotatableWidgets.enqueue(rotatableWidgets.dequeue());

    const int n = rotatableWidgets.count();
    for (int i = 0; i < n / 2; ++i) {
        rotatableLayout->addWidget(rotatableWidgets[n - i - 1], 0, i);
        rotatableLayout->addWidget(rotatableWidgets[i], 1, i);
    }
}

void Dialog::help()
{
    QMessageBox::information(this, tr("Dynamic Layouts Help"),
                               tr("This example shows how to change layouts "
                                  "dynamically."));
}

void Dialog::createRotatableGroupBox()
{
    rotatableGroupBox = new QGroupBox(tr("Rotatable Widgets"));

    rotatableWidgets.enqueue(new QSpinBox);
    rotatableWidgets.enqueue(new QSlider);
    rotatableWidgets.enqueue(new QDial);
    rotatableWidgets.enqueue(new QProgressBar);

    int n = rotatableWidgets.count();
    for (int i = 0; i < n; ++i) {
        connect(rotatableWidgets[i], SIGNAL(valueChanged(int)),
                rotatableWidgets[(i + 1) % n], SLOT(setValue(int)));
    }

    rotatableLayout = new QGridLayout;
    rotatableGroupBox->setLayout(rotatableLayout);

    rotateWidgets();
}

void Dialog::createOptionsGroupBox()
{
    optionsGroupBox = new QGroupBox(tr("Options"));

    buttonsOrientationLabel = new QLabel(tr("Orientation of buttons:"));

    buttonsOrientationComboBox = new QComboBox;
    buttonsOrientationComboBox->addItem(tr("Horizontal"), Qt::Horizontal);
    buttonsOrientationComboBox->addItem(tr("Vertical"), Qt::Vertical);

    connect(buttonsOrientationComboBox,
            QOverload<int>::of(&QComboBox::currentIndexChanged),
            this,
            &Dialog::buttonsOrientationChanged);

    optionsLayout = new QGridLayout;
    optionsLayout->addWidget(buttonsOrientationLabel, 0, 0);
    optionsLayout->addWidget(buttonsOrientationComboBox, 0, 1);
    optionsLayout->setColumnStretch(2, 1);
    optionsGroupBox->setLayout(optionsLayout);
}

void Dialog::createButtonBox()
{
    buttonBox = new QDialogButtonBox;

    closeButton = buttonBox->addButton(QDialogButtonBox::Close);
    helpButton = buttonBox->addButton(QDialogButtonBox::Help);
    rotateWidgetsButton = buttonBox->addButton(tr("Rotate &Widgets"),
                                               QDialogButtonBox::ActionRole);

    connect(rotateWidgetsButton, &QPushButton::clicked, this, &Dialog::rotateWidgets);
    connect(closeButton, &QPushButton::clicked, this, &Dialog::close);
    connect(helpButton, &QPushButton::clicked, this, &Dialog::help);
}

引用


[1] Qt助手

  • 2
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
PyQt5.QtChart 是 PyQt5 中的一个模块,它提供了一些强大的图表组件,可以帮助我们快速实现各种类型的图表,包括动态曲线图。 下面是一个简单的示例,演示如何使用 PyQt5.QtChart 实现动态曲线图: ```python from PyQt5.QtWidgets import QApplication, QMainWindow, QGridLayout, QWidget from PyQt5.QtChart import QChart, QChartView, QLineSeries from PyQt5.QtCore import Qt, QTimer import random class MainWindow(QMainWindow): def __init__(self): super().__init__() # 创建曲线图和曲线 self.chart = QChart() self.series = QLineSeries() self.chart.addSeries(self.series) # 设置图表标题和坐标轴标签 self.chart.setTitle("Dynamic Curve") self.chart.setAnimationOptions(QChart.SeriesAnimations) self.chart.createDefaultAxes() self.chart.axes()[0].setTitleText("X") self.chart.axes()[1].setTitleText("Y") # 创建图表视图 self.chart_view = QChartView(self.chart) self.chart_view.setRenderHint(QPainter.Antialiasing) # 创建布局并添加图表视图 layout = QGridLayout() layout.addWidget(self.chart_view) # 创建窗口并设置布局 central_widget = QWidget() central_widget.setLayout(layout) self.setCentralWidget(central_widget) # 创建定时器并连接到更新函数 self.timer = QTimer(self) self.timer.timeout.connect(self.update_plot) self.timer.start(50) # 初始化计数器和数据列表 self.count = 0 self.data = [] def update_plot(self): # 更新计数器和数据列表 self.count += 1 self.data.append(random.randint(0, 100)) # 更新曲线数据 self.series.clear() for i in range(len(self.data)): self.series.append(i, self.data[i]) # 设置坐标轴范围 self.chart.axisX().setRange(max(0, self.count-100), self.count) self.chart.axisY().setRange(0, 100) if __name__ == '__main__': app = QApplication([]) window = MainWindow() window.show() app.exec_() ``` 在这个例子中,我们创建了一个 QMainWindow 窗口,并在其中添加了一个 QChartView 视图,用于显示动态曲线图。我们还创建了一个 QTimer 定时器,并将其连接到 update_plot() 函数,以定期更新曲线图的数据。 在 update_plot() 函数中,我们生成一个随机数,并将其添加到数据列表中。然后,我们清除曲线的所有数据,重新将数据添加到曲线中。最后,我们根据数据的数量调整坐标轴的范围。 请注意,我们使用了一个计数器来记录数据的数量,以便我们可以根据需要滚动我们的曲线图。在这个例子中,我们每次只显示最近的 100 个数据点。 运行这个示例程序,你将会看到一个动态曲线图,显示随机生成的数值。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值