Qt小程序(五)-简单Ui界面操作

﹏ヽ暗。殇╰゛Y 2022-06-04 01:39 474阅读 0赞

# 目录 #

*  目录
 *  前言
 *  ui界面操作
 *  对话框代码
 *  创建效果
 *  总结

# 前言 #

刚刚学习了如何使用ui界面文件创建对话框，用到了一些常用的操作，包括信号与槽等，这样的东西都是套路化的，只有记录一遍，以后只要按操作执行就不会出现问题了应该，所以特此记录下先！

# ui界面操作 #

*  创建一个Label
 *  创建一个LineEdit
 *  创建两个Push Button  
    ![1][]  
    直接拖动`Widget Box`中的控件即可，但是这时候是没有布局的。我给`Label`设置的文本信息为`&Cell Location`，给两个`PushButton`设置的`objectName`分别为`okButton`和`closeButton`。
 *  设置`Buddies`  
    需要给`label`和`lineEdit`设置绑定(至少我是这么理解的，词汇可能不专业)，在**菜单栏**选择**编辑**，选择**Edit Buddies**。然后在`label`和`lineEdit`之间连线即表示`Buddies`。  
    ![2][]  
    设置`Buddies`，如下图：  
    ![3][]  
    注意，这时候是处于`Edit Buddies`状态，如果需要回到原来的状态，需要在**菜单栏**的**编辑**中选择`Edit Widgets`。
 *  设置`Horizontal Spacer`  
    如果默认对`label`和`lineEdit`使用水平布局，对两个`PushButton`使用水平布局，然后对整体使用**垂直布局**，如下图：  
    ![4][]  
    所以，为了保证美观，我们可以使用`Horizontal Spacer`，使用效果如下：  
    ![5][]
 *  给`okButton`和`closeButton`添加**信号与槽**  
    在**菜单栏**选择**编辑**，选择**Edit Signals/Slots**。然后对两个`Push Button`分别设置**信号与槽**。  
    ![6][]  
    注意：要回到编辑状态，要使用在**菜单栏**的**编辑**中选择`Edit Widgets`。
 *  设置`lineEdit`在有输入的时候，`OK`按钮才会**有效**，在右侧的**属性**中设置`enabled`的**勾选去除**。同时我们可以在**代码**中设置**正则表达式**来限制输入，同时在输入的时候设置**槽函数**来启动`OK`按钮。  
    这里使用 `on_lineEdit_textChanged`函数作为`lineEdit`输入的**槽函数**。  
    槽函数代码如下：

void Dialog::on_lineEdit_textChanged()
    {
        ui->okButton->setEnabled(ui->lineEdit->hasAcceptableInput());
    }

*  为`lineEdit`设置**信号与槽**  
    在**菜单栏**选择**编辑**，选择**Edit Signals/Slots**，在弹出界面`lineEdit`中选择`textChanged`，然后在`Dialog`选择`编辑`，然后添加我们自己写的槽函数`on_lineEdit_textChanged`。  
    ![7][]

# 对话框代码 #

*  dialog.h

#ifndef DIALOG_H
    #define DIALOG_H
    
    #include <QDialog>
    
    namespace Ui {
    class Dialog;
    }
    
    class Dialog : public QDialog
    {
        Q_OBJECT
    
    public:
        explicit Dialog(QWidget *parent = 0);
        ~Dialog();
    private slots:
        void on_lineEdit_textChanged();
    
    private:
        Ui::Dialog *ui;
    };
    
    #endif // DIALOG_H

*  dialog.cpp

#include "dialog.h"
    #include "ui_dialog.h"
    
    Dialog::Dialog(QWidget *parent) :
        QDialog(parent),
        ui(new Ui::Dialog)
    {
        ui->setupUi(this);
    
        QRegExp regExp("[A-Za-z][1-9][0-9]{0,2}");
        // this represent parent object; if parent object delete, all the child object will be delete
        ui->lineEdit->setValidator(new QRegExpValidator(regExp, this));
    }
    
    Dialog::~Dialog()
    {
        delete ui;
    }
    
    void Dialog::on_lineEdit_textChanged()
    {
        ui->okButton->setEnabled(ui->lineEdit->hasAcceptableInput());
    }

# 创建效果 #

![8][]

# 总结 #

学习！分享！感谢！

[1]: /images/20220604/5bc38cfe23164cea851ab2d9d71815b4.png
[2]: /images/20220604/35af691d1eb340aab43429473b20d4eb.png
[3]: /images/20220604/8f5cec21d6b94ae8adad7acf96afb3f5.png
[4]: /images/20220604/2fb0aeeee36042e0ad4e7df0a91c23f2.png
[5]: /images/20220604/0b08846641474f439be1778bf63a0ecf.png
[6]: /images/20220604/b536c886254944e3a35c15fc6cec578b.png
[7]: /images/20220604/76cda238a4d241008d410169a7f3fc0a.png
[8]: /images/20220604/37e15089d9304c11aaed3f8c6fff88cc.png