vs2022+Qt插件初体验,创建带 UI 界面的 Qt 项目

前提:确认环境就绪(我的环境)

  1. Qt VS Tools 已配置好 Qt 版本(如 Qt 6.8.3 MSVC2022 64-bit);
  2. VS2022 解决方案平台设为 x64,与 Qt 版本架构匹配。

步骤 1:创建带 UI 界面的 Qt 项目

  1. 打开 VS2022 → 点击「创建新项目」→ 搜索 Qt Widgets Application → 选择该模板 → 「下一步」;

  2. 配置项目信息:

    • 项目名称:自定义(如 QtUI_Demo);
    • 保存路径:无中文 / 空格;
    • 解决方案名称:默认或自定义;

3.点击「创建」,进入 Qt 项目配置向导:

  • Qt Version :选择已配置的 Qt 版本(如 Qt 6.8.3 MSVC2022 64-bit);
  • Base class :选择窗口基类(推荐 QMainWindowQWidget,新手选 QMainWindow 更易扩展);
  • 勾选 Generate form(核心!会自动生成 .ui 界面文件);
  • 其他选项默认 → 点击「Finish」。

✅ 项目创建后,自动生成核心文件:

  • QtUI_Demo.ui:Qt Designer 可视化界面文件;
  • QtUI_Demo.h/QtUI_Demo.cpp:界面逻辑代码文件;
  • main.cpp:程序入口。

步骤 2:用 Qt Designer 设计界面

  1. 打开 Qt Designer

    • 方式 1:在 VS 解决方案资源管理器中,双击 QtUI_Demo.ui 文件 → 自动启动 Qt Designer;
    • 方式 2:VS 顶部菜单 → 扩展 → VS Tools → Launch Qt Designer → 手动打开 QtUI_Demo.ui

2.可视化设计界面(以添加按钮 / 标签为例)

操作 步骤
拖放控件 左侧「Widget Box」中,找到「Push Button」「Label」,拖拽到右侧主窗口画布;
修改属性 选中控件 → 右侧「Property Editor」修改属性:- 按钮:text 改为「点击弹窗」,objectName 改为 btnShowPopup;- 标签:text 改为「Qt 可视化界面演示」,font 设为「微软雅黑,14 号」;
布局调整 选中主窗口 → 顶部菜单栏「布局」→ 选择「水平布局 / 垂直布局」→ 控件自动适配窗口大小;
保存界面 Ctrl+S 保存 .ui 文件,VS 会自动生成 ui_mainwindow.h(隐藏在「头文件→Generated Files」下)。

在项目文件中我是没有发现有自动生成的头文件(ui_QtUI_Demo.h)

倒是在编译文件中找到了它:

可能是qt的版本不同导致的吧。

步骤 3:关联界面控件与代码(信号槽)

1.在 QtUI_Demo.h 中声明槽函数

复制代码
private slots:
    void on_btnShowPopup_clicked();

2.在 mainwindow.cpp 中实现槽函数

复制代码
void QtUI_Demo::on_btnShowPopup_clicked()
{
	// 弹出普通提示框(信息类)
	QMessageBox::information(
		this,                  // 父窗口(当前主窗口)
		"提示标题",            // 弹窗标题
		"这是点击按钮后弹出的提示框!"  // 弹窗内容
	);
}

步骤 4:编译运行

  1. VS 顶部「解决方案平台」选择 x64 → 配置选 Debug/Release
  2. 点击「生成→生成解决方案」(F7),若无报错则编译成功;
  3. 点击「调试→开始执行(不调试)」(Ctrl+F5):
    • 弹出设计好的主窗口;
    • 点击「点击弹窗」按钮,触发高科技弹窗,验证界面与代码关联成功。

完毕!!!

相关推荐
Scott9999HH6 小时前
【IIoT流量实战】蒸汽管道阀门全关却仍有流量?用 Python 实现涡街信号 FFT 频谱分析与温压全补偿积算网关,深度拆解靠谱的涡街流量计厂家硬核技术标准
开发语言·python
码智社7 小时前
AES加密原理详解及Java实现加解密实战
java·开发语言
AI云海7 小时前
python 列表、元组、集合和字典
开发语言·python
萧瑟余晖8 小时前
JDK 26 新特性详解
java·开发语言
马优晨9 小时前
Freemarker 完整讲解(后端 Java 模板引擎)
java·开发语言·freemarker·freemarker 完整讲解·freemarker模板引擎
人邮异步社区11 小时前
怎么把C语言学到精通?
c语言·开发语言
心平气和量大福大11 小时前
C#-WPF-控件-TextBox 数据绑定
开发语言·c#·wpf
ttwuai11 小时前
Cursor 生成 CRUD 后,Go 后台接口别只测 200:JWT、RBAC 和 tenant_id 怎么验
开发语言·后端·golang
এ慕ོ冬℘゜12 小时前
前端基础:什么是时间戳?JS获取时间戳三种方法与实战用途
开发语言·前端·javascript
执明wa12 小时前
LayoutInflater详解: XML是如何变成View的?
android·xml·开发语言·android studio