QtQuick系列教程(1)-Qml开发环境的搭建(Windows)

总目录传送

本博文技术等级: ★☆☆☆☆☆☆☆☆☆

首先我们考察一下Windows下使用Qt的正确步骤, 其实学习就是一个探索的过程.
我的系统是Win10, 去Qt官网下载Windows下的Qt, 版本当然是最新.

http://download.qt.io/archive/qt/5.10/5.10.1/

QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第1张图片

很明显, 我下载qt-opensource-windows-x86-5.10.1.exe

运行开始安装

QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第2张图片

这个版本的Qt支持VS2013, VS2015, VS2017. 对于一个有激情的热血程序员, 妥妥最新VS2017
先关闭Qt的安装, 现在我们下载VS2017进行安装, 如果要先安装Qt也是可以的.

转到VS官网下载地址 https://www.visualstudio.com/zh-hans/downloads/

QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第3张图片

3个版本都可以, 建议下载最右边的企业版, 然后嘿嘿~~你懂的

在线安装包很小, 下载下来准备安装…

QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第4张图片

QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第5张图片

我们这里选择单个组件, 因为MFC和ATL并不需要

QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第6张图片

然后就可以喝杯咖啡,等待安装完成了

QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第7张图片

安装完成
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第8张图片

选择主题然后启动VS
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第9张图片

QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第10张图片

VS到这里就安装完成了.
接下来我们继续安装Qt
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第11张图片

账号登录可以直接跳过
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第12张图片

选择Qt的安装路径
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第13张图片

选择Qt的组件, 这里我们选择VS2017和其他组件万一后面开发用得上
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第14张图片

同意协议
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第15张图片

接着就可以开始安装了
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第16张图片

安装完成
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第17张图片

启动QtCreator, 首先进行配置
菜单选择工具->选项
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第18张图片

查看构建套件kit发现调试器未设置
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第19张图片

先关闭Qt Creator
msvc编译器使用windbg下的cdb调试器 所以需要安装windbg

https://docs.microsoft.com/en-us/windows-hardware/drivers/debugger/debugger-download-tools

QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第20张图片

QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第21张图片

QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第22张图片

QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第23张图片

QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第24张图片

注意这里, 我们可以只选择安装调试工具
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第25张图片

然后开始安装
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第26张图片

完成后重新启动Qt Creator
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第27张图片

可以看到我们的VS2017 64位编译套件已经准备好了
接下来可以创建一个简单工程进行环境的测试
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第28张图片

QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第29张图片

选择一个Qt Quick的工程模板
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第30张图片

设置工程名称和保存路径
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第31张图片

选择构建系统, 默认qmake
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第32张图片

选择兼容版本和样式
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第33张图片

选择构建套件kit
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第34张图片

最后一步完成
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第35张图片

默认的工程文件都已经创建好, 我们可以开始编译试试运行效果了
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第36张图片

在菜单构建里选择构建项目
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第37张图片

然后点击下方的编译输出, 可以看到我们的编译顺利完成
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第38张图片

运行工程
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第39张图片

界面已经显示出来
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第40张图片

到此我们在Windows上的Qt开发环境就搭建好了, Win7 Win8也如此的搭建方式.

作为一个专业的码农, 对于IDE的显示是有讲究的. 先修改下Qt Creator的显示主题

QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第41张图片

QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第42张图片

修改完后要求你重启Qt Creator
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第43张图片

重启后
QtQuick系列教程(1)-Qml开发环境的搭建(Windows)_第44张图片

这下爽了~

联系方式:


作者 郑天佐
QQ 278969898
主页 http://www.camelstudio.cn
邮箱 [email protected]
博客 http://blog.csdn.net/zhengtianzuo06
github https://github.com/zhengtianzuo
QQ群 199672080

捐赠

觉得分享的内容还不错, 就请作者喝杯咖啡吧~~

你可能感兴趣的:(Silk)