第2章开发环境搭建

2、开发环境搭建：选择开发工具与配置编译环境

在开始自定义工业HMI图形控件之前，搭建一个稳定、高效的开发环境是基础。本章将指导你完成从工具选择到编译环境配置的全过程，涵盖C++和Python两种主流开发路径。

2.1 开发工具选择

工业HMI开发通常涉及界面设计、逻辑编码与调试。推荐以下两种工具组合：

工具	适用场景	核心优势
Qt Designer	可视化UI布局、控件原型设计	所见即所得，拖拽式操作，生成.ui文件可直接转换为代码
VS Code	代码编写、调试、版本控制	轻量、插件丰富（Python/C++扩展）、集成终端与Git

建议工作流：使用Qt Designer快速设计控件布局，导出为.ui文件；然后在VS Code中编写业务逻辑代码，并利用其调试功能进行断点测试。

2.2 配置C++编译环境

若选择C++作为开发语言，需安装Qt框架和编译器。

步骤1：安装Qt与MinGW/MSVC

访问 Qt官网下载开源版本（Qt Online Installer）。
安装时勾选以下组件：
- Qt 5.15.x 或 Qt 6.x（建议5.15以兼容更多工业硬件）
- MinGW 8.1.0 64-bit（Windows下轻量编译器）或 MSVC 2019/2022（需配合Visual Studio）
- Qt Charts（用于工业趋势图）
- Qt Quick（若需QML开发）

步骤2：配置VS Code C++环境

安装VS Code扩展：C/C++（Microsoft）、CMake Tools。

在VS Code中按 Ctrl+Shift+P，搜索“C/C++: Edit Configurations (JSON)”，添加Qt头文件路径：

{
    "configurations": [
        {
            "name": "Win32",
            "includePath": [
                "${workspaceFolder}/**",
                "C:/Qt/5.15.2/mingw81_64/include"
            ],
            "defines": [],
            "compilerPath": "C:/Qt/Tools/mingw810_64/bin/g++.exe",
            "cStandard": "c17",
            "cppStandard": "c++17",
            "intelliSenseMode": "windows-gcc-x64"
        }
    ],
    "version": 4
}

创建 CMakeLists.txt 示例：

cmake_minimum_required(VERSION 3.16)
project(HMI_Controls)

set(CMAKE_CXX_STANDARD 17)
set(CMAKE_AUTOMOC ON)

find_package(Qt5 REQUIRED COMPONENTS Widgets Charts)

add_executable(${PROJECT_NAME} main.cpp)
target_link_libraries(${PROJECT_NAME} Qt5::Widgets Qt5::Charts)

2.3 配置Python编译环境

Python开发更快速，适合原型验证。核心依赖为PyQt5（或PySide6）和SDL2（用于底层图形渲染）。

步骤1：安装Python与虚拟环境

# 推荐使用Python 3.8~3.11（PyQt5最高支持3.11）
python -m venv hmienv
# Windows激活
hmienv\Scripts\activate
# Linux/Mac激活
source hmienv/bin/activate

步骤2：安装必要库

pip install pyqt5 pyqt5-tools  # 包含Qt Designer
pip install pysdl2 pysdl2-dll  # SDL2绑定与动态库
pip install numpy             # 工业数据处理常用

验证安装：在Python交互环境中执行以下代码，若无报错则环境正常：

import PyQt5
import sdl2
print("PyQt5 version:", PyQt5.QtCore.PYQT_VERSION_STR)
print("SDL2 version:", sdl2.version)

步骤3：配置VS Code Python环境

安装扩展：Python（Microsoft）、Pylance。
按 Ctrl+Shift+P，选择“Python: Select Interpreter”，指向虚拟环境中的 python.exe。

创建 .vscode/settings.json 以启用类型检查：

{
    "python.defaultInterpreterPath": "${workspaceFolder}/hmienv/Scripts/python.exe",
    "python.analysis.typeCheckingMode": "basic",
    "python.analysis.autoImportCompletions": true
}

2.4 安装SDL2（跨平台图形底层库）

SDL2用于实现高性能的2D渲染，在自定义复杂控件（如仪表盘、实时曲线）时非常有用。

操作系统	安装方式
Windows	下载SDL2-devel-2.28.x-mingw.zip，解压后将 `bin` 目录加入系统PATH
Linux (Ubuntu/Debian)	`sudo apt install libsdl2-dev libsdl2-image-dev libsdl2-ttf-dev`
macOS	`brew install sdl2 sdl2_image sdl2_ttf`

验证SDL2：编写一个简单的C++测试文件 test_sdl.cpp：

#include <SDL2/SDL.h>
#include <iostream>

int main() {
    if (SDL_Init(SDL_INIT_VIDEO) < 0) {
        std::cerr << "SDL Init failed: " << SDL_GetError() << std::endl;
        return 1;
    }
    std::cout << "SDL2 initialized successfully!" << std::endl;
    SDL_Quit();
    return 0;
}

编译运行：g++ test_sdl.cpp -lSDL2 -o test_sdl && ./test_sdl

2.5 环境验证与常见问题

验证清单

✅ Qt Designer 可正常启动并创建.ui文件
✅ VS Code 中C++代码可识别Qt头文件并编译通过
✅ Python虚拟环境中 import PyQt5 无报错
✅ SDL2示例程序输出成功信息

常见问题

Qt Designer 无法打开：检查是否已安装 pyqt5-tools，或在Qt安装目录下直接运行 designer.exe。
VS Code 找不到头文件：检查 c_cpp_properties.json 中的 includePath 是否指向正确的Qt安装目录。
SDL2 链接错误：Windows下确保 SDL2.dll 在可执行文件同目录或系统PATH中。

完成以上步骤后，你的开发环境已具备工业HMI控件开发的基本能力。下一章我们将开始创建第一个自定义控件——一个支持动态数值更新的数字仪表盘。

📚 课程目录