开发环境搭建

项目运行环境

开发调试环境建议使用Ubuntu22.04 Desktop

TinyPiXOS开发环境可以通过 源码编译安装 或者 下载安装包 进行开发环境配置。

VSCode开发工具

建议使用Visual Studio Code进行项目开发，使用CMake进行工程管理。

VSCode可以直接安装在Ubuntu虚拟机当中使用，同时也可以将VSCode安装在Windows/Mac宿主机上，使用 ms-vscode-remote.remote-ssh、ms-vscode-remote.remote-ssh-edit、ms-vscode.remote-explorer插件通过ssh远程链接虚拟机进行开发。（具体配置方法可自行搜索）

推荐安装插件清单

extensions.txt

cheshirekow.cmake-format
cschlosser.doxdocgen
josetr.cmake-language-support-vscode
mhutchie.git-graph
ms-ceintl.vscode-language-pack-zh-hans
ms-vscode-remote.remote-ssh
ms-vscode-remote.remote-ssh-edit
ms-vscode.cmake-tools
ms-vscode.cpptools
ms-vscode.cpptools-extension-pack
ms-vscode.cpptools-themes
ms-vscode.makefile-tools
ms-vscode.remote-explorer
shd101wyy.markdown-preview-enhanced
zchrissirhcz.cmake-highlight

安装VSCode插件

1. 将VSCode添加到系统路径(环境变量)

   • MacOS/Linux
     1. 打开 VSCode。
     2. 按下Command + Shift + P打开命令面板。
     3. 输入Shell Command: Install ‘code’ command in PATH并按下 Enter。
   • Windows
     1. 打开 VSCode。
     2. 按下Ctrl + Shift + P打开命令面板。
     3. 输入Shell Command: Install ‘code’ command in PATH并按下 Enter。
     4. 重启命令提示符或 PowerShell。

2. 安装插件

   可先把extensions.txt文件复制到该设备，接着在终端中运行以下脚本：

   • MacOS/Linux

     cat extensions.txt | xargs -L 1 code --install-extension

   • Windows

     Get-Content extensions.txt | ForEach-Object { code --install-extension $_ }

上述脚本会逐行读取extensions.txt文件中的插件名称，并且使用code --install-extension命令来安装这些插件。

简单示例程序

直接使用g++构建一个实例程序，g++需要支持C++11，建议版本11.4。

1. 创建main.cpp，构建一个显示一个按钮的实例程序

main.cpp

#include "TpApp.h"
#include "TpMainWindow.h"
#include "TpButton.h"

int32_t main(int32_t argc, char *argv[])
{
    // 构建主事件循环对象
    TpApp app(argc, argv);

    // 创建主窗体对象
    TpMainWindow *vScreen = new TpMainWindow();
    // 设置主窗体背景颜色
    vScreen->setBackGroundColor(_RGBA(128, 128, 128, 255));
    // 将主窗体绑定至app
    app.bindVScreen(vScreen);

    // 创建一个按钮对象，设置按钮文本为"北京市"，按钮放置在 vScreen 窗体上显示
    TpButton *button1 = new TpButton("北京市", vScreen);
    // 设置按钮的尺寸
    button1->setSize(300, 64);
    // 设置按钮显示在父窗体（vScreen）的坐标
    button1->move(150, 150);
    // 绑定按钮信号槽，按钮在被点击后触发该信号，进入该匿名函数
    connect(button1, onClicked, [=](bool checked)
            { std::cout << "按钮被点击" << std::endl; });

    // 手动更新主窗体
    vScreen->update();

    // 运行主事件循环
    return app.run();
}

2. 创建编译脚本cross与main.cpp在同级目录

cross

g++ main.cpp -o button -I. -I/usr/include/TinyPiX -I/usr/include/TinyPiX/TpWM -I/usr/include/TinyPiX/TpUtils -I/usr/include/TinyPiX/TpExtUtils -I/usr/include/TinyPiX/TpGUI -I/usr/include/TinyPiX/TpGUI/Core -I/usr/include/TinyPiX/TpGUI/Screen -I/usr/include/TinyPiX/TpGUI/Widgets -I/usr/include/TinyPiX/TpGUI/Core -L/usr/lib -L/usr/lib/TinyPiX -lTpUtils -lTpExtUtils -lTpGUI

3. 运行编译脚本

需要cross文件有可执行权限，若无可执行权限可使用chmod命令修改权限

chmod 777 cross
./cross

4. 运行程序

编译成功后会在当前目录下生成一个button可执行文件。执行button前需要启动TpWM

#TpWM
./button

详细教程

• 应用开发详细教程参考开发第一个APP
• 组件开发详细教程参考自定义组件
• 示例程序examples

版权所有

版权归属：TinyPiXOS

许可证：署名-相同方式共享 4.0 国际 (CC-BY-SA-4.0)