界面 XML 描述

界面描述是一个 XML 文件,包含 可视化组件数据组件 和一些界面参数的声明性定义。

使用 Studio 界面设计器 配置 XML 描述。

例如,这是编辑界面的 XML 描述:

<window xmlns="http://jmix.io/schema/ui/window"
        focusComponent="demoForm"
        caption="msg://window.caption">
    <data>
        <instance id="orderDc"
                  class="ui.ex1.entity.Order">
            <fetchPlan extends="_base"/>
            <loader/>
        </instance>
    </data>
    <facets>
        <dataLoadCoordinator auto="true"/>
        <screenSettings id="settingsFacet" auto="true"/>
    </facets>
    <actions>
        <action id="windowCommitAndClose" caption="msg:///actions.Ok"
                icon="EDITOR_OK"
                primary="true"
                shortcut="${COMMIT_SHORTCUT}"/>
        <action id="windowClose"
                caption="msg:///actions.Close"
                icon="EDITOR_CANCEL"/>
    </actions>
    <dialogMode height="600"
                width="800"/>
    <layout spacing="true" expand="editActions">
        <form id="demoForm" dataContainer="orderDc">
            <column width="350px">
                <timeField id="deliveryTimeField" property="deliveryTime"/>
                <textField id="ratingField" property="rating"/>
                <dateField id="dateField" property="date"/>
                <textField id="amountField" property="amount"/>
            </column>
        </form>
        <hbox id="editActions" spacing="true">
            <button id="commitAndCloseBtn" action="windowCommitAndClose"/>
            <button id="closeBtn" action="windowClose"/>
        </hbox>
    </layout>
</window>

window 元素是界面 XML 描述的根元素,有如下属性:

  • class - 控制器 类名。

  • caption - 窗口标题,可以是消息包中的一个消息键值。

  • focusComponent - 一个组件的 id,界面展示时,默认焦点位于该组件。

界面描述的元素:

  • data - 定义界面的数据组件。

  • dialogMode - 定义界面作为对话框打开时的大小及行为的设置。

    dialogMode 的属性:

    • closeable - 定义对话框窗口是否有关闭按钮。可选值:truefalse

    • closeOnClickOutside - 当窗口是模态窗时,定义是否允许通过单击窗口之外的区域来关闭对话框窗口。可选值:truefalse

    • forceDialog - 指定界面应始终以对话框方式打开,可选值:truefalse

    • height - 设置对话框窗口的高度。

    • modal - 指定对话框窗口是否是模态框。可选值:truefalse

    • positionX - 设置对话框窗口左上角的 x 坐标。

    • positionY - 设置对话框窗口左上角的 y 坐标。

    • resizable - 定义用户是否可以更改对话窗口的大小。可选值:truefalse

    • width - 设置对话框窗口的宽度。

      <dialogMode height="600"
                  width="800"
                  positionX="200"
                  positionY="200"
                  forceDialog="true"
                  resizable="true"/>
  • actions - 定义界面的 操作 列表。

  • facets - 定义界面的 facets 列表。

  • layout - 界面布局的根元素。