CN112052002B - 基于声明式编程框架的用户界面生成方法、装置及介质 - Google Patents

Abstract

本公开关于一种基于声明式编程框架的用户界面生成方法、装置及介质，涉及移动端开发领域，该框架包括：基础控件、基础容器、状态管理组件、页面切换组件和生命周期管理组件；该方法包括：确定待构建的用户界面；调用基于声明式语法的声明式编程框架生成用户界面；其中，声明式编程是一种不使用控制流来表示计算逻辑的编程范式，声明式语法用于描述用户界面的样式；基础控件是构成用户界面的基本元素；基础容器负责组合基础控件；状态管理组件负责当界面状态发生变化时控制用户界面进行相应变化；页面切换组件负责切换用户界面；生命周期管理组件负责数据和基础控件的创建和销毁。基于该框架构建用户界面兼顾了用户界面的开发效率和可维护性。

Description

基于声明式编程框架的用户界面生成方法、装置及介质

技术领域

本公开涉及移动端开发领域，尤其涉及一种基于声明式编程框架的用户界面生成方法、装置及介质。

背景技术

在移动端开发领域，用户界面(User Interface,UI)开发是最为基础的一部分工作。通常情况下，在iOS系统上为原生应用程序开发用户界面主要采取命令式的代码构建方式。其中，命令式的代码构建方式关注计算机执行的步骤，即计算机通过逐步执行命令来改变应用程序状态。从开发人员的角度来讲，命令式的代码构建方式是一个“输入→函数1→状态1→函数2→状态2→…→输出”的过程。该种代码构建方式的缺点是开发效率低。

发明内容

本公开提供一种基于声明式编程框架的用户界面生成方法、装置及介质，能够兼顾用户界面的开发效率和可维护性。本公开的技术方案如下：

根据本公开实施例的第一方面，提供一种基于声明式编程框架的用户界面生成方法，所述声明式编程框架包括：基础控件、基础容器、状态管理组件、页面切换组件和生命周期管理组件；所述方法包括：

确定待构建的用户界面；

调用基于声明式语法的所述声明式编程框架生成所述用户界面；

其中，所述声明式编程是一种不使用控制流来表示计算逻辑的编程范式，所述声明式语法用于描述所述用户界面的样式；所述基础控件是构成用户界面的基本元素；所述基础容器负责组合所述基础控件；所述状态管理组件负责当界面状态发生变化时控制所述用户界面进行相应变化；所述页面切换组件负责切换用户界面；所述生命周期管理组件负责数据和所述基础控件的创建和销毁。

在一种可能的实现方式中，所述用户界面的界面状态变化由数据驱动，且数据驱动模式为单一数据驱动；其中，所述单一数据驱动是指父视图保存数据变量，至少两个子视图通过读取保存的数据变量来确定是否进行样式变化。

在一种可能的实现方式中，所述调用基于声明式语法的所述声明式编程框架生成所述用户界面，包括：

基于所述声明式语法，构造用于组成所述用户界面的至少一个基础控件；

对于所述至少一个基础控件中的任意一个基础控件，采用链式调用方式声明所述基础控件内对象的属性信息；所述链式调用方式用于多次声明对所述对象的属性要求。

在一种可能的实现方式中，所述调用基于声明式语法的所述声明式编程框架生成所述用户界面，包括：

基于目标页面布局方式和目标布局容器对所述用户界面进行动态布局；

其中，所述目标页面布局方式是指通过定义约束来控制所述用户界面上页面元素的位置和尺寸大小；通过设置所述目标布局容器的排列属性能够约束所述目标布局容器内子视图的排列方式。

在一种可能的实现方式中，所述调用基于声明式语法的所述声明式编程框架生成所述用户界面之后，所述方法包括：

当数据发生变化时，调用基于声明式语法的所述声明式编程框架，刷新发生变化的数据对应的目标基础控件，以使所述目标基础控件展示发生变化后的数据。

在一种可能的实现方式中，所述确定待构建的用户界面，调用基于声明式语法的所述声明式编程框架生成所述用户界面，包括：

若所述用户界面为一个新页面，则调用基于声明式语法的所述声明式编程框架生成所述新页面；或，

若所述用户界面为一个待构建局部视图的历史页面，则调用基于声明式语法的所述声明式编程框架生成所述局部视图，并将所述局部视图添加到所述历史页面中。

根据本公开实施例的第二方面，提供一种基于声明式编程框架的用户界面生成装置，所述声明式编程框架包括：基础控件、基础容器、状态管理组件、页面切换组件和生命周期管理组件；所述装置包括：

确定模块，被配置为确定待构建的用户界面；

生成模块，被配置为调用基于声明式语法的所述声明式编程框架生成所述用户界面；

其中，所述声明式编程是一种不使用控制流来表示计算逻辑的编程范式，所述声明式语法用于描述所述用户界面的样式；所述基础控件是构成用户界面的基本元素；所述基础容器负责组合所述基础控件；所述状态管理组件负责当界面状态发生变化时控制所述用户界面进行相应变化；所述页面切换组件负责切换用户界面；所述生命周期管理组件负责数据和所述基础控件的创建和销毁。

在一种可能的实现方式中，所述用户界面的界面状态变化由数据驱动，且数据驱动模式为单一数据驱动；其中，所述单一数据驱动是指父视图保存数据变量，至少两个子视图通过读取保存的数据变量来确定是否进行样式变化。

在一种可能的实现方式中，所述生成模块，被配置为基于所述声明式语法，构造用于组成所述用户界面的至少一个基础控件；对于所述至少一个基础控件中的任意一个基础控件，采用链式调用方式声明所述基础控件内对象的属性信息；所述链式调用方式用于多次声明对所述对象的属性要求。

在一种可能的实现方式中，所述生成模块，被配置为基于目标页面布局方式和目标布局容器对所述用户界面进行动态布局；

其中，所述目标页面布局方式是指通过定义约束来控制所述用户界面上页面元素的位置和尺寸大小；通过设置所述目标布局容器的排列属性能够约束所述目标布局容器内子视图的排列方式。

在一种可能的实现方式中，所述生成模块，还被配置为当数据发生变化时，调用基于声明式语法的所述声明式编程框架，刷新发生变化的数据对应的目标基础控件，以使所述目标基础控件展示发生变化后的数据。

在一种可能的实现方式中，所述生成模块，被配置为若所述用户界面为一个新页面，则调用基于声明式语法的所述声明式编程框架生成所述新页面；或，若所述用户界面为一个待构建局部视图的历史页面，则调用基于声明式语法的所述声明式编程框架生成所述局部视图，并将所述局部视图添加到所述历史页面中。

根据本公开实施例的第三方面，提供一种电子设备，包括：

处理器；

用于存储所述处理可执行指令的存储器；

其中，所述处理器被配置为执行所述指令，以实现上述的基于声明式编程框架的用户界面生成方法。

根据本公开实施例的第四方面，提供一种存储介质，当所述存储介质中的指令由电子设备的处理器执行时，使得所述电子设备能够执行上述的基于声明式编程框架的用户界面生成方法。

根据本公开实施例的第五方面，提供一种计算机程序产品，所述计算机程序产品中的指令由电子设备的处理器执行时，使得所述电子设备能够执行上述的基于声明式编程框架的用户界面生成方法。

本公开的实施例提供的技术方案至少带来以下有益效果：

本公开实施例提供了一种声明式编程框架，通过调用这个基于声明式语法的声明式编程框架来生成用户界面；其中，声明式编程是一种不使用控制流来表示计算逻辑的编程范式，而声明式语法则用于描述用户界面的样式。由于基于声明式语法的声明式编程框架具有易于阅读、易于编写、语法简洁等特点，因此基于该声明式编程框架构建用户界面大大提高了采用代码构建方式生成用户界面的便利程度，同时可维护性也较好，即兼顾了用户界面的开发效率和可维护性。

应当理解的是，以上的一般描述和后文的细节描述仅是示例性和解释性的，并不能限制本公开。

附图说明

此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本公开的实施例，并与说明书一起用于解释本公开的原理，并不构成对本公开的不当限定。

图1是根据一示例性实施例示出的一种基于声明式编程框架的用户界面生成方法涉及的实施环境的示意图。

图2是根据一示例性实施例示出的一种基于声明式编程框架的用户界面生成方法的流程图。

图3是根据一示例性实施例示出的一种声明式编程框架的架构框图。

图4是根据一示例性实施例示出的一种数据驱动模式的示意图。

图5是根据一示例性实施例示出的另一种数据驱动模式的示意图。

图6是根据一示例性实施例示出的一种基于声明式编程框架的用户界面生成方法的流程图。

图7是根据一示例性实施例示出的一种基于声明式编程框架的用户界面生成装置的框图。

图8是根据一示例性实施例示出的一种电子设备的框图。

具体实施方式

为了使本领域普通人员更好地理解本公开的技术方案，下面将结合附图，对本公开实施例中的技术方案进行清楚、完整地描述。

需要说明的是，本公开的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象，而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换，以便这里描述的本公开的实施例能够以除了在这里图示或描述的那些以外的顺序实施。以下示例性实施例中所描述的实施方式并不代表与本公开相一致的所有实施方式。相反，它们仅是与如所附权利要求书中所详述的、本公开的一些方面相一致的装置和方法的例子。

本公开所涉及的用户信息可以为经用户授权或者经过各方充分授权的信息。

在对本公开实施例进行详细地解释说明之前，先对本公开实施例可能涉及到的一些名词术语或缩略语进行介绍。

SWIFT：是一款易学易用的编程语言，支持多编程范式和编译式，而且它还是第一套具有与脚本语言同样的表现力和趣味性的系统编程语言。SWIFT的设计以安全为出发点，以避免各种常见的编程错误类别。另外，SWIFT采用安全的编程模式并添加了很多新特性，这将使编程更简单，更灵活，也更有趣。

iOS:一款专有的移动操作系统，为许多移动设备提供操作界面。

UI：它是系统和用户之间进行交互和信息交换的媒介，它实现信息的内部形式与人类可以接受形式之间的转换。

AutoLayout：自动约束，是一种页面布局机制。

UIStackView：栈视图，是一种常用的布局控件。

下面对本公开实施例提供的一种基于声明式编程框架的用户界面生成方法涉及的实施环境进行介绍。

参见图1，该实施环境包括：用户101和电子设备102。其中，电子设备102用于执行本公开实施例提供的基于声明式编程框架的用户界面生成方法。示例性地，电子设备102可以为具有显示屏的计算机设备，比如电子设备102通常情况下可以为移动式终端。

在一种可能的实现方式中，移动式终端包括但不限于：智能手机、平板电脑、笔记本电脑、电子阅读器、MP3播放器(Moving Picture Experts Group Audio Layer III，动态影像专家压缩标准音频层面3)、MP4(Moving Picture Experts Group Audio Layer IV，动态影像专家压缩标准音频层面4)播放器等，本公开实施例对此不进行具体限定。

基于上述的实施环境，为了兼顾构建用户界面的开发效率和可维护性，本公开实施例提供了一种声明式的UI开发方式，其采用声明式编程方式来构建用户界面，大大提高了使用代码构建方式生成用户界面的便利程度，同时可维护性也较好。另外，本公开实施例基于声明式语法且使用易于阅读和编写的SWIFT编程语言，只需要几行代码就可以渲染出复杂的用户界面和动画，因此在构建用户界面时既达到了高开发效率的要求，同时也具备易使用和易维护的特性。

综上所述，为了避免相关技术中UI开发时采用代码构建方式所带来的繁琐和重复工作，本公开实施例提供了一种声明式的UI构建方案，实现了仅用少量的代码就可以构建出复杂的用户界面。另外，为了避免相关技术中UI开发时采用可视化编程方式所带来的维护难的问题，本公开实施例提供了一种声明式的UI构建方案，实现了即便使用代码也可以方便地构建出复杂的用户界面。另外，本公开实施例提供了一种向下兼容的声明式编程框架，对开发环境要求不高，向下最低可以兼容iOS9系统，并且其实现是基于目前早已趋于稳定的基础接口，该声明式编程框架不会发生较大的改动，为兼容性提供了保障。

下面通过以下实施方式对本公开实施例提供的一种基于声明式编程框架的用户界面生成方案进行详细地解释说明。

图2是根据一示例性实施例示出的一种基于声明式编程框架的用户界面生成方法的流程图，该声明式编程框架包括：基础控件、基础容器、状态管理组件、页面切换组件和生命周期管理组件。其中，基础容器负责组合基础控件；状态管理组件负责当界面状态发生变化时控制用户界面进行相应变化；页面切换组件负责切换用户界面；生命周期管理组件负责数据和基础控件的创建和销毁。如图2所示，该方法用于图1所示的电子设备中，包括以下步骤。

在步骤201中,确定待构建的用户界面。

在步骤202中,调用基于声明式语法的声明式编程框架生成用户界面；其中，声明式编程是一种不使用控制流来表示计算逻辑的编程范式，声明式语法用于描述用户界面的样式。

本公开实施例提供了一种声明式编程框架，通过调用这个基于声明式语法的声明式编程框架来生成用户界面；其中，声明式编程是一种不使用控制流来表示计算逻辑的编程范式，而声明式语法则用于描述用户界面的样式。由于基于声明式语法的声明式编程框架具有易于阅读、易于编写、语法简洁等特点，因此基于该声明式编程框架构建用户界面大大提高了采用代码构建方式生成用户界面的便利程度，同时可维护性也较好，即兼顾了用户界面的开发效率和可维护性。

在一种可能的实现方式中，所述用户界面的界面状态变化由数据驱动，且数据驱动模式为单一数据驱动；其中，所述单一数据驱动是指父视图保存数据变量，至少两个子视图通过读取保存的数据变量来确定是否进行样式变化。

在一种可能的实现方式中，所述调用基于声明式语法的所述声明式编程框架生成所述用户界面，包括：

基于所述声明式语法，构造用于组成所述用户界面的至少一个基础控件；

对于所述至少一个基础控件中的任意一个基础控件，采用链式调用方式声明所述基础控件内对象的属性信息；所述链式调用方式用于多次声明对所述对象的属性要求。

在一种可能的实现方式中，所述调用基于声明式语法的所述声明式编程框架生成所述用户界面，包括：

基于目标页面布局方式和目标布局容器对所述用户界面进行动态布局；

其中，所述目标页面布局方式是指通过定义约束来控制所述用户界面上页面元素的位置和尺寸大小；通过设置所述目标布局容器的排列属性能够约束所述目标布局容器内子视图的排列方式。

在一种可能的实现方式中，所述调用基于声明式语法的所述声明式编程框架生成所述用户界面之后，所述方法包括：

当数据发生变化时，调用基于声明式语法的所述声明式编程框架，刷新发生变化的数据对应的目标基础控件，以使所述目标基础控件展示发生变化后的数据。

在一种可能的实现方式中，所述确定待构建的用户界面，调用基于声明式语法的所述声明式编程框架生成所述用户界面，包括：

若所述用户界面为一个新页面，则调用基于声明式语法的所述声明式编程框架生成所述新页面；或，

若所述用户界面为一个待构建局部视图的历史页面，则调用基于声明式语法的所述声明式编程框架生成所述局部视图，并将所述局部视图添加到所述历史页面中。

上述所有可选技术方案，可以采用任意结合形成本公开的可选实施例，在此不再赘述。

图3是根据一示例性实施例示出的一种声明式编程框架的架构框图。

其中，声明式编程是一种不使用控制流来表示计算逻辑的编程范式。详细来说，与命令式代码构建方式着重于“怎么做”不同，声明式的代码构建方式更注重于“要什么”。示例性地，对于构建一个文本标签的过程，针对命令式代码构建方式，相应代码的每一行都在对这个文本标签做不同的描述，比如展示什么文本、使用何种对齐方式、使用何种字体等。而采用声明式编程的声明式语法则不同，相应代码都是直接在表达需要什么，比如需要一个列表，并且该列表中的每个元素都由一张图片和两个文本标签构成。

需要说明的第一点是，声明式的代码构建方案并不是不关心“怎么做”，而是将“怎么做”也转化成为“要什么”。即，声明式语法用于描述用户所需的用户界面的样式。比如，“.font(.title)”表示需要这个文本标签展示类型为“title”的字体,而“.foregroundColor(.red)”表示需要这个文本标签展示红色的文本。

需要说明的第二点是“.font”和“.fouregroundColor”这样的“点语法”也是声明式代码构建方案中的一个特点，原则上可以通过这种链式的方法无限地声明对一个对象的属性要求。即，可以采用链式调用方式声明对象的属性信息；换言之，链式调用方式用于多次声明对一个对象的属性要求。

参见图3，该声明式编程框架包括：基础控件301、基础容器302、状态管理组件303、页面切换组件304和生命周期管理组件305。下面对该声明式编程框架包括的各个部分依次进行介绍。

基础控件301

其中，基础控件301是构成用户界面的基本元素；换言之，基础控件301是构成用户界面的基础。如图3所示，基础控件301包括但不限于：按钮(Button)、图片(ImageView)、标签(Label)、留白占位(Spacer)、文本框(TextField)、开关(Switch)、原生布局(NativeView)、空布局(EmptyView)、属性文本(AttributedText)。

基础容器302

其中，基础容器302负责组合基础控件；例如一个列表容器可以将一组图片排列展示。

如图3所示，基础容器302包括但不限于：栈(Stack)、滚动条(ScrollView)、容器(Container)、循环(ForEach)、弹性盒(Flexbox)、列表(List)。其中，Stack可以包括：垂直布局(VStack)、水平布局(HStack)、深度布局(ZStack)。其中，Flexbox可以包括：Column(列)Row(行)。

状态管理组件303

其中，状态管理组件303负责用户界面的动态显示效果，也是应用程序生命周期中的数据驱动器，例如一段文字可能伴随不同的事件作出不同改变。

举例来说，对于一个日程管理程序，某个日程可能具有不同的状态：待定、进行中、已完成、过期等，因此需要一个角色来管理这些状态，并且在状态发生变化的时候驱动页面进行变化(比如待定状态显示黄色、已完成显示绿色、过期显示红色等)，而状态管理组件303的功能即是扮演这个角色。

换言之，状态管理组件303负责当界面状态发生变化时控制用户界面进行相应变化；其中，界面状态变化由数据驱动且数据驱动模式为单一数据驱动。在本公开实施例中，界面状态的变化由数据驱动，并且反作用于数据，这种双向绑定模式依赖的关键技术点便是单一数据驱动。

其中，单一数据驱动是一种开发模式，示例性地，图4和图5示出了两种数据驱动模式，表示在一个音乐播放器中根据是否正在播放来改变两个子视图的样式。

其中，图5示出了两个子视图各自保存了一个表示是否正在播放的数据变量，后续需要分别改动这两个变量来驱动这两个子视图的样式变化。而图4则通过父视图来保存一个表示是否正在播放的数据变量，让两个子视图通过读取这个数据变量来决定对应的样式，这种场景便是单一数据驱动。

也即，单一数据驱动是指父视图保存数据变量，至少两个子视图通过读取保存的数据变量来确定是否进行样式变化。这种开发模式可以有效地避免数据管理上的麻烦，设想假如不是两个子视图，而是十几个的时候，如果每个子视图都独立保存一份数据变量来驱动子视图样式的变化，那么维护成本是极其高的。所以，单一数据驱动的数据驱动模式极大地降低了维护成本。

作为一个示例，如图3所示，状态管理组件303包括：状态(state)和绑定(binding)。

页面切换组件304

其中，页面切换组件304负责切换用户界面；而页面切换也是对不同事件的一种响应，比如点击按钮之后进入到下一个页面。

如图3所示，页面切换组件304可以包括：动画切换效果(Present)和动画切换效果(Push)。其中，Present还可以包括：Alert、ActionSheet、PresentViewController。

生命周期管理组件305

其中，生命周期管理组件305负责数据和基础控件的创建和销毁；即，数据和基础控件301在整个应用程序的流程中具有各自的生命周期，例如不再使用的数据需要被及时销毁，因此生命周期部分负责管理它们的创建和销毁。

如图3所示，生命周期管理组件305可以包括：上下文(Context)和主题(Theme)。

本公开实施例提供了一种声明式编程框架，该声明式编程框架是一种声明式编程框架，并调用这个基于声明式语法的声明式编程框架来生成用户界面；其中，声明式编程是一种不使用控制流来表示计算逻辑的编程范式，而声明式语法则用于描述用户界面的样式。其中，基于声明式语法的声明式编程框架具有易于阅读、易于编写、语法简洁等特点，因此基于该声明式编程框架构建用户界面大大提高了采用代码构建方式生成用户界面的便利程度，同时可维护性也较好，即兼顾了用户界面的开发效率和可维护性。

基于上述声明式编程框架，本公开实施例提供了一种声明式的UI构建方案，不但实现了仅用少量的代码就可以构建出复杂的用户界面，而且实现了即便使用代码也可以方便地构建出复杂的用户界面。另外，本公开实施例提供的声明式编程框架可以向下兼容，对开发环境要求不高，向下最低可以兼容iOS 9系统，并且其实现是基于目前早已趋于稳定的基础接口，该声明式编程框架不会发生较大的改动，为兼容性提供了保障。

图6是根据一示例性实施例示出的一种基于声明式编程框架的用户界面生成方法的流程图，该声明式编程框架如上述图3对应实施例的声明式编程框架。该声明式编程框架以SWIFT语言为基础，该方法用于图1所示的电子设备中，如图6所示，包括以下步骤。

在步骤601中，电子设备确定待构建的用户界面；其中，该用户界面为一个新页面或者一个待构建局部视图的历史页面。

本公开实施例提供的声明式编程框架既可以用于构建一个独立的新页面，也可以用于构建子视图，并将构建好的子视图用于已存在的历史页面。其中，该历史页面可能并不是采用本公开实施例提供的声明式编程框架进行构架的。即，本公开实施例提供的用户界面构建方案可以兼容既有的使用其他方式构建的用户界面，兼容性较好。

其中，若待构建的用户界面是一个独立的新页面，则执行下述步骤602；若待构建的用户界面是一个待构建局部视图的历史页面，则执行下述步骤603。

在步骤602中，若待构建的用户界面为一个新页面，则电子设备调用基于声明式语法的声明式编程框架生成一个新页面。

其中，声明式编程是一种不使用控制流来表示计算逻辑的编程范式，而声明式语法用于描述用户界面的样式。其中，声明式的意思即是描述需要一个什么样的用户界面，而不是告诉机器一步一步干什么；换言之，声明式用于描述所需的UI样式，而不需要关心它是如何过渡到框架的。即，声明式编程是告诉机器你想要的是什么，让机器想出如何去做。而命令式编程则是命令机器如何去做事情，这样不管你想要的是什么，它都会按照你的命令实现。

针对该步骤，本公开实施例提供的用户界面构建方式可以作为独立页面的基础，即使用本公开实施例提供的声明式编程框架可以构建一个独立且全新的页面，这种情况下完全使用本公开实施例提供的基于声明式语法的声明式编程框架来构建这个页面。

在步骤603中，若待构建的用户界面为一个待构建局部视图的历史页面，则电子设备调用基于声明式语法的声明式编程框架生成局部视图，并将生成的局部视图添加到历史页面中。

针对该步骤，为了兼容既有的历史页面，也可以使用本公开实施例提供的基于声明式语法的声明式编程框架来构建一些局部视图，并将构建好的局部视图添加到既有的历史页面中，这样可以实现在不破坏既有的历史页面的页面结构的基础上，享受声明式编程框架所带来的便捷。

在另一种可能的实现方式中，本公开实施例还可以实现如下功能：

本公开实施例使用声明式语法构造基础控件，并支持链式调用的风格修改样式。

即，基于声明式语法，构造用于组成待构建的用户界面的至少一个基础控件；对于至少一个基础控件中的任意一个基础控件，采用链式调用方式声明该基础控件内对象的属性信息；其中，链式调用方式用于多次声明对一个对象的属性要求。

详细来说，链式调用是一种语法招数，目的在于使用少量代码来表达复杂操作。其中，链式调用这种风格有助于简化代码的编写工作，让代码更加简洁、易读。

举例来说，“.font(.title)”表示需要这个文本标签展示类型为“title”的字体,而“.foregroundColor(.red)”表示需要这个文本标签展示红色的文本。即，用于组成待构建的用户界面的基础控件包括标签(Label)。其中，“.font”和“.fouregroundColor”这样的“点语法”也是声明式代码构建方案中的一个特点，原则上可以通过这种链式的方法无限地声明对一个对象的属性要求。

比如，除了对文本标签这个对象的上述属性要求之外，还可以通过链式的方式再声明该对象的其他属性信息，比如字体大小等。

其中，声明式的用户界面构建方案不但可以实现仅用少量的代码就能构建复杂的界面，而且还可以实现使用代码也可以方便地构建出复杂的用户界面。

本公开实施例还可以基于目标页面布局方式和目标布局容器进行用户界面动态布局。

其中，动态布局即是指通过修改内容实现关联内容自动改变的布局方式。

作为一个示例，该目标页面布局方式可以为AutoLayout(自动约束)，该目标布局容器可以为UIStackView(栈视图)。即，本公开实施例可以基于AutoLayout和UIStackView实现动态布局。其中，目标页面布局方式是指通过定义约束来控制用户界面上页面元素的位置和尺寸大小；而通过设置目标布局容器的排列属性能够约束目标布局容器内子视图的排列方式。

详细来说，AutoLayout是iOS开发中一种常见的页面布局方式，它通过定义约束来控制用户界面上界面元素的位置和尺寸，比如可以通过它定义一个子视图的顶部(或者底部、左边、右边)到父视图的距离，以及该子视图的大小，而一旦这些约束确定下来，这个子视图的布局便确定下来了。即，可以使用Auto Layout添加一系列约束来构建用户界面，这些约束代表两个视图间之间的关系，最后Auto Layout根据这些约束计算出其中一个视图的位置和大小。基于约束的Auto Layout能够搭建动态响应内部、外部变化的用户界面。

而UIStackView是iOS开发中一种常用的容器，它在内部管理一组子视图，开发者通过设置它的排列属性可以让内部的子视图具有不同的排列方式。详细来说，iOS9新加入了一个非常易用的布局控件UIStackView，它可以将一组UIView视图进行垂直或水平方向的排列，用来替换手工使用AutoLayout对视图进行布局。简单来讲，即一个容器里可以包含多个子视图，分为水平和竖直排列，我们只需约束这个容器即可，而不用一个个地去约束容器内的子视图。

基于AutoLayout和UIStackView不但可以实现用户界面的动态布局，而且还可以实现当更改布局属性时重新刷新布局样式的功能，具有动态特性。

本公开实施例还支持响应式修改基础控件的状态。

即，当数据发生变化时，调用基于声明式语法的声明式编程框架，刷新发生变化的数据对应的目标基础控件，以使目标基础控件展示发生变化后的数据。

举例来说，对于一个文本标签，大部分使用场景下它展示的文本并非一成不变，当需要展示金额的时候，那么随着金额数目的改变，它展示的文本也要随之改变，本公开实施例支持这种响应式的改变，即数据发生变化后，展示这个数据的基础控件也进行刷新，展示变化后的数据，达到了良好的状态管理效果。

综上所述，本公开实施例提供的基于声明式编程框架的用户界面构建方案至少具有如下特点：

一、本公开实施例提供的用户界面构建方案的实现依赖的是iOS系统的既有特性，即其实现是基于目前早已趋于稳定的基础接口(如图3所示的声明式编程框架的各个组成部分)，因此向下最低可以兼容iOS9的系统，具有更大的使用范围和更高的稳定性。

二、本公开实施例提供的用户界面构建方案的实现方法透明、经典，所以在进行调试时和使用传统的非声明式语法开发方式相同，这样带来的好处是调试成本比较低。

总结来说，使用本公开实施例提供的用户界面构建方案，在合适的场景下，可以在保证易维护、易合作的前提下，有效地提高iOS开发中用户界面的开发效率，并且最低可以兼容iOS9系统，这意味着更大的应用范围。

本公开实施例提供的方法至少具有如下有益效果：

本公开实施例提供了一种声明式编程框架，并调用这个基于声明式语法的声明式编程框架来生成用户界面；其中，声明式编程是一种不使用控制流来表示计算逻辑的编程范式，而声明式语法则用于描述用户界面的样式。由于基于声明式语法的声明式编程框架具有易于阅读、易于编写、语法简洁等特点，因此基于该声明式编程框架构建用户界面大大提高了采用代码构建方式生成用户界面的便利程度，同时可维护性也较好，即兼顾了用户界面的开发效率和可维护性。

基于上述声明式编程框架，本公开实施例提供了一种声明式的UI构建方案，不但实现了仅用少量的代码就可以构建出复杂的用户界面，而且实现了即便使用代码也可以方便地构建出复杂的用户界面。另外，本公开实施例提供的声明式编程框架可以向下兼容，对开发环境要求不高，向下最低可以兼容iOS 9系统，并且其实现是基于目前早已趋于稳定的基础接口，该声明式编程框架不会发生较大的改动，为兼容性提供了保障。

图7是根据一示例性实施例示出的一种基于声明式编程框架的用户界面生成装置。该声明式编程框架包括：基础控件、基础容器、状态管理组件、页面切换组件和生命周期管理组件；参照图7，该装置包括确定模块701和生成模块702。

确定模块701，被配置为确定待构建的用户界面；

生成模块702，被配置为调用基于声明式语法的所述声明式编程框架生成所述用户界面；

其中，所述声明式编程是一种不使用控制流来表示计算逻辑的编程范式，所述声明式语法用于描述所述用户界面的样式；所述基础控件是构成用户界面的基本元素；所述基础容器负责组合所述基础控件；所述状态管理组件负责当界面状态发生变化时控制所述用户界面进行相应变化；所述页面切换组件负责切换用户界面；所述生命周期管理组件负责数据和所述基础控件的创建和销毁。

本公开实施例提供了一种声明式编程框架，通过调用这个基于声明式语法的声明式编程框架来生成用户界面；其中，声明式编程是一种不使用控制流来表示计算逻辑的编程范式，而声明式语法则用于描述用户界面的样式。由于基于声明式语法的声明式编程框架具有易于阅读、易于编写、语法简洁等特点，因此基于该声明式编程框架构建用户界面大大提高了采用代码构建方式生成用户界面的便利程度，同时可维护性也较好，即兼顾了用户界面的开发效率和可维护性。

在一种可能的实现方式中，所述用户界面的界面状态变化由数据驱动且数据驱动模式为单一数据驱动；其中，所述单一数据驱动是指父视图保存数据变量，至少两个子视图通过读取保存的数据变量来确定是否进行样式变化；

在一种可能的实现方式中，所述生成模块，被配置为基于所述声明式语法，构造用于组成所述用户界面的至少一个基础控件；对于所述至少一个基础控件中的任意一个基础控件，采用链式调用方式声明所述基础控件内对象的属性信息；所述链式调用方式用于多次声明对所述对象的属性要求。

在一种可能的实现方式中，所述生成模块，被配置为基于目标页面布局方式和目标布局容器对所述用户界面进行动态布局；

其中，所述目标页面布局方式是指通过定义约束来控制所述用户界面上页面元素的位置和尺寸大小；通过设置所述目标布局容器的排列属性能够约束所述目标布局容器内子视图的排列方式。

在一种可能的实现方式中，所述生成模块，还被配置为当数据发生变化时，调用基于声明式语法的所述声明式编程框架，刷新发生变化的数据对应的目标基础控件，以使所述目标基础控件展示发生变化后的数据。

在一种可能的实现方式中，所述生成模块，被配置为若所述用户界面为一个新页面，则调用基于声明式语法的所述声明式编程框架生成所述新页面；或，若所述用户界面为一个待构建局部视图的历史页面，则调用基于声明式语法的所述声明式编程框架生成所述局部视图，并将所述局部视图添加到所述历史页面中。

上述所有可选技术方案，可以采用任意结合形成本公开的可选实施例，在此不再赘述。

关于上述实施例中的装置，其中各个模块执行操作的具体方式已经在有关该方法的实施例中进行了详细描述，此处将不做详细阐述说明。

图8示出了本公开一个示例性实施例提供的一种电子设备800的结构框图。通常，设备800包括有：处理器801和存储器802。

处理器801可以包括一个或多个处理核心，比如4核心处理器、8核心处理器等。处理器801可以采用DSP(Digital Signal Processing，数字信号处理)、FPGA(Field－Programmable Gate Array，现场可编程门阵列)、PLA(Programmable Logic Array，可编程逻辑阵列)中的至少一种硬件形式来实现。处理器801也可以包括主处理器和协处理器，主处理器是用于对在唤醒状态下的数据进行处理的处理器，也称CPU(Central ProcessingUnit，中央处理器)；协处理器是用于对在待机状态下的数据进行处理的低功耗处理器。在一些实施例中，处理器801可以在集成有GPU(Graphics Processing Unit，图像处理器)，GPU用于负责显示屏所需要显示的内容的渲染和绘制。一些实施例中，处理器801还可以包括AI(Artificial Intelligence，人工智能)处理器，该AI处理器用于处理有关机器学习的计算操作。

存储器802可以包括一个或多个计算机可读存储介质，该计算机可读存储介质可以是非暂态的。存储器802还可包括高速随机存取存储器，以及非易失性存储器，比如一个或多个磁盘存储设备、闪存存储设备。在一些实施例中，存储器802中的非暂态的计算机可读存储介质用于存储至少一个指令，该至少一个指令用于被处理器801所执行以实现本公开中方法实施例提供的错误页面展示方法。

在一些实施例中，设备800还可选包括有：外围设备接口803和至少一个外围设备。处理器801、存储器802和外围设备接口803之间可以通过总线或信号线相连。各个外围设备可以通过总线、信号线或电路板与外围设备接口803相连。具体地，外围设备包括：显示屏805和电源808。

外围设备接口803可被用于将I/O(Input/Output，输入/输出)相关的至少一个外围设备连接到处理器801和存储器802。在一些实施例中，处理器801、存储器802和外围设备接口803被集成在同一芯片或电路板上；在一些其他实施例中，处理器801、存储器802和外围设备接口803中的任意一个或两个可以在单独的芯片或电路板上实现，本实施例对此不加以限定。

显示屏804用于显示UI(User Interface，用户界面)。该UI可以包括图形、文本、图标、视频及其它们的任意组合。当显示屏804是触摸显示屏时，显示屏804还具有采集在显示屏804的表面或表面上方的触摸信号的能力。该触摸信号可以作为控制信号输入至处理器801进行处理。此时，显示屏804还可以用于提供虚拟按钮和/或虚拟键盘，也称软按钮和/或软键盘。在一些实施例中，显示屏804可以为一个，设置设备800的前面板；显示屏804可以采用LCD(Liquid Crystal Display，液晶显示屏)、OLED(Organic Light-Emitting Diode,有机发光二极管)等材质制备。

电源805用于为设备800中的各个组件进行供电。电源805可以是交流电、直流电、一次性电池或可充电电池。当电源805包括可充电电池时，该可充电电池可以是有线充电电池或无线充电电池。有线充电电池是通过有线线路充电的电池，无线充电电池是通过无线线圈充电的电池。该可充电电池还可以用于支持快充技术。

本领域技术人员可以理解，图8中示出的结构并不构成对设备800的限定，可以包括比图示更多或更少的组件，或者组合某些组件，或者采用不同的组件布置。

在示例性实施例中，还提供了一种包括指令的计算机可读存储介质，例如包括指令的存储器，上述指令可由电子设备800的处理器执行以完成上述基于声明式编程框架的用户界面生成方法。可选地，存储介质可以是非临时性计算机可读存储介质，例如，所述非临时性计算机可读存储介质可以是ROM、随机存取存储器(RAM)、CD-ROM、磁带、软盘和光数据存储设备等。

在示例性实施例中，还提供了一种计算机程序产品，所述计算机程序产品中的指令由电子设备800的处理器执行时，使得电子设备800能够执行如上述方法实施例中的基于声明式编程框架的用户界面生成方法。

本领域技术人员在考虑说明书及实践这里公开的发明后，将容易想到本公开的其它实施方案。本申请旨在涵盖本公开的任何变型、用途或者适应性变化，这些变型、用途或者适应性变化遵循本公开的一般性原理并包括本公开未公开的本技术领域中的公知常识或惯用技术手段。说明书和实施例仅被视为示例性的，本公开的真正范围和精神由下面的权利要求指出。

应当理解的是，本公开并不局限于上面已经描述并在附图中示出的精确结构，并且可以在不脱离其范围进行各种修改和改变。本公开的范围仅由所附的权利要求来限制。

Claims (13)

1.一种基于声明式编程框架的用户界面生成方法，其特征在于，所述声明式编程框架包括：基础控件、基础容器、状态管理组件、页面切换组件和生命周期管理组件；所述方法包括：

确定待构建的用户界面；

调用基于声明式语法的所述声明式编程框架生成所述用户界面；

其中，声明式编程是一种不使用控制流来表示计算逻辑的编程范式，所述声明式语法用于描述所述用户界面的样式；所述基础控件是构成用户界面的基本元素；所述基础容器负责组合所述基础控件；所述状态管理组件负责当界面状态发生变化时控制所述用户界面进行相应变化，所述用户界面的界面状态变化由数据驱动，且数据驱动模式为单一数据驱动，所述单一数据驱动是指父视图保存数据变量，至少两个子视图通过读取保存的数据变量来确定是否进行样式变化；所述页面切换组件负责切换用户界面；所述生命周期管理组件负责数据和所述基础控件的创建和销毁。

2.根据权利要求1所述的用户界面生成方法，其特征在于，所述调用基于声明式语法的所述声明式编程框架生成所述用户界面，包括：

基于所述声明式语法，构造用于组成所述用户界面的至少一个基础控件；

对于所述至少一个基础控件中的任意一个基础控件，采用链式调用方式声明所述基础控件内对象的属性信息；所述链式调用方式用于多次声明对所述对象的属性要求。

3.根据权利要求1所述的用户界面生成方法，其特征在于，所述调用基于声明式语法的所述声明式编程框架生成所述用户界面，包括：

基于目标页面布局方式和目标布局容器对所述用户界面进行动态布局；

其中，所述目标页面布局方式是指通过定义约束来控制所述用户界面上页面元素的位置和尺寸大小；通过设置所述目标布局容器的排列属性能够约束所述目标布局容器内子视图的排列方式。

4.根据权利要求1所述的用户界面生成方法，其特征在于，所述调用基于声明式语法的所述声明式编程框架生成所述用户界面之后，所述方法包括：

当数据发生变化时，调用基于声明式语法的所述声明式编程框架，刷新发生变化的数据对应的目标基础控件，以使所述目标基础控件展示发生变化后的数据。

5.根据权利要求1所述的用户界面生成方法，其特征在于，所述确定待构建的用户界面，调用基于声明式语法的所述声明式编程框架生成所述用户界面，包括：

若所述用户界面为一个新页面，则调用基于声明式语法的所述声明式编程框架生成所述新页面；或，

若所述用户界面为一个待构建局部视图的历史页面，则调用基于声明式语法的所述声明式编程框架生成所述局部视图，并将所述局部视图添加到所述历史页面中。

6.一种基于声明式编程框架的用户界面生成装置，其特征在于，所述声明式编程框架包括：基础控件、基础容器、状态管理组件、页面切换组件和生命周期管理组件；所述装置包括：

确定模块，被配置为确定待构建的用户界面；

生成模块，被配置为调用基于声明式语法的所述声明式编程框架生成所述用户界面；

其中，所述声明式编程是一种不使用控制流来表示计算逻辑的编程范式，所述声明式语法用于描述所述用户界面的样式；所述基础控件是构成用户界面的基本元素；所述基础容器负责组合所述基础控件；所述状态管理组件负责当界面状态发生变化时控制所述用户界面进行相应变化，所述用户界面的界面状态变化由数据驱动，且数据驱动模式为单一数据驱动，所述单一数据驱动是指父视图保存数据变量，至少两个子视图通过读取保存的数据变量来确定是否进行样式变化；所述页面切换组件负责切换用户界面；所述生命周期管理组件负责数据和所述基础控件的创建和销毁。

7.根据权利要求6所述的用户界面生成装置，其特征在于，所述生成模块，被配置为基于所述声明式语法，构造用于组成所述用户界面的至少一个基础控件；对于所述至少一个基础控件中的任意一个基础控件，采用链式调用方式声明所述基础控件内对象的属性信息；所述链式调用方式用于多次声明对所述对象的属性要求。

8.根据权利要求6所述的用户界面生成装置，其特征在于，所述生成模块，被配置为基于目标页面布局方式和目标布局容器对所述用户界面进行动态布局；

其中，所述目标页面布局方式是指通过定义约束来控制所述用户界面上页面元素的位置和尺寸大小；通过设置所述目标布局容器的排列属性能够约束所述目标布局容器内子视图的排列方式。

9.根据权利要求6所述的用户界面生成装置，其特征在于，所述生成模块，还被配置为当数据发生变化时，调用基于声明式语法的所述声明式编程框架，刷新发生变化的数据对应的目标基础控件，以使所述目标基础控件展示发生变化后的数据。

10.根据权利要求6所述的用户界面生成装置，其特征在于，所述生成模块，被配置为若所述用户界面为一个新页面，则调用基于声明式语法的所述声明式编程框架生成所述新页面；或，若所述用户界面为一个待构建局部视图的历史页面，则调用基于声明式语法的所述声明式编程框架生成所述局部视图，并将所述局部视图添加到所述历史页面中。

11.一种电子设备，其特征在于，包括：

处理器；

用于存储所述处理器可执行指令的存储器；

其中，所述处理器被配置为执行所述指令，以实现如权利要求1至5中任一项所述的基于声明式编程框架的用户界面生成方法。

12.一种存储介质，其特征在于，当所述存储介质中的指令由电子设备的处理器执行时，使得所述电子设备能够执行如权利要求1至5中任一项所述的基于声明式编程框架的用户界面生成方法。

13.一种计算机程序产品，其特征在于，所述计算机程序产品中的指令由电子设备的处理器执行时，使得所述电子设备能够执行如权利要求1至5中任一项所述的基于声明式编程框架的用户界面生成方法。