UI 文件

您可以使用 Qt 设计工作室向导创建具有 .ui.qml 扩展名的 UI 文件。可以在 2D 视图中编辑 UI 文件。如果您使用代码视图添加 2D 视图不支持的内容，Qt 设计工作室将显示错误消息。

以下功能在 .ui.qml 文件中不受支持：

• JavaScript 块
• 不同于纯表达式的其他绑定
• 信号处理程序
• 除了根组件之外的其他组件的状态
• 不是从 QQuickItem 或 Item 派生的根组件
• 引用根组件的父组件

以下组件不受支持：

• 行为
• 绑定
• 画布
• 着色器效果
• 定时器
• 转换

支持的方法

Qt 设计工作室支持 QML 引擎支持的绝大部分 JavaScript 函数，以及 Qt QML 方法的一部分。

本节列出您可在 .ui.qml 文件中使用的函数。

JavaScript 函数

一般情况下，支持“纯函数”。它们只依赖于并修改它们作用域内参数的状态，因此只要给定相同的参数就始终返回相同的结果。这使得能够在不破坏 .ui.qml 文件的情况下转换和重新格式化属性绑定。

以下 JavaScript 函数是受支持的：

• charAt()
• charCodeAt()
• concat()
• endsWith()
• includes()
• indexOf()
• isFinite()
• isNaN()
• lastIndexOf()
• substring()
• toExponential()
• toFixed()
• toLocaleLowerCase()
• toLocaleString
• toLocaleUpperCase()
• toLowerCase()
• toPrecision()
• toString()
• toUpperCase()
• valueOf()

此外，所有 Math 和 Date 对象的函数都受支持。

有关更多信息，请参阅JavaScript 对象和函数列表。

Qt QML 方法

Qt Design Studio 支持颜色方法、用于创建特定数据类型对象的辅助方法以及翻译方法。

以下为支持的颜色方法：

• Qt.darker()
• Qt.hsla()
• Qt.hsva()
• Qt.lighter()
• Qt.rgba()
• Qt.tint()

以下为支持的辅助方法：

• Qt.formatDate()
• Qt.formatDateTime()
• Qt.formatTime()
• Qt.matrix4x4()
• Qt.point()
• Qt.quaternion()
• Qt.rect()
• Qt.size()
• Qt.vector2d()
• Qt.vector3d()
• Qt.vector4d()

以下为支持的翻译方法：

• qsTr()
• qsTranslate()
• qsTranslateNoOp()
• qsTrId()
• qsTrIdNoOp()
• qsTrNoOp()

有关使用这些方法的更多信息，请参阅Qt QML方法。

使用UI文件

您可以在2D和代码视图中编辑UI文件。应使用的组件必须导出为属性

Item {
    width: 640
    height: 480

    property alias button: button

    Button {
        anchors.centerIn: parent
        id: button
        text: qsTr("Press Me")
    }
}

属性别名将按钮导出到使用表单的代码。您可以使用 Navigator 中的（导出）按钮来将组件作为属性导出

在用于组件的UI文件中，您可以使用button属性别名来实现信号处理器，例如。在下面的代码片段中，UI文件名为MainForm.ui.qml

MainForm {
    anchors.fill: parent
    button.onClicked: messageDialog.show(qsTr("Button pressed"))
}

您还可以分配属性或定义行为或过渡。

要直接从2D或Navigator视图转到组件在 .qml 文件中的实现，右键单击组件并从上下文菜单中选择转到实现。