### 如何用 Python 和 PySide6 在 QML 中实现具体功能 在 PySide6 的开发环境中，QML 是一种声明式的 UI 定义语言，可以用来构建现代图形用户界面。通过将 Python 脚本与 QML 结合起来，开发者可以在前端提供美观的用户体验，同时利用 Python 后端的强大计算能力。 以下是关于如何使用 Python 和 PySide6 在 QML 中实现具体功能的关键点： #### 1. 创建自定义类用于信号传递 为了使 Python 数据能够被 QML 接收并显示，通常会创建一个继承 `QObject` 的自定义类，并在此类中定义必要的属性和方法。这些属性可以通过 Qt 的元对象系统 (Meta Object System) 进行绑定[^1]。 ```python from PySide6.QtCore import QObject, Signal, Slot, Property class SerialPort(QObject): dataChanged = Signal(str) def __init__(self, parent=None): super().__init__(parent) self._data = "" @Slot() def readData(self): # 假设这里是从串口中读取数据 new_data = "Serial Data" if new_data != self._data: self._data = new_data self.dataChanged.emit(new_data) @Property(str, notify=dataChanged) def data(self): return self._data ``` 上述代码展示了如何定义一个名为 `SerialPort` 的类，该类具有一个 `readData()` 方法以及一个可通知变化的数据属性 `data`。当数据发生变化时，它会触发 `dataChanged` 信号以便于 QML 更新其视图。 #### 2. 加载 QML 文件并与上下文关联 接下来需要编写一段逻辑来加载 QML 文件并将之前定义好的 Python 对象注册到 QML 上下文中。这样可以让 QML 访问来自 Python 层的功能[^2]。 ```python import sys from PySide6.QtGui import QGuiApplication from PySide6.QtQml import QQmlApplicationEngine from serial_port_class import SerialPort # 导入上面定义的类 if __name__ == "__main__": app = QGuiApplication(sys.argv) engine = QQmlApplicationEngine() # 初始化我们的自定义类实例 serial_instance = SerialPort() # 将此实例暴露给 QML context = engine.rootContext() context.setContextProperty("serialObject", serial_instance) # 加载 qml 文件 engine.load('main.qml') if not engine.rootObjects(): sys.exit(-1) sys.exit(app.exec()) ``` 这段程序负责启动应用程序、初始化引擎、设置根上下文中的变量名 (`serialObject`) 并最终呈现主窗口。 #### 3. 编写对应的 QML 文件 最后一步是在 QML 文件里实际调用已公开的方法或者监听特定事件的发生。下面是一个简单的例子展示怎样操作按钮去请求新的串口数据并且动态更新文本框的内容[^3]: ```qml import QtQuick 2.15 import QtQuick.Controls 2.15 ApplicationWindow { visible: true width: 640 height: 480 title: qsTr("PySide6-QML Example") Column { anchors.centerIn: parent spacing: 20 Button { text: "Read Serial Port" onClicked: serialObject.readData() // 调用 python 函数 } Text { id: displayText text: "No data yet." font.pixelSize: 20 } Connections { target: serialObject onPropertyChanged: displayText.text = propertyValue; console.log(propertyValue); } } } ``` 在这里我们看到每当按下 “Read Serial Port” 按钮的时候都会执行一次远程过程调用 RPC 到服务器端也就是这里的 Python 部分；另外还设置了连接器使得任何由 backend 发起的状态改变都能立刻反映至 frontend 显示出来。 ---