基于Qt的收银点餐系统之UI的基本实现（二）

最新推荐文章于 2025-04-16 10:18:03 发布

linpingyuan

最新推荐文章于 2025-04-16 10:18:03 发布

阅读量3.1k

点赞数 4

分类专栏： Qt 文章标签： ui qt

本文链接：https://blog.youkuaiyun.com/qq_35153254/article/details/78251949

版权

Qt 专栏收录该内容

9 篇文章

订阅专栏

在上一篇文章中，主要是从宏观上去探讨Qt中UI的实现方案；这一篇文章，将给出具体的代码。

实现结果：
这里写图片描述

一、实现思路

上一篇文章讲到，布局工作的特点为“区域划分”、“层层嵌套”，同时整个布局工作中，关键点也在于如何划分区域、如何找到层层嵌套的关系。
在这个例子中，我将划分和嵌套关系组织如下：
1.对于主窗口，被分为了三个部分：左侧category、中间goodsList、右侧Info；
2.对于左侧部分和中间部分，较为简单，直接将Label、TextBrowser等子控件添加入相应的布局管理器后，父控件将该布局管理器设置为其布局就可以实现；
3.对于右侧，从上到下又分为三个部分：label、button群、spinBox群。对于后两个部分，再次使用“控件将含有子控件的布局管理器设为其布局”的方式实现。

二、代码

1.goodsList.h

#ifndef GOODSLIST_H
#define GOODSLIST_H

#include <QMainWindow>
#include <QGroupBox>
#include <QScrollArea>
#include <QListWidget>
#include <QTextBrowser>
#include <QLabel>
#include <QPushButton>
#include <QSpinBox>
#include <QVBoxLayout>
#include <QHBoxLayout>
#include <QGridLayout>
#include <QWidget>

class goodsList : public QMainWindow
{
    Q_OBJECT

public:
    explicit goodsList(QWidget *parent = 0);
    ~goodsList();

private:
    void createCategory();  //左侧category的布局
    void createGoodsList(); //中间goodsList的布局
    void createInfo();  //右侧Info的布局
    void createWholeLayout(); //主窗口布局

    enum {NUMGOODS = 20,NUMBUTTONS = 4};

    QGroupBox *categoryGroupBox;
    QScrollArea *goodsListScrollArea;
    QGroupBox *infoGroupBox;

    QListWidget *categoryListWidget;
    QTextBrowser *goodsTextBrowser[NUMGOODS];
    QLabel *priceLabel;
    QPushButton *operationButton[NUMBUTTONS];
    QSpinBox *countSpinBox[NUMGOODS];
    QWidget *buttonsWidget;
    QWidget *countWidget;
};

#endif // GOODSLIST_H

2.goodsList.cpp文件

#include "goodslist.h"
#include "QString"

goodsList::goodsList(QWidget *parent) :
    QMainWindow(parent)
{
     createCategory();
     createGoodsList();
     createInfo();
     createWholeLayout();
}


void goodsList::createCategory()
{
    categoryListWidget = new QListWidget;
    categoryListWidget->addItem(tr("分类一"));
    categoryListWidget->addItem(tr("分类二"));
    categoryListWidget->addItem(tr("分类三"));


    QVBoxLayout *categoryLayout = new QVBoxLayout;
    categoryLayout->addWidget(categoryListWidget);

    categoryGroupBox = new QGroupBox(tr("Category"));  //不能直接向GroupBox里添加子控件，只能通过设置布局管理器来间接添加子控件
    categoryGroupBox->setLayout(categoryLayout);

}


void goodsList::createGoodsList()
{
    goodsListScrollArea = new QScrollArea();

    QGridLayout *goodsListLayout = new QGridLayout;
    for(int i = 0; i < NUMGOODS; i++)
    {
        goodsTextBrowser[i] = new QTextBrowser(); //怎么添加文字
        goodsListLayout->addWidget(goodsTextBrowser[i],i/3,i%3);   //addItem和 addWidget有什么区别
    }

    goodsListScrollArea->setLayout(goodsListLayout);

}

void goodsList::createInfo()
{
    priceLabel = new QLabel(tr("total price:"));

    //组装4个button
    buttonsWidget = new QWidget;
    QGridLayout *buttonsLayout = new QGridLayout;
    for(int i = 0; i < NUMBUTTONS; i++)
    {
        operationButton[i] = new QPushButton(tr("Button %1").arg(i + 1)); //get技能：.arg（）的用法
        buttonsLayout->addWidget(operationButton[i]);
    }
    buttonsWidget->setLayout(buttonsLayout);

    //组装购买商品信息
    countWidget = new QWidget;
    QGridLayout *countLayout = new QGridLayout;
    for(int i = 0; i < 5; i++)
    {
        countSpinBox[i] = new QSpinBox;
        countLayout->addWidget(countSpinBox[i],i / 2,i%2);
    }
    countWidget->setLayout(countLayout);

    //Info部分的总布局
    QVBoxLayout *infoLayout = new QVBoxLayout;
    infoLayout->addWidget(priceLabel);
    infoLayout->addWidget(buttonsWidget);
    infoLayout->addWidget(countWidget);

    infoGroupBox = new QGroupBox(tr("Info"));
    infoGroupBox->setLayout(infoLayout);
}


//主窗口的布局
void goodsList::createWholeLayout()
{
    QHBoxLayout *wholeLayout = new QHBoxLayout;
    wholeLayout->addWidget(categoryGroupBox);
    wholeLayout->addWidget(goodsListScrollArea);
    wholeLayout->addWidget(infoGroupBox);

    //设置拉伸因子
    wholeLayout->setStretchFactor(categoryGroupBox,1);
    wholeLayout->setStretchFactor(goodsListScrollArea,3);
    wholeLayout->setStretchFactor(infoGroupBox,2);

    //这部分要有，否则主窗口不会有显示
    QWidget *widget = new QWidget(this) ;
    widget->setLayout(wholeLayout);
    this->setCentralWidget(widget);
    setWindowTitle(tr("收银点餐系统"));

}

goodsList::~goodsList()
{
}

三、注意点

1.主窗口布局时，需要设置setCentralWidget（）
首先，不能直接在对主窗口设置layout，需要在主窗口里面添加一个“主”Widget，并setCentralWidget（）；然后，将所有的东西放在这一个Widget中。


    //这部分要有，否则主窗口不会有显示
    QWidget *widget = new QWidget(this) ;
    widget->setLayout(wholeLayout);
    this->setCentralWidget(widget);
    setWindowTitle(tr("收银点餐系统"));