毕设代做的网站企业网站模板设计

目录

一、QT简介

二、开发环境

三、编码风格

四、设计框架

五、总结

---

一、QT简介

        QT是一款以C++为基础的开发工具，已经包含了很多常用的库，除了基本的GUI以外，还有网络、数据库、多媒体、进程通信、串口、蓝牙等常用库，开发起来非常方便。后来QT又引入了QML，使得在制作界面方面更便捷了，类似js的语言，上手容易，短短几行代码就可以设计出灵活且美观的界面，开发成本极低。

        选择QT作为用户端的开发工具主要有以下优点：

1、学习成本较低，相比于再学习Java和安卓开发，确实是低的；而且既然会C语言了，由于QT各种库已经封装得非常好了，你只要学会如何调用就行了，上手很快，不要被C++吓到。

2、具备前后端开发的框架，相信QT引入QML也是为了可以区分前后端开发，相比于传统的QtWidgets纯C++开发，结构框架上会好很多，而且QtWidgets也不适合手机端的开发。

3、通用性强，就这个项目的QT程序，可以在Windows、MacOS、安卓、IOS、嵌入式linux(树莓派、香橙派)等平台编译运行，作为个人的学习开发工具，效率很高。

4、使用广泛，QT在消费级产品比较少应用，但是在工业领域却是很广泛的存在，比如汽车的很多仪表盘的界面都是用QT做的，会QT对以后找工作是有比较大的帮助的。

        总的来讲，QT综合功能强，很适合个人开发一些小项目、上位机等，可以让你的学习精力放在项目本身，见效快。

二、开发环境

        QT的开发方式是比较丰富的，很多人一开始都是从拖拽界面开始的，但是我不太建议这样，表面上效率很高，但是稍微有点逻辑、动态变化的元素在里面就很不好处理，比较适合做些固定的小界面。要我说，还是要学会用代码的方式去控制界面。

        正常QT安装完后就可以直接用自带的MinGW编译套件进行开发，可以随机打开一个自带的Demo进行测试。对于我们项目本身，框架结构上还是要有利于维护的，所以各类文件存放的位置最好统一下，如下图所示，整个工程结构主要分为项目文件xxx.pro、头文件、cpp文件和资源文件四大部分，在资源管理器内的文件夹也做相应的分类，这样整个项目维护起来比较方便。

三、编码风格

        每个开发语言或者开发工具都有自己的编码风格，比如之前说的RT-Thread用的是Unix风格，小写字母+下划线。相对来讲，Qt的风格比较丰富，大部分是下图这种形式的，前面是小写的动词，后面使用驼峰法把属性隔开，比较少用下划线；如果没有动词的话，前面也是小写开头的。大家打开QT的Demo或者源文件什么的，在默认参数下，整体感觉还是很协调优雅的，说明他们在编辑器排版、颜色、编码等内容都是做过功课的，那我们也基本上入乡随俗，沿用Qt的编码风格，当然了，也不一定非得生搬硬套，整体上差不多就行。

        我个人的定义一般是这样，如下图所示，类的成员变量一般都会以m_开头，信号定义分为两种，一种是C++内部的，用sig开头，一种是C++发到QML的，用siq开头；对于槽函数，统一都是slot开头，这样在写代码的时候很容易就通过补全提示体现筛选出来了。同样的，在这里我也大量使用了u8、u16和u32，对于嵌入式而言，这个比较严谨和适用，还有就是个人习惯，所以也就沿用了。

        刚才所提到的信号和槽是QT的一个特点，它可以很方便地实现不同任务之间的数据交互，以前有写过linux的代码，是用的管道通信，后来使用QT的信号槽后感觉方便多了。

四、设计框架

        既然是模仿小米的空气净化器，那首先就要看下米家APP关于净化器的界面设计了。

        首先界面分为关机和开机两个状态，上面的是关机，数据显示的内容和位置其实是没变化的，底面背景变了而已；我们只是模仿而已，像自动、睡眠这些个模式就不要了，能调速就行了，页面搞太长了也不利于初学，那其实就剩下开关和调速栏了；这里面其实还有个比较麻烦的是开机后中心圆圈(图片中橘黄色部分)是渐变色，并且还有气泡随机冒出向中心运动，这个要花点脑筋想想怎么实现，不需要美工的。

        经过整体分析，大概可以做如下分解，前后端先分开，后端主要是数据处理的问题，没有过多的逻辑；前端几个界面上面也说明过了，就是一个动态界面比较麻烦点，还有个状态切换也要说明下，就是根据不同的PM2.5数值换算成不同的等级，这里分为优、良、差三级，对应的颜色是绿、黄、红，这个在第一篇的演示视频里应该都看到了，这里再大概贴个界面，顶部改成了在线状态(小绿灯)和ID号，便于跟自己的内容结合。

五、总结

        那么，手机端APP的整体设计也就这样了，不复杂，这里都没有用美工进行UI设计的，几个QML文件就能搞定了，核心还是背后要有自己的设计思路，我出这个教程的目的除了方便大家入门以外，还有个目的就是让大家一开始就有项目思维，不要停留在跑个demo的层面。

        另外，如果暂时Qt for Android的环境配置有问题，那就先放放也无妨，直接在PC端体验就好了，效果差不多的，有时间再慢慢折腾。

  本项目的交流QQ群:701889554

   写于2024-4-2