迁移到触屏UI

从版本6.0开始,Adobe Experience Manager(AEM)引入了称为​触屏优化UI(也称为​触屏优化UI)的新用户界面。 它符合Adobe Marketing Cloud和整体Adobe用户界面准则。 在AEM中,这已成为标准UI,该UI具有以桌面为导向的旧版界面,称为​经典UI

如果您一直在将AEM与经典UI结合使用,则需要采取措施来迁移实例。 本页旨在通过提供指向各个资源的链接来充当跳板。

注意

此类迁移项目可能会对您的实例产生重大影响。 请参阅管理项目 — 最佳实践以了解推荐的准则。

基本信息

在迁移时,您应该了解经典UI和触屏UI之间的以下(主要)区别:

经典 UI 触屏优化 UI
在JCR存储库中描述为节点的结构。 表示UI元素的每个节点都称为ExtJS小组件,并由ExtJS在客户端呈现。 JCR存储库中也描述为节点的结构。 但是,在这种情况下,每个节点都引用Sling资源类型(Sling组件),负责其渲染。 因此UI(基本上)在服务器端呈现。

sling:resourceType

  • 未使用
sling:resourceType
  • 已使用
  • 例如
    cq/gui/components/authoring/dialog

对话框节点:

  • 名称: dialog
  • jcr:primaryType: cq:Dialog

对话框节点:

  • 名称: cq:dialog
  • jcr:primaryType: nt:unstructured

Javascript位置:

  • 使用侦听器直接嵌入必需部分,或在clientlib中管理必需部分。

Javascript位置:

  • 不能在对话框定义中嵌入必要部分;责任分离。

事件处理:

  • 对话框小组件直接引用Javascript代码。

事件处理:

  • Javascript会观察对话事件。
由客户端完成渲染:
  • 客户端动态创建UI组件。
  • 从服务器发出客户端请求(提取)组件定义(JSON格式)。
由服务器完成渲染:
  • 客户端请求页面以及相关的UI。
  • 服务器将UI作为HTML文档发送(推送);使用Coral UI组件。

换言之,将UI的某个部分从经典UI迁移到触屏UI意味着将​ExtJS小组件​迁移到​Sling组件。 为了简化此过程,触屏UI基于Granite UI框架,该框架已经为UI提供了一些Sling组件(称为Granite UI组件)。

开始之前,请检查状态和相关推荐:

触屏UI开发的基础知识将提供坚实的基础:

迁移页面创作

在迁移组件时,对话框是一个主要因素:

迁移控制台

您还可以自定义控制台:

尽管与迁移到触屏UI并非直接相关,但仍有一些相关问题值得同时考虑,因为也推荐使用以下实践:

注意

另请参阅开发 — 最佳实践

其他资源

有关开发AEM的完整信息,请参阅以下资源收集:

注意

AEM现代化工具是社区共同努力的结果,不受Adobe支持或保证。

在此页面上