问题描述

不知什么原因，Qt Creator并不是很完美很智能。当先写好界面类的头文件和源代码文件后，我们再添加用于可视化界面设计的UI文件时，会出现一些问题。

解决方案

1. 添加UI文件

选择添加文件的类型
选择界面类型
设置UI文件的文件名
选择所属项目
手动将UI文件包含进项目
当使用CMake管理项目时，CMake会读取CMakeLists.txt文件来确定各种项目设置。需要把MainWindow.ui包含进项目时，在CMakeLists.txt中添加入上图的第21行时，才能真正实现。

2. 与对应的界面类进行关联

UI文件MainWindow.ui对应的类文件为MainWindow.h和MainWindow.cpp文件。

// MainWindow.h
#ifndef MAINWINDOW_H
#define MAINWINDOW_H#include <QMainWindow>QT_BEGIN_NAMESPACE						//**********
namespace Ui { class MainWindow; }		//         *
QT_END_NAMESPACE						//**********class MainWindow : public QMainWindow
{Q_OBJECTpublic:MainWindow(QWidget *parent = nullptr);~MainWindow();private:								//**********Ui::MainWindow * ui;				//       ***
};										//**********
#endif // MAINWINDOW_H

// MainWindow.cpp
#include "MainWindow.h"
#include "./ui_MainWindow.h"							//**********MainWindow::MainWindow(QWidget *parent): QMainWindow(parent), ui(new Ui::MainWindow)		//**********
{
}MainWindow::~MainWindow()
{
}

用注释标注过的地方即为需要更改的地方。

虽然默认的UI文件是个空的界面，但道理，这个时候应该已经使用UI文件，并可以构建项目了。但若此时真的构建项目，那么会出现下面的编译时错误。编译错误
通过错误信息，我们不难看出是我们新包含的./ui_MainWindow.h头文件不合适。此头文件是由Qt Creator自动创建的，而且也没有自动包含进项目中。在笔者的磁盘上项目的路径是E:\Project\Qt\Demo018，而这个头文件的位置为E:\Project\Qt\build-Demo018-Desktop_Qt_6_4_0_MinGW_64_bit-Debug\Demo018_autogen\include\ui_MainWindow.h。如果我们打开这个头文件则如下所示：

/********************************************************************************
** Form generated from reading UI file 'MainWindow.ui'
**
** Created by: Qt User Interface Compiler version 6.4.0
**
** WARNING! All changes made in this file will be lost when recompiling UI file!
********************************************************************************/#ifndef UI_MAINWINDOW_H
#define UI_MAINWINDOW_H#include <QtCore/QVariant>
#include <QtWidgets/QApplication>
#include <QtWidgets/QWidget>QT_BEGIN_NAMESPACEclass Ui_Form
{
public:void setupUi(QWidget *Form){if (Form->objectName().isEmpty())Form->setObjectName("Form");Form->resize(400, 300);retranslateUi(Form);QMetaObject::connectSlotsByName(Form);} // setupUivoid retranslateUi(QWidget *Form){Form->setWindowTitle(QCoreApplication::translate("Form", "Form", nullptr));} // retranslateUi};namespace Ui {class Form: public Ui_Form {};
} // namespace UiQT_END_NAMESPACE#endif // UI_MAINWINDOW_H

不难看出其中的问题：ui_MainWindow.h头文件中提到的都是Form，而不是我们在源代码文件MainWindow.cpp中提到的MainWindow。在看这个头文件的注释中的这一句Form generated from reading UI file 'MainWindow.ui'，我们可以推断出错误的根源是在UI文件MainWindow.ui中。

我们以普通文本编辑器模式打开MainWidnow.ui文件，如下图所示：

<ui version="4.0" ><author></author><comment></comment><exportmacro></exportmacro><class>Form</class><widget class="QWidget" name="Form" ><property name="geometry" ><rect><x>0</x><y>0</y><width>400</width><height>300</height></rect></property><property name="windowTitle" ><string>Form</string></property></widget><pixmapfunction></pixmapfunction><connections/>
</ui>

在文件的第4行为<class>Form</class>，而在第5为<widget class="QWidget" name="Form" >，这才是我们无法编译的真正原因！！！

3. 修改UI文件

将MainWidnow.ui文件第4行中的Form改为我们使用的MainWindow。如下所示：

<ui version="4.0" ><author></author><comment></comment><exportmacro></exportmacro><class>MainWindow</class><widget class="QWidget" name="MainWindow" ><property name="geometry" ><rect><x>0</x><y>0</y><width>400</width><height>300</height></rect></property><property name="windowTitle" ><string>Form</string></property></widget><pixmapfunction></pixmapfunction><connections/>
</ui>

此时，就可以成功构建项目了。运行项目后，如下图所示：

细心的同学可以发现，我们设置的窗口的标题是Form，而不是Demo018。而在MainWidnow.ui中我们确实看到了相关的代码：

  <property name="windowTitle" ><string>Form</string></property>

以界面编辑器方式打开这个文件后，在属性栏中我们也找到了相关设置：
界面编辑器中的属性设置
这说明，界面类并没有从UI文件中读取界面设计。

4. 设置界面类读取UI文件

#include "MainWindow.h"
#include "./ui_MainWindow.h"MainWindow::MainWindow(QWidget *parent): QMainWindow(parent), ui(new Ui::MainWindow)
{ui->setupUi(this);		//**********
}MainWindow::~MainWindow()
{
}