Qt环境搭建

安装QtCreator

进入Qt官网https://www.qt.io/zh-cn/,点击下载按钮

https://cdn.llfc.club/20220818205558.png

然后选择试用Qt,这里下载的是免费版本,也就是社区版本,如果点击购买则下载专业版。

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818205904.png

点击下载后需要填写个人信息,填好邮箱和手机

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818210335.png

还需要填写用途,并选择偏好

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818210524.png

qt服务器收到消息后会让你填写确认码

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818210647.png

填好后页面会跳转到下载链接界面,可以选择离线下载,也可以选择在线下载,在离线下载界面还可以选择过去的版本,我选择在线安装。

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818210843.png

点击在线安装会下载下载器,点击下载器然后开始安装,安装过程中要填写账号和密码,没有就注册一个。

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818211140.png

选择个人安装,不用于商业用途,这样我们下载的就是社区版本

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818211415.png

选择要安装的组件和目录

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818211544.png

选择组件可以全选,我在默认的基础上勾选了5.15的组件,用默认的就够了

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818211710.png

初次使用QtCreator

我们可以选择新建项目,看看效果

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818211827.png

因为我们要创建一个桌面应用,所以选择QtWidgets Application

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818211926.png

填写项目名和项目路径

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818212131.png

选择编译组件,如果不确定可以全选,Qt会默认选择一个

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818212226.png

Qt会为我们创建主窗口,我们可以为这个主窗口定义类名

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818212343.png

点击确定后界面就会跳转为我们生成好项目

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818212559.png

我们点击绿色的三角号就是运行项目,如果你的三角号是灰色的,你需要点击上面的Debug选择编译套件,选择一个你能用的就好。第一次编译时间会长一点,编译好就会弹出我们生成的界面了。

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818212713.png

到此Qt的安装环境就配好了。

visual studio 配置Qt开发环境

有时候我们习惯了Visual Studio的开发习惯,也可以用Visual Studio配置Qt开发环境。
可以去visual studio官网https://visualstudio.microsoft.com/zh-hans/

如果点击下载Visual Studio,则直接下载的是最新版本的Visual Studio

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818213140.png

如果想要下载过去的版本,可以点击下载标签

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818213712.png

这里有过去版本的列表,我下载的是2019版本

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818213816.png

下载时需要登录,可以用github或者手机

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818213940.png

下载一定要选择community,community是社区办,如果选择专业版和企业版需要秘钥,是付费的。

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818214113.png

我们用vs打开之前Qt创建的项目目录

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818214328.png

为了让vs可以打开qt项目,需要安装qt插件, 点击扩展->管理扩展, 输入Qt,然后下载安装

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818214914.png

安装好后重启vs, 然后点击扩展,选择Qt Vs Tools

https://cdn.llfc.club/E3MjIzNTE4LnBuZw.png

然后选择Qt Versions 里点击Add

https://cdn.llfc.club/jIzOTM4LnBuZw2.png

然后添加Qt的qmake路径

https://cdn.llfc.club/3MjI0MDQ4LnBuZw3.png

然后我们用vs打开qt项目

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818215927.png

然后打开之前创建的qt项目

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818220033.png

此时vs可能会报错,如下所示

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818220217.png

此时需要关闭vs,我们进到刚才qt项目文件夹里,发现已经生成vcxproj文件,

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818220535.png

双击该文件,然后选择用vs打开即可。

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818220729.png

此时vs已经能成功加载项目了

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818220928.png

点击绿色三角,vs可以编译qt项目并生成如下界面

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818221032.png

vs配置ui打开方式

我们希望vs环境下点击qt的ui文件,会调用qt desiner编辑ui文件,可以右键ui文件进行配置

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818221425.png

选择打开方式

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818221524.png

选择Qt Designer,然后点击Add按钮
https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818221652.png

配置Qt Designer 的安装路径

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818221825.png

配置好后,选择Qt Designer2017 作为默认值

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818221930.png

这样我们点击ui文件,就默认弹出Qt Designer编辑UI了

https://cdn.llfc.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220818222055.png

总结

到此我们就将qt环境配置好了