创建响应式用户界面

开发包含了针对不同大小的视区调整多个布局的
FactoryTalk Optix 应用程序
。
  1. 针对不同的应用程序布局创建屏幕类型。请参见屏幕。
    小贴士: 首先为不同视口（如小、中、大）开发三种布局。有关更多信息，请参见 响应式设计的屏幕尺寸和断点 - Windows 应用程序 | Microsoft Learn。
  2. 创建一个 NetLogic，用于读取窗口宽度（和高度）并根据断点输出值。
    例如，创建一个 NetLogic，以读取窗口宽度并返回
    小
    、
    中
    或
    大
    枚举值。
    在运行时，当您调整窗口大小并超出断点值时，NetLogic 将返回一个值。
  3. 创建一个带有键值转换器的面板加载器，该转换器可将 NetLogic 输出的值转换为针对屏幕类型的动态链接。
    在运行时，面板加载器会根据窗口宽度显示特定屏幕类型。当您调整窗口大小并超出断点值时，应用程序布局会改变，以适应不同的视区大小。
  4. （可选）要在支持的 Web 浏览器中运行响应式应用程序，请执行以下操作：
    1. 添加 Web 演示引擎。请参见创建画面引擎。
    2. 在 Web 浏览器窗口中拉伸项目。在
      项目视图
      中，选择
      MainWindow (type)
       并：
      • 在
        属性
        中，在
        全屏
        和
        别名
        {Session}
        会话
        UI 会话
        Web 会话
        之间创建动态链接。
        有关动态链接的更多信息，请参见创建动态链接。
        如果项目在 Web 浏览器中运行，则
        {Session}/IsWeb
         别名将解析为
        True
        。有关更多信息，请参见不同画面引擎的配置文件对象。
        在运行时，本地演示引擎显示窗口应用程序，Web 演示引擎则根据 Web 浏览器窗口宽度显示特定的屏幕类型。
      • 在
        属性
        中，将
        全屏
        设置为
        真
        。
        在运行时，本地演示引擎显示全屏应用程序，Web 演示引擎则根据 Web 浏览器窗口宽度显示特定的屏幕类型。
    当您调整 Web 浏览器大小并超出断点值时，应用程序布局会改变，以适应不同的视区大小。
提供反馈
对本文档有问题或反馈吗？ 请在这里提交您的反馈 。