C

Qt Quick Ultralite仪表盘示例

说明如何从C应用程序控制用户界面元素。

概述

本示例演示了如何从C应用程序控制用户界面元素。

目标平台

RH850 D1M1A AUTOSAR

项目结构

instrument_cluster示例包含以下文件

src/VehicleStatus.cpp
src/VehicleStatus.h
CMakeLists.txt
mcu_instrument_cluster.qmlproject
instrument_cluster.qml

CMake项目文件包含一个基本的构建脚本instrument_cluster.qml，该脚本定义了应用程序的UI。项目配置在mcu_instrument_cluster.qmlproject中定义。

除了这些文件外，src/simulation文件夹还包含一个简单的模拟器，为非AUTOSAR平台上的仪表盘提供输入数据

src/simulation/baremetal/main.cpp
src/simulation/freertos/main.cpp
src/simulator.cpp
src/simulator.h

fonts文件夹包含应用程序的字体文件

fonts/TitilliumWeb-Light.ttf
fonts/TitilliumWeb-SemiBold.ttf

CMake项目文件

注意：仅针对非AUTOSAR目标添加模拟文件。

cmake_minimum_required (VERSION 3.21.1)

project(instrument_cluster VERSION 0.0.1 LANGUAGES C CXX ASM)
if (NOT TARGET Qul::Core)
    find_package(Qul)
endif()

set(TARGET_SOURCES src/VehicleStatus.cpp)
set(INCLUDE_DIRECTORIES ${CMAKE_CURRENT_SOURCE_DIR}/src)
set(GENERATE_ENTRYPOINT_ARG "")

if(NOT QUL_PLATFORM MATCHES "autosar")
    set(SIMULATOR_DIR src/simulation)
    set(TARGET_SOURCES
        ${TARGET_SOURCES}
        ${SIMULATOR_DIR}/simulator.cpp
        ${SIMULATOR_DIR}/${QUL_OS_LOWERCASE}/main.cpp
    )
    set(INCLUDE_DIRECTORIES
        ${INCLUDE_DIRECTORIES}
        ${CMAKE_CURRENT_SOURCE_DIR}/src/simulation
    )
else()
    set(GENERATE_ENTRYPOINT_ARG GENERATE_ENTRYPOINT)
endif()

qul_add_target(instrument_cluster
    ${TARGET_SOURCES}
    QML_PROJECT mcu_instrument_cluster.qmlproject
    ${GENERATE_ENTRYPOINT_ARG}
)
app_target_setup_os(instrument_cluster)

target_include_directories(instrument_cluster PRIVATE
    ${INCLUDE_DIRECTORIES}
)

if(NOT CMAKE_CROSSCOMPILING AND NOT WIN32)
    add_custom_command(TARGET instrument_cluster
        COMMAND strip instrument_cluster -o instrument_cluster.stripped
        DEPENDS instrument_cluster)
endif()

QmlProject文件

import QmlProject 1.3

Project {
    mainFile: "instrument_cluster.qml"

    MCU.Config {
        defaultFontFamily: "Titillium Web"
    }
    FontFiles {
        files: [
            "fonts/TitilliumWeb-Light.ttf",
            "fonts/TitilliumWeb-SemiBold.ttf"
        ]
    }
    QmlFiles {
        files: [
            "instrument_cluster.qml"
        ]
    }
    InterfaceFiles {
        files: ["src/VehicleStatus.h"]
    }
}

VehicleStatus单例

VehicleStatus单例负责存储用于用户界面的车辆参数。它继承自Qul::Singleton以将公共信号和属性暴露给QML。它还继承自Qul::EventQueue，以提供事件队列，在属性值更改时触发用户界面更新。

    ...
    Qul::Property<int> speed;
    Qul::Property<double> tripMeter;
    Qul::Signal<void(bool leftBlinkerState)> leftBlinkerStateChange;
    Qul::Signal<void(bool rightBlinkerState)> rightBlinkerStateChange;
    ...

QML代码通过VehicleStatus单例访问这些值

    ...
    Text {
        id: speedometer
        color: "#2CDE85"
        anchors.centerIn: parent

        font.weight: Font.DemiBold
        font.pixelSize: 90
        text: VehicleStatus.speed
    }
    ...

使用虚拟的event queue触发仪表盘的重绘。事件处理需要Qt Quick Ultralite引擎执行更新。

...
void qul_application_send_value_change_event()
{
    VehicleStatus::instance().postEvent(true);
}
...

实际的事件处理器不做任何操作

    ...
    void onEvent(const bool &value)
    {
        // Dummy event queue to trigger UI updates
        (void) value;
    }
    ...

C连接函数被暴露给非GUI代码，以控制仪表盘内容

...
extern "C" {
void qul_application_set_speed(int speed)
{
    VehicleStatus::instance().speed.setValue(speed);
}
...

AUTOSAR 示例

在 AUTOSAR 项目中，Qt Quick Ultralite 复杂设备驱动程序 如下调用 C 链接 API

#include "VehicleStatus.h"
...
// QUL Complex Device Driver Runnable with a periodic trigger
void Cdd_Qul_Update(void)
{
    int changedValuesCount = 0;

    static int previousSpeed = 0;
    int speed;

    // Read the speed value via the AUTOSAR Interface
    // Rte_Read_Cdd_Qul_Speed(&speed);

    if (speed != previousSpeed) {
        changedValuesCount++;
        qul_application_set_speed(speed);
        previousSpeed = speed;
    }
    ...
    if (changedValuesCount > 0) {
        // Send an event to trigger repainting of the UI
        qul_application_send_value_change_event();
    }

    qul_update_engine(); // Calls Qul::Application::update()
}

文件

另请参阅 将 C++ 代码与 QML 集成.

根据某些 Qt 许可协议提供。
了解更多。