更多内容请访问：Harmonyos技术社区https://harmonyos.51cto.com万物互联的时代，作为应用开发者的你是否面临同样的问题？在手机、手表、大屏、汽车、平板电脑、电脑，甚至更小的物联网设备上部署应用的问题？您是否花费大量时间在不同设备的屏幕适配上？您是否面临同一个应用需要支持十多种不同交互方式分布在不同设备上的挑战？开发多设备场景下的应用，开发者面临着设备外形差异带来的开发挑战：不同的设备屏幕尺寸、屏幕分辨率、屏幕形状都不尽相同，这使得开发UI风格的难度加大不同的设备。同时，不同设备上不同的交互方式也带来了交互维度的发展挑战。面对设备形态差异带来的开发挑战，HarmonyOS有针对性地提出了两种解决方案。一个是围绕UI维度，另一个是围绕交互维度。终端形态差异化挑战的解决方案围绕UI维度的解决策略主要包括以下几个方面：多态控件同一个控件在不同的设备上有不同的形态和交互方式，称为多态。比如开关按钮的UI效果要求在不同的设备上是不一样的。手机一般采用滑条的形式，大屏基本都是滴答划线的形式，而不是滑条。但是，你会发现，虽然形式不同，但是描述或者实现的结果是一样的。HarmonyOS的多态控件可以对同一个按键进行相同的描述，但在不同的设备上会有不同的呈现和体验。同时设计可以直接贴合相应器件的设计规范。HarmonyOS通过多态控件实现“统一表达”，帮助开发者进一步降低开发成本。众所周知动态布局，仅仅解决控制问题是不够的，开发中还会涉及到布局问题。布局问题如果细分的话，可以分为内容框架和界面元素两个维度。内容框架是指整个内容的布局，比如横屏或者竖屏，内容呈现的一般形式是什么。界面元素是指布局在内容框架中的元素。开发中需要解决的问题是如何排列，能否扩展。HarmonyOS通过动态布局实现按需访问。本质上，不同的布局可用于不同的分辨率。同时，在分辨率变化的情况下，提供光栅化和原子布局能力，结合UI元素，如缩放、自动换行、自动隐藏等。通过这一基础能力，可以实现更好的屏幕适配，帮助开发者进一步提升屏幕布局。围绕交互维度，HarmonyOS引入了交互事件归一化的解决策略：事件归一化虽然我们都知道不同平台的交互方式不同，但想要达到的效果是一样的。在这种思想的驱动下，HarmonyOS通过框架层屏蔽输入差异，将不同的输入转化为统一的事件，让交互事件的接口尽可能保持一致，让开发者在响应控件时只需要关心一致的事件，从而更好的实现一致性对交互做出反应。以上就是HarmonyOS针对设备形态差异挑战的解决方案。这些解决方案将被封装到HarmonyOSUI框架中，让开发者直接调用相应的接口进行开发，提高开发效率。HarmonyOSUI框架这套HarmonyOS的UI框架叫做AbilityCross-platformEnvironment，ACEUI框架，可以支持主流的开发语言——Java和JavaScript，分别对应命令式和声明式开发模式。对于JavaUI框架来说，命令式开发模式是比较细粒度的API，完全由开发者控制。开发者通过操作UI实现特定的变化，通过调用API实现整个UI编程的目的。这是开发人员处理的更常见的开发模式。JavaUI框架的基本架构是上层细粒度的UI编程接口，中间是命令式的UI后端引擎（包括UI组件、布局计算、视图管理……），其次是跨平台渲染引擎基础设施。同时HarmonyOS还提供了一个JavaScriptUI框架，即JSUI框架。声明式模式对于UI描述来说是比较高级的。本质上，声明式模式主要依靠描述来进行UI操作。下面的UI变化是通过数据驱动来实现的，这些变化的实际操作是通过框架层来处理的。相当于开发者只需要声明式的描述UI，明确什么样的数据状态变化，涉及到什么样的UI变化，剩下的交给框架层去实现。JSUI框架的基本架构是，上层是高层UI描述接口，中间是声明式UI后端引擎，包括UI组件、布局计算、视图管理……，接下来是跨平台渲染引擎基础设施。下面我们来看看JSUI和JavaUI的框架是什么样子的。JSUIFramework整体架构从上图可以看出，JSUI整体架构的大维度主要分为前端和后端。1、前端前端主要是JavaScript的前端框架。这里采用类似web的前端开发模式来开发相应的UI。2.后端后端主要分为以下几个部分：UI引擎部分是渲染构造部分**，包括JS执行引擎本身**，C++构建的声明式UI后端引擎（包括UI组件实现，布局view,animationevent)和渲染引擎，共同构建整个UI的呈现。中间转换层通过中间转换层将之前的JSUI描述转换成声明式UI，让后端引擎去执行。能力扩展HarmonyOS提供了“扩展API”，包括各种分布式能力和系统的基础能力。通过基础设施的扩展能力，开发者可以调用JavaScriptAPIs实现更丰富的逻辑功能。跨平台适配层从设计上来说，HarmonyOS可以实现跨设备、跨OS。主要是整个渲染路径完全由后端自己绘制，通过底层画布实现UI功能，对OS的依赖性比较小，可以达到跨平台的效果。在架构设计上，平台桥接层可以运行在HarmonyOS上，也可以运行在其他OS上。这里的前提是HarmonyOS会打通其他OS的基础设施和基础能力，达到扩容的目的。当然，同时也离不开工具的帮助。通过IDE和其他相应的工具链，我们可以实现通过JS开发后部署到不同设备上的目的。总的来说，HarmonyOS通过声明式的UI框架，借用Web-like前端简单的开发能力，结合后端引擎的高性能能力，帮助开发者实现易开发、高性能的目标。通过HarmonyOS的跨平台渲染基础设施，可以实现相对一致的跨平台体验。例如在电视或手表上的预览路径和渲染路径基本一致，实现更好的实时预览效果和更一致的渲染体验。运行流程通过上面的流程图我们可以看出，一个应用在启动时，首先是从Ability（HarmonyOS运行的最基本单元）开始，Ability中有UI的框架部分。前端框架的总体职责是加载、解析和运行JS应用，完成前端开发范式的组件树与声明式后端渲染框架层的组件树之间的复杂连接。后端渲染框架是整个渲染管线管理的核心部分。它维护着三棵渲染相关的树：Componenttree、Elementtree和Rendertree。一些比较耗时的IO操作，比如图片相关的获取和加载，放在一个单独的IO线程中，统一管理到容器中。有了动画、事件等，UI线程的绘制就完成了。最后由渲染引擎负责上屏的光栅化合成，构建高效的渲染管线。这是完全的多线程设计，也就是说前端部分、JS线程、UI线程、IO线程可以并行处理，从而达到更好的执行效率和更高的性能。这是一个粗略的ACEJS运行过程。应用示例我们来看一个具体的例子——一个可以同时在手表和大屏幕上运行的音乐应用。代码构成分为三部分——模板、样式和业务逻辑。模板基本上描述了整个UI结构。样式描述了整个UI结构的呈现方式。业务逻辑有数据绑定声明来获取数据之间的关联。扩展能力声明，可以调用系统中的各种能力进行功能扩展。在多UI适配方面，HarmonyOS支持业界主流机制，实现动态布局和UI适配能力。JSUI为数百个K级设备提供了一个轻量级的框架。上面说的都是富设备的设备UI架构。所谓richdevice就是内存比较充足，至少512Mb以上。针对轻量级设备和小内存设备，HarmonyOS提供了轻量级的框架。在轻量级框架上，HarmonyOS下沉了一些核心框架，C++，提供了轻量级的JS引擎，包括UI组件，达到了非常轻量的目的。通过统一的开发范式，它可以在数百K的资源上运行起来。但是由于是在轻量级的框架设备上，能力还是有限的，有些资源受限的API可能不提供，但是public部分的API是完全通用的。JavaUI框架不同于JS的声明式风格。Java更面向命令式开发模式，从API维度上会更丰富、更细粒度。它还具有多态控件、布局和其他功能。整体架构从逻辑上讲，它的整个架构分为五个部分。JavaUI框架界面层包括控件、布局、动画和描述。多态控件、布局和动效实现了核心的C++层，也有对应的多态控件布局和各种动效。视图管理生成UI控件对应的View对象，管理View对象的生命周期（更新、挂载、卸载、删除），维护View对象组成的UI层次关系。渲染树维护View对象对应的RenderNode，维护UI组件变化引起的渲染树变化，生成DrawCommand对应的RenderNode。2D/3D渲染引擎执行DrawCommand生成UI控件中包含的线、面和文本对象。最后，系统的综合构成了整个ACEJava架构。渲染过程这里简单介绍一下整个渲染过程。JavaUI渲染采用多线程设计，分为几个阶段：在应用程序框架部分，创建窗口和创建相应的JavaUI界面。资源加载完成后，对应的UI框架组件会转化为Native视图。Native视图包括整个控件布局实现、动态效果实现、视图抽象、事件处理、渲染抽象等，同步UI线程，渲染树会交给UI框架。渲染部分（GPU线程）用于相应的渲染和最终合成。这就是整个ACEJava的渲染过程。应用实例我们来看一个Java实例，它其实和传统的或者常用的Java开发模式很相似。整个布局都是通过XML来描述的，少不了多态控件的支持。组件是通过制定特定的XML以通过属性和值指定不同的样式来创建的。创建完成后，开发者可以设置各种交互、对应的事件处理以及后续的UI变化。当然鸿蒙OS也提供了相应的API来支持后续的改动。当然，多设备场景的开发还有很多挑战，需要我们不断提升和完善。当然也希望有很多开发者一起加入进来，和我们一起围绕跨设备开发相关的内容，更多的碰撞，共同逐步提升多设备开发体验。更多信息请访问：Harmonyos.51cto.com，与华为官方合作打造的鸿蒙技术社区
