CN115525265A - 一种应用可视化开发方法、装置、电子设备和存储介质 - Google Patents

Abstract

本公开实施例涉及一种应用可视化开发方法、装置、电子设备和存储介质。本公开的至少一个实施例中，通过获取对象的功能信息，可以基于预设的物模型结构，将功能信息结构化，进而实现对象的结构化，这样，可以将功能信息对应的结构化信息进行界面模块化，得到可以布局在应用页面中的可重复使用的界面卡片，从而基于界面卡片来搭建应用页面，实现应用可视化开发，无需人工的应用设计稿，不受限于用户的应用设计专业技能，降低应用可视化开发的门槛，利于应用可视化开发的落地使用。

Description

一种应用可视化开发方法、装置、电子设备和存储介质

技术领域

本公开实施例涉及计算机技术领域，具体涉及一种应用可视化开发方法、装置、电子设备和非暂态计算机可读存储介质。

背景技术

随着网络技术的发展，产生了应用可视化开发平台或工具，能够通过设计转代码(Design to Code)方式将应用设计稿(例如Sketch设计稿、PSD设计稿、图片)直接生成多种领域特定语言(Domain Specific Language，DSL)代码，例如符合React开发规范的代码、符合Vue开发规范的代码、符合H5开发规范的代码等，进而可以生成为页面搭建器(属于应用可视化开发平台或工具的一部分)的页面，以便进行可视化开发。

但是，目前的应用可视化开发平台或工具进行可视化开发时，需要人工进行应用设计，得到应用设计稿，才能根据应用设计稿进行应用可视化开发，使得应用可视化开发受限于用户的应用设计专业技能，使得应用可视化开发的门槛变高，不利于应用可视化开发的落地使用。

发明内容

为了解决现有技术存在的至少一个问题，本公开的至少一个实施例提供了一种应用可视化开发、装置、电子设备和非暂态计算机可读存储介质。

第一方面，本公开实施例提出一种应用可视化开发方法，包括：

获取对象的功能信息；

基于功能信息和预设的物模型结构，确定对象的物模型，物模型包括功能信息对应的结构化信息；

基于功能信息对应的结构化信息，得到功能信息对应的界面卡片，界面卡片为用于布局在应用页面中的可重复使用的图形组件；

基于界面卡片，搭建应用页面，应用页面中包括至少一个界面卡片。

第二方面，本公开实施例还提出一种应用可视化开发装置，包括：

信息获取单元，用于获取对象的功能信息；

结构化单元，用于基于功能信息和预设的物模型结构，确定对象的物模型，物模型包括功能信息对应的结构化信息；

卡片化单元，用于基于功能信息对应的结构化信息，得到功能信息对应的界面卡片，界面卡片为用于布局在应用页面中的可重复使用的图形组件；

页面搭建单元，用于基于界面卡片，搭建应用页面，应用页面中包括至少一个界面卡片。

第三方面，本公开实施例还提出一种电子设备，包括：处理器和存储器；所述处理器通过调用所述存储器存储的程序或指令，用于执行如第一方面所述应用可视化开发方法的步骤。

第四方面，本公开实施例还提出一种非暂态计算机可读存储介质，用于存储程序或指令，所述程序或指令使计算机执行如第一方面所述应用可视化开发方法的步骤。

可见，本公开的至少一个实施例中，通过获取对象的功能信息，可以基于预设的物模型结构，将功能信息结构化，进而实现对象的结构化，这样，可以将功能信息对应的结构化信息进行界面模块化，得到可以布局在应用页面中的可重复使用的界面卡片，从而基于界面卡片来搭建应用页面，实现应用可视化开发，无需人工的应用设计稿，不受限于用户的应用设计专业技能，降低应用可视化开发的门槛，利于应用可视化开发的落地使用。

附图说明

为了更清楚地说明本公开实施例的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本公开的一些实施例，对于本领域普通技术人员来讲，还可以根据这些附图获得其他的附图。

图1是本公开实施例提供的一种物联网中的物对象示意图；

图2是图1所示的物对象对应的虚对象示意图；

图3是本公开实施例提供的一种应用可视化开发方法的流程图；

图4是本公开实施例提供的一种风速卡片、风向卡片和PM2.5卡片的示意图；

图5是本公开实施例提供的一种整数型的界面卡片、枚举型的界面卡片和布尔型的界面卡片的示意图；

图6是本公开实施例提供的一种属性的界面卡片布局示意图；

图7是基于图6得到的一种温度界面卡片示意图；

图8是基于图6得到的温度属性对应的不同界面卡片的示意图；

图9是本公开实施例提供的一种基于信息量确定智能停车场的界面卡片布局的示意图；

图10是本公开实施例提供的一种体验编码化的一级信息编码示意图；

图11是本公开实施例提供的一种体验编码化的二级信息编码示意图；

图12是本公开实施例提供的四种行为模式示意图；

图13是本公开实施例提供的一种体验编码化的三级信息编码示意图；

图14是本公开实施例提供的一种空间关系、权限关系和分组关系的示意图；

图15是本公开实施例提供的多个设备端的应用页面模板的示意图；

图16是图15中各应用页面模板的栅格化示意图；

图17是本公开实施例提供的一种基于体验编码化得到界面卡片示意图；

图18是本公开实施例提供的一种应用可视化开发装置的框图；

图19是本公开实施例提供的一种电子设备的示例性框图。

具体实施方式

为了能够更清楚地理解本公开的上述目的、特征和优点，下面结合附图和实施例对本公开作进一步的详细说明。可以理解的是，所描述的实施例是本公开的一部分实施例，而不是全部的实施例。此处所描述的具体实施例仅仅用于解释本公开，而非对本公开的限定。基于所描述的本公开的实施例，本领域普通技术人员所获得的所有其他实施例，都属于本公开保护的范围。

需要说明的是，在本文中，诸如“第一”和“第二”等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来，而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。

需要说明的是，在本文中，页面的布局、样式和颜色；界面的布局、样式和颜色；界面卡片的布局、样式、颜色均可以根据实际需要进行灵活变化。

针对目前的应用可视化开发平台或工具进行可视化开发时，需要依赖人工的应用设计稿，使得应用可视化开发受限于用户的应用设计专业技能，使得应用可视化开发的门槛变高，不利于应用可视化开发的落地使用的问题，本公开实施例提供了一种应用可视化开发方法、装置、电子设备和非暂态计算机可读存储介质，通过获取对象的功能信息，可以基于预设的物模型结构，将功能信息结构化，进而实现对象的结构化，这样，可以将功能信息对应的结构化信息进行界面模块化，得到可以布局在应用页面中的可重复使用的界面卡片，从而基于界面卡片来搭建应用页面，实现应用可视化开发，无需人工的应用设计稿，不受限于用户的应用设计专业技能，降低应用可视化开发的门槛，利于应用可视化开发的落地使用。

本公开实施例可以适用于不同场景下的应用可视化开发，例如，适用于物联网场景，包括但不限于：配电房监控场景、供水分配管理场景、智能大棚监控场景、空调暖通管理场景、污水处理场景、城市污染监控场景、纺织厂房运维场景、医院设备监控场景等。

物联网的核心是数据，物联网应用的可视化开发实质上是对物联网数据的可视化开发。而碎片化是物联网的特点，更需要统筹性的体验视角，多维度的物联网应用体验是获得用户满意的首要参考。本公开的至少一个实施例中，应用可视化开发将多维度的物联网应用体验纳入考量，实现体验构建模式化。

在一些实施例中，多维度的物联网应用体验包括：快速顺畅的定义过程、多维触达的设备数据和清晰愉悦的使用体验。其中，快速顺畅的定义过程可以使物联网应用快速落地使用，提升体验。多维触达的设备数据可以使物联网应用可以快速获取所需的物联网数据快照，对瞬时与趋势性的动作提供重要参考。清晰愉悦的使用体验可以使物联网应用清晰的指引使用者完成任务，并通过愉悦的界面元素提升使用者的观感。

在快速变化的物联网场景下，过多的碎片化开发不利于多维度的物联网应用体验的持续优化。传统的物联网应用开发，需要经过硬件开发、软件开发与云端开发三个步骤，需要至少三种技术团队与长达数月的开发过程。具体到某一物联网场景，开发过程可能因场景复杂度增加而延长。本公开的至少一个实施例中，将以上三个步骤的开发过程集中到云端开发，实现物联网应用的快速开发。

多样化的物联网应用，需要信息充分合理的展示。在物联网领域，人机交互界面从大屏端、个人计算机(Personal Computer，PC)端、人机界面(Human Machine Interface，HMI)端、移动端(例如手机)至手持端(例如手表)，有着不同的开发流程。在多种端上都需要有相应的体验策略，在多维度的物联网应用体验中，本公开的至少一个实施例采用模块化的方式重构信息，将物联网中物对象(即物理空间中的实体，如传感器、车载装置、楼宇、工厂等)的功能信息组织为界面卡片，进而基于界面卡片搭建应用页面。

这样，界面卡片可以更快速地完成响应式布局或多端重定制，避免从原子级的信息进行物联网应用开发，用户体验在多端保持一致性。另外，可以根据不同的信息类型组织不同的界面卡片设计模式，实现高效信息呈现，帮助用户组织记忆，从而加快理解速度。此外，在物联网场景中可能涉及到多种类型的物对象，使用界面卡片组织信息，能够保证各种物对象之间信息规则的一致性，从而让物联网应用开发更可控。

图1是本公开实施例提供的一种物联网中的物对象示意图，其中，物对象为包括一个或多个传感器的设备物理实体。在图1中，物对象是一个环境监测设备，安装有三个传感器，分别是风速传感器101、风向传感器102和细颗粒物(PM2.5)传感器103。

在一些实施例中，可以将物对象抽象为一个或多个数据点位，一个数据点位被定义为该物对象的一种属性，且一个数据点位对应一个传感器。其中，属性(Property)描述了该物对象可读取和设置的能力，可以用于描述该物对象运行时的状态。

例如图1中，风速传感器101对应一个数据点位，这个数据点位被定义为环境监测设备的风速属性；风向传感器102对应一个数据点位，这个数据点位被定义为环境监测设备的风向属性；细颗粒物(PM2.5)传感器103对应一个数据点位，这个数据点位被定义为环境监测设备的细颗粒物(PM2.5)属性。

图2是图1所示的物对象对应的虚对象示意图。在图2中，虚对象可以通过对物对象进行数字孪生(Digital Twins)得到。该虚对象可以用于页面展示，以代表该物对象。

结合图1，在图2中，风速传感器101采集的数据为风速(Speed)201；风向传感器102采集的数据为风向(Direction)202；细颗粒物(PM2.5)传感器103采集的数据为PM2.5(203)。

针对某个具体的物联网场景，该场景中可能包括多个物对象或者有些物对象具有多个数据点位(例如图1所示的物对象具有3个数据点位)，如果每个数据点位分别定义其样式，会导致物联网应用开发过程延长。因此，本公开的至少一个实施例中，将多维度的物联网应用体验纳入考量，使物联网应用开发过程标准化，具体包括：物对象的结构化和界面的模块化。这样，可以缩短开发时间，也可以自动化生成一个体验友好的物联网应用，提升多维度的物联网应用体验。

更具体地，本公开的至少一个实施例中，以抽象出的数据点位为基础，可以获取物对象的功能信息，进而实现物对象的结构化，从而将功能信息对应的结构化信息进行界面模块化，得到可以布局在应用页面中的可重复使用的界面卡片，从而基于界面卡片来搭建应用页面，实现物联网应用可视化开发。

本公开的至少一个实施例中，在界面模块化的基础上，可以将用户与物对象进行互动的操作模式和/或理解范式进行标准化，实现体验的编码化，也即本实施例中，物联网应用开发过程标准化包括：物对象的结构化、界面的模块化和体验的编码化。

体验的标准化可以理解为：将物对象的数据点位涉及的多种数据类型以及这些数据任意组合的操作模式进行调优，进而固化为字典的过程，即体验编码化。其中，数据类型包括：整数型、浮点型、布尔型、枚举型、字符型、结构型和图像型中的至少一种。

图3是本公开实施例提供的一种应用可视化开发方法的流程图，该方法的执行主体可以为一种应用可视化开发平台或工具，其中，平台为云平台，工具可以为运行于云平台的工具，云平台可以为单个服务器，也可以是一个服务器群组，服务器群组可以是集中式的，也可以是分布式的。

在步骤301中，获取对象的功能信息。

在物联网场景下，对象为物联网中的物对象，且物对象包括一个或多个传感器，一个传感器的信息与物对象的一个属性相对应，这样，可以将物对象抽象为一个或多个数据点位，一个数据点位被定义为该物对象的一种属性，且一个数据点位对应一个传感器。

例如，图1中，物对象包括风速传感器101、风向传感器102和细颗粒物(PM2.5)传感器103，风速传感器101对应一个数据点位，这个数据点位被定义为该物对象的风速属性；风向传感器102对应一个数据点位，这个数据点位被定义为该物对象的风向属性；细颗粒物(PM2.5)传感器103对应一个数据点位，这个数据点位被定义为该物对象的细颗粒物(PM2.5)属性。

实施例中，获取对象的功能信息包括获取对象的属性(Properties)。在一些实施例中，可以提供一个用户界面，获取用户界面中输入的属性。或者，获取用户界面中输入的传感器信息，进而基于传感器信息确定属性。在一些实施例中，可以直接获取对象安装的传感器的数据，进而基于传感器的数据确定对象的属性。

在步骤302中，基于功能信息和预设的物模型结构，确定对象的物模型，物模型包括功能信息对应的结构化信息。

实施例中，预设的物模型结构定义了功能信息对应的数据结构，进而可以将功能信息结构化，从而实现对象的结构化，得到对象的物模型。

实施例中，预设的物模型结构包括属性数据结构，属性数据结构包括描述同一属性的多个数据项，例如包括：属性标识(identifier)、属性名称(name)、属性读写类型(accessMode)、是否必选属性(required)和属性数据类型(dataType)中的至少一个。

例如图2中，风速(Speed)201对应的结构化信息为：

其中，FLOAT表示浮点型。

风向(Direction)202对应的结构化信息为：

其中，ENUM表示枚举型。

PM2.5(203)对应的结构化信息为：

这样，对象的物模型包括该对象的属性所对应的结构信息，从属性这个维度描述了该对象是什么，物模型可以理解为对象的在云端的数字化表示。

在步骤303中，基于功能信息对应的结构化信息，得到功能信息对应的界面卡片，界面卡片为用于布局在应用页面中的可重复使用的图形组件。

实施例中，由于功能信息包括属性，因此，可以将属性对应的结构化信息进行界面模块化，得到可以布局在应用页面中的可重复使用的图形组件，即属性卡片。

例如图2中，风速(Speed)201对应的结构化信息、风向(Direction)202对应的结构化信息以及PM2.5(203)对应的结构化信息进行界面模块化，得到了如图4所示的风速卡片、风向卡片和PM2.5卡片。

在一些实施例中，界面卡片可以有多种呈现形式。例如，界面卡片为二维卡片，比如图4所示的风速卡片、风向卡片和PM2.5卡片为二维卡片。又例如，界面卡片为三维卡片，比如以图17中通过数字孪生(digital twins)得到的氧气泵的虚对象(即氧气泵的三维拟态)为基础生成的三维卡片。还例如，界面卡片为介于物对象的二维拟态与三维拟态之间的中间维度的卡片。还例如，界面卡片为投影影像或者其他虚拟的呈现形式，等等。

在步骤304中，基于界面卡片，搭建应用页面，应用页面中包括至少一个界面卡片。

实施例中，可以将一个或多个界面卡片布局到应用页面中，进而搭建应用页面，实现应用可视化开发，无需人工的应用设计稿，不受限于用户的应用设计专业技能，降低应用可视化开发的门槛，利于应用可视化开发的落地使用。

在一些实施例中，对象的功能信息包括属性(Properties)、事件(Event)和服务(Service)中的至少一种。获取对象的功能信息包括获取对象的属性、事件和服务中的至少一种。在一些实施例中，可以提供一个用户界面，获取用户界面中输入的属性、事件和服务中的至少一种。

事件(Event)可以理解为对象运行时，主动上报给云端的事件。事件一般包含需要被外部感知和处理的通知信息，可包含多个输出参数。例如，某项任务完成的信息，或者对象发生故障或告警时的温度等，事件可以被订阅和推送。

服务(Service)可以理解为对象可被外部(例如云端)调用的能力或方法，可设置输入参数和输出参数。相比于属性，服务可通过一条指令实现更复杂的业务逻辑，如执行某项特定的任务。

预设的物模型结构可以包括属性数据结构、事件数据结构和服务数据结构。其中，事件数据结构包括描述同一事件的多个数据项，例如包括：事件标识(identifier)、事件名称(name)、事件描述(desc)、事件类型(type)、是否必选事件(required)、事件输出数据(outputData)和事件对应的方法(method)中的至少一个。

事件数据结构例如为如下格式：

服务数据结构包括描述同一服务的多个数据项，例如包括：服务标识(identifier)、服务名称(name)、服务描述(desc)、是否必选服务(required)、调用方式(callType)、服务输入数据(inputData)、服务输出数据(outputData)和服务对应的方法(method)中的至少一个。其中，调用方式(callType)为异步调用(async)或同步调用(sync)。

服务数据结构例如为如下格式：

这样，对象的物模型包括该对象的属性所对应的结构信息、该对象的事件所对应的结构信息和该对象的服务所对应的结构信息中的至少一种。物模型可以理解为对象的在云端的数字化表示，物模型从属性这个维度描述了对象是什么，从服务这个维度描述了对象能做什么，从事件这个维度描述了对象可以对外提供哪些信息。不同的对象对应不同的物模型，不同的物模型彼此互不影响。

在一些实施例中，属性数据类型(dataType)包括：整数型(INT)、浮点型(FLOAT)、布尔型(BOOL)、枚举型(ENUM)、字符型(STRING)、结构型(Struct)和图像型中的至少一种。其中，图像型例如为BASE64，BASE64是一种编码方式。事件和服务可以理解为基于以上属性数据类型中至少一种的进一步组合。

在一些实施例中，可以将不同的属性数据类型进行界面模块化，得到可以布局在应用页面中的可重复使用的图形组件，即属性数据类型卡片。例如图5中从上至下依次示出了整数型(INT)的界面卡片、枚举型(ENUM)的界面卡片和布尔型(BOOL)的界面卡片。

在一些实施例中，若功能信息包括事件，则可以将事件所对应的结构信息进行界面模块化，得到可以布局在应用页面中的可重复使用的图形组件，即事件卡片。

在一些实施例中，若功能信息包括服务，可以将服务所对应的结构信息进行界面模块化，得到可以布局在应用页面中的可重复使用的图形组件，即服务卡片。

在一些实施例中，基于功能信息对应的结构化信息，得到功能信息对应的界面卡片，具体可以通过如下方式实现：基于预设的界面卡片布局，对功能信息对应的结构化信息进行布局，并生成功能信息对应的界面卡片；其中，预设的界面卡片布局为结构化信息在界面卡片中的布局。

预设的界面卡片布局包括属性的界面卡片布局、事件的界面卡片布局和服务的界面卡片布局。图6示出了一种属性的界面卡片布局，该界面卡片布局中包括一个浮点型(FLOAT)的界面卡片600，标记601表示属性标识，标记602表示属性单位(Unit)，标记603表示界面卡片编码(Code)，标记604表示描述信息(例如行业模式的描述信息)，标记605表示功能信息类型(本实施例中为属性)，标记606表示属性数据类型(本实施例中为FLOAT)。

其中，界面卡片编码(Code)的信息包括：属性、属性数据类型、数据本身的复杂度和行业模式中的至少一个。在一些实施例中，数据本身的复杂度包括但不限于：默认(default)、图标(Icon)和信息图(Infograph)，其中，默认(default)表示仅展示属性数据本身；图标(Icon)表示展示属性数据本身和属性图标；信息图(Infograph)表示展示属性数据本身和属性变化信息。

行业模式例如包括但不限于：白天模式(Light Mode)、夜间模式(Dark Mode)、智慧城市(Smart City)、智慧工业(Smart Industry)和智慧农业(Smart Agriculture)中的至少一个。

标记604中的描述信息例如为行业模式以及数据本身的复杂度的描述信息。具体地，若行业模式为白天模式(Light Mode)且数据本身的复杂度为默认(default)，则标记604中的描述信息为：Light；若行业模式为白天模式(Light Mode)且数据本身的复杂度为图标(Icon)，则标记604中的描述信息为：Light-Icon；若行业模式为白天模式(LightMode)且数据本身的复杂度为信息图(Infograph)，则标记604中的描述信息为：Light-Info。

可见，通过设置不同的行业模式和/或数据本身的复杂度，可以得到同一属性对应的不同界面卡片。

在一些实施例中，若属性为温度(Temperature)，其对应的结构化信息如下：

基于图6示出的属性的界面卡片布局，可以对温度对应的结构化信息进行布局，并生成温度界面卡片。图7示出了一种温度界面卡片，在图7中，界面卡片编码(Code)为：Prop-F-Temperature-001，其中，Prop表示属性(Property)，F表示浮点型(FLOAT)，“001”中第一位数字标识数据本身的复杂度，后两位数字表示行业模式。图8示出了一种温度属性对应的不同界面卡片，在图8中，横向表示行业模式，纵向表示数据本身的复杂度，可以针对不同的行业模式，提取行业模式相关的代表色，这样，可以使用颜色区分不同行业模式对应的界面卡片。

在一些实施例中，预设的界面卡片布局对应的信息量处于预设的信息量范围，其中，预设的信息量范围基于感知体验的带宽(the bandwidth of perceptual experience)确定。预设的界面卡片布局对应的信息量可以采用“信息熵”的计算公式进行计算，“信息熵”越小，信息量越大。

以智能停车场景为例，智能停车场(记为“智能停车001”)即为一个物对象，对于智能停车场的车位信息，有快照值和时序值，其中，快照值即智能停车场上报的某个瞬时值，例如上报时刻的空闲车位。时序值即智能停车场上报的某个值在时间上的序列分布，例如某个时间周期内(例如一天内)的空闲车位。

另外，对于智能停车场，空闲车位可看作是单点信息，空闲车位和已占车位可以看作是多点信息，可以理解，不同物对象的同一属性可以看作是多点信息。

图9示出了基于信息量确定智能停车场的界面卡片布局的示意图。在图9中，将快照、时序作为纵轴，单点、多点作为横轴，构建坐标系，“信息宜居区”基于感知体验的带宽(the bandwidth of perceptual experience)确定，也即“信息宜居区”对应的信息量范围即为预设的信息量范围，智能停车场(记为“智能停车001”)的界面卡片布局对应的信息量应当处于预设的信息量范围，因此，可以得到“智能停车001”的界面卡片布局如图9中901所示。

在一些实施例中，在界面模块化的基础上，可以将用户与物对象进行互动的操作模式和/或理解范式进行标准化，实现体验的编码化。具体地，体验的编码化包括：一级信息编码、二级信息编码和三级信息编码，其中，一级信息编码得到一级界面卡片布局，二级信息编码得到二级界面卡片布局，三级信息编码得到三级界面卡片布局。

一级信息编码包括基础的数据点位输入和输出的编码，更进一步地，一级信息编码包括属性、事件和服务各自的输入和输出的编码。一级信息编码得到一级界面卡片布局包括：属性卡片布局、事件卡片布局和服务卡片布局。

图10示出了一种体验编码化的一级信息编码示意图，在图10中，对于物对象上报的“整数型”、“浮点型”、“布尔型”、“枚举型”、“字符型”、“结构型”和“图像型”，在界面上可用固定的输入组件(操作/信息下发)与输出组件(可视化)模块化的呈现，形成规整的结构。

二级信息编码涉及属性、事件和服务中至少两种的组合操作的编码以及属性时序的编码。二级信息编码得到二级界面卡片布局包括：组合操作卡片布局和属性时序卡片布局，其中，组合操作为属性、事件和服务中至少两种的组合操作。

图11示出了一种体验编码化的二级信息编码示意图，在图11中，每个方框对应一个二级界面卡片布局。基于用户侧主动或被动与应用侧前台或后台的区分界定四种行为模式：操作确认(CHECK)、服务调用(INVOKE)、条件展示(DISPLAY)和关联改变(RELATION)。图13示出了四种行为模式具体包括的内容。

操作确认(CHECK)可以理解为需要对多个数据点位进行用户侧主动的判断的信息。服务调用(INVOKE)可以理解为用户侧主动发送指令后对多个数据点位整合，在后台产生新的信息。条件展示(DISPLAY)可以理解为基于多个数据点位之间条件关系判断展示的新的信息。关联改变(RELATION)可以理解为多个数据点位互动后产生新的数据信息。

三级信息编码包括配置对象的拓扑关系。三级信息编码得到三级界面卡片布局包括：组态(Configure)卡片布局。组态包括：配置对象的拓扑关系。

图12示出了一种体验编码化的三级信息编码示意图，在图12中，每个方框对应一个三级界面卡片布局。三级信息包括对象的拓扑关系，对象的拓扑关系包括空间关系(GIS)、权限关系(AUTHORAZATION)和分组关系(GROUPING)。图14示出了空间关系、权限关系和分组关系的具体内容。

可见，基于体验编码化，预设的界面卡片布局可以包括：一级界面卡片布局、二级界面卡片布局和三级界面卡片布局。一级界面卡片布局包括：属性卡片布局、事件卡片布局和服务卡片布局；二级界面卡片布局包括：组合操作卡片布局和属性时序卡片布局，其中，组合操作为属性、事件和服务中至少两种的组合操作；三级界面卡片布局包括：组态卡片布局。

在一些实施例中，基于功能信息对应的结构化信息，得到功能信息对应的界面卡片，具体为：基于功能信息对应的结构化信息，从字典中查找功能信息对应的界面卡片；其中，字典包括结构化信息与界面卡片之间的对应关系。本实施例中，可以基于场景沉淀解决方案，在这些解决方案中整理体验良好的界面交互规则，沉淀为结构化信息与界面卡片之间的对应关系，也即字典，若从字典中未查找到功能信息对应的界面卡片，则可采用前述实施例提及的方式得到功能信息对应的界面卡片，并沉淀到字典中。

在一些实施例中，基于功能信息对应的结构化信息，得到功能信息对应的界面卡片后，还可以获取界面卡片的权重配置信息，权重配置信息用于确定界面卡片在应用页面模板中的布局位置和/或显示优先级。在一些实施例中，权重配置信息可以基于行业确定，只需确定行业模式即可确定不同界面卡片的权重。这样，基于界面卡片的权重配置信息，可以确定界面卡片在应用页面模板中的布局位置和/或显示优先级；进而基于布局位置和/或显示优先级，搭建应用页面，实现应用页面的自动搭建，无需人工干预。

在一些实施例中，应用页面模板为页面栅格化的模板，且应用页面模板中的每个栅格预先配置权重范围，这样，当获取界面卡片的权重配置信息后，即可确定界面卡片落在那个栅格内。

在一些实施例中，在界面模块化的基础上，可以基于具体的物联网场景，在不同的端显示不同量级的信息与操作，从而推进物联网合理有序的生产工作。本实施例中，应用页面模板包括多个设备端的模板，其中，设备端例如大屏端(SCREE)、PC端(WEB)、HMI端、移动端(例如手机)和手持端(例如手表)。当获取用户指定的设备端信息，则可以确定指定的设备端信息对应的应用页面模板。

图15示出了多个设备端的应用页面模板，包括Watch模板、APP模板、HMI模板、WEB模板和SCREE模板。利用APP模板可以开发设备控制APP、工业监测APP等应用。利用WEB模板可以开发状态监控面板、设备管理后台、设备数据分析报表等应用。图16为图15中各应用页面模板的栅格化示意图。

在一些实施例中，可以对物对象进行数字孪生(digital twins)，得到物对象对应的虚对象；这样，界面卡片中可以包括用于显示虚对象的显示区域；和/或，应用页面中还显示虚对象。图17示出了一种基于体验编码化得到界面卡片示意图，在该界面卡片中显示有虚对象(即氧气泵的三维拟态)。

需要说明的是，对于前述的各方法实施例，为了简单描述，故将其都表述为一系列的动作组合，但是本领域技术人员能够理解，本公开实施例并不受所描述的动作顺序的限制，因为依据本公开实施例，某些步骤可以采用其他顺序或者同时进行。另外，本领域技术人员能够理解，说明书中所描述的实施例均属于可选实施例。

图18是本公开实施例提供的一种应用可视化开发装置的框图，应用可视化开发装置可以实现为一种应用可视化开发平台或工具。如图18所示，应用可视化开发装置包括：信息获取单元181、结构化单元182、卡片化单元183和页面搭建单元184。

信息获取单元181，用于获取对象的功能信息。

结构化单元182，用于基于功能信息和预设的物模型结构，确定对象的物模型，物模型包括功能信息对应的结构化信息。

卡片化单元183，用于基于功能信息对应的结构化信息，得到功能信息对应的界面卡片，界面卡片为用于布局在应用页面中的可重复使用的图形组件。

页面搭建单元184，用于基于界面卡片，搭建应用页面，应用页面中包括至少一个界面卡片。

在一些实施例中，对象为物联网中的物对象；物对象包括一个或多个传感器；一个传感器的信息与物对象的一个属性相对应。

在一些实施例中，功能信息包括属性、事件和服务中的至少一种；预设的物模型结构包括属性数据结构、事件数据结构和服务数据结构。

在一些实施例中，属性数据结构包括描述同一属性的多个数据项；事件数据结构包括描述同一事件的多个数据项；服务数据结构包括描述同一服务的多个数据项。

在一些实施例中，描述同一属性的多个数据项包括：属性标识、属性名称、属性读写类型、是否必选属性和属性数据类型中的至少一个；描述同一事件的多个数据项包括：事件标识、事件名称、事件描述、事件类型、是否必选事件、事件输出数据和事件对应的方法中的至少一个；描述同一服务的多个数据项包括：服务标识、服务名称、服务描述、是否必选服务、调用方式、服务输入数据、服务输出数据和服务对应的方法中的至少一个。

在一些实施例中，属性数据类型包括：整数型、浮点型、布尔型、枚举型、字符型、结构型和图像型中的至少一种。

在一些实施例中，卡片化单元183，用于基于预设的界面卡片布局，对功能信息对应的结构化信息进行布局，并生成功能信息对应的界面卡片；其中，预设的界面卡片布局为结构化信息在界面卡片中的布局。

在一些实施例中，预设的界面卡片布局对应的信息量处于预设的信息量范围，其中，预设的信息量范围基于感知体验的带宽确定。

在一些实施例中，预设的界面卡片布局包括：一级界面卡片布局、二级界面卡片布局和三级界面卡片布局；其中，一级界面卡片布局包括：属性卡片布局、事件卡片布局和服务卡片布局；二级界面卡片布局包括：组合操作卡片布局和属性时序卡片布局，其中，组合操作为属性、事件和服务中至少两种的组合操作；三级界面卡片布局包括：组态卡片布局。

在一些实施例中，卡片化单元183，用于基于功能信息对应的结构化信息，从字典中查找功能信息对应的界面卡片；其中，字典包括结构化信息与界面卡片之间的对应关系。

在一些实施例中，应用可视化开发装置还可以包括图18中未示出的权重配置单元，用于卡片化单元183得到功能信息对应的界面卡片后，获取界面卡片的权重配置信息。页面搭建单元184，用于基于界面卡片的权重配置信息，确定界面卡片在应用页面模板中的布局位置和/或显示优先级；基于布局位置和/或显示优先级，搭建应用页面。

在一些实施例中，应用页面模板为页面栅格化的模板，且应用页面模板中的每个栅格预先配置权重范围。

在一些实施例中，应用页面模板包括多个设备端的模板；应用可视化开发装置还可以包括图18中未示出的模板确定单元，用于获取指定的设备端信息；并确定指定的设备端信息对应的应用页面模板。

在一些实施例中，应用可视化开发装置还可以包括图18中未示出的场景获取单元，用于获取数据复杂度和/或行业模式。界面卡片与数据复杂度和/或行业模式相对应，且同一功能信息在不同数据复杂度和/或行业模式下对应不同样式的界面卡片。

在一些实施例中，应用可视化开发装置还可以包括图18中未示出的数字孪生单元，用于对物对象进行数字孪生，得到物对象对应的虚对象。界面卡片中包括用于显示虚对象的显示区域；和/或，应用页面中还显示虚对象。

以上各装置实施例的具体细节可以参考各方法实施例的描述，为避免重复，不再赘述。

在一些实施例中，应用可视化开发装置中各单元的划分仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，例如应用可视化开发装置中的至少两个单元可以实现为一个单元；应用可视化开发装置中的任一单元也可以划分为多个子单元。可以理解的是，各个单元或子单元能够以电子硬件、或者计算机软件和电子硬件的结合来实现。这些功能究竟以硬件还是软件方式来执行，取决于技术方案的特定应用和设计约束条件。本领域技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能。

图19是本公开实施例提供的一种电子设备的结构示意图。该电子设备可以支持应用可视化开发平台或工具的运行。如图19所示，电子设备包括：至少一个处理器191、至少一个存储器192和至少一个通信接口193。电子设备中的各个组件通过总线系统194耦合在一起。通信接口193，用于与外部设备之间的信息传输。可理解地，总线系统194用于实现这些组件之间的连接通信。总线系统194除包括数据总线之外，还包括电源总线、控制总线和状态信号总线。但为了清楚说明起见，在图19中将各种总线都标为总线系统194。

可以理解，本实施例中的存储器192可以是易失性存储器或非易失性存储器，或可包括易失性和非易失性存储器两者。

在一些实施方式中，存储器192存储了如下的元素，可执行单元或者数据结构，或者他们的子集，或者他们的扩展集：操作系统和应用程序。

其中，操作系统，包含各种系统程序，例如框架层、核心库层、驱动层等，用于实现各种基础任务以及处理基于硬件的任务。应用程序，包含各种应用程序，例如媒体播放器(Media Player)、浏览器(Browser)等，用于实现各种应用任务。实现本公开实施例提供的应用可视化开发方法的程序可以包含在应用程序中。

在本公开实施例中，处理器191通过调用存储器192存储的程序或指令，具体的，可以是应用程序中存储的程序或指令，处理器191用于执行本公开实施例提供的应用可视化开发方法各实施例的步骤。

本公开实施例提供的应用可视化开发方法可以应用于处理器191中，或者由处理器191实现。处理器191可以是一种集成电路芯片，具有信号的处理能力。在实现过程中，上述方法的各步骤可以通过处理器191中的硬件的集成逻辑电路或者软件形式的指令完成。上述的处理器191可以是通用处理器、数字信号处理器(Digital Signal Processor，DSP)、专用集成电路(Application Specific Integrated Circuit，ASIC)、现成可编程门阵列(Field Programmable Gate Array，FPGA)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件。通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等。

本公开实施例提供的应用可视化开发方法的步骤可以直接体现为硬件译码处理器执行完成，或者用译码处理器中的硬件及软件单元组合执行完成。软件单元可以位于随机存储器，闪存、只读存储器，可编程只读存储器或者电可擦写可编程存储器、寄存器等本领域成熟的存储介质中。该存储介质位于存储器192，处理器191读取存储器192中的信息，结合其硬件完成方法的步骤。

本公开实施例还提出一种非暂态计算机可读存储介质，所述非暂态计算机可读存储介质存储程序或指令，所述程序或指令使计算机执行如应用可视化开发方法各实施例的步骤，为避免重复描述，在此不再赘述。

需要说明的是，在本文中，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者装置不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者装置所固有的要素。在没有更多限制的情况下，由语句“包括……”限定的要素，并不排除在包括该要素的过程、方法、物品或者装置中还存在另外的相同要素。

本领域的技术人员能够理解，尽管在此所述的一些实施例包括其它实施例中所包括的某些特征而不是其它特征，但是不同实施例的特征的组合意味着处于本公开的范围之内并且形成不同的实施例。

本领域的技术人员能够理解，对各个实施例的描述都各有侧重，某个实施例中没有详述的部分，可以参见其他实施例的相关描述。

虽然结合附图描述了本公开的实施方式，但是本领域技术人员可以在不脱离本公开的精神和范围的情况下做出各种修改和变型，这样的修改和变型均落入由所附权利要求所限定的范围之内。

Claims (12)

1.一种应用可视化开发方法，包括：

获取对象的功能信息；

基于所述功能信息和预设的物模型结构，确定所述对象的物模型，所述物模型包括所述功能信息对应的结构化信息；

基于所述功能信息对应的结构化信息，得到所述功能信息对应的界面卡片，所述界面卡片为用于布局在应用页面中的可重复使用的图形组件；

基于所述界面卡片，搭建应用页面，所述应用页面中包括至少一个界面卡片。

2.根据权利要求1所述的方法，其中，

所述对象为物联网中的物对象；

所述物对象包括一个或多个传感器；

一个所述传感器的信息与所述物对象的一个属性相对应。

3.根据权利要求1所述的方法，其中，

所述功能信息包括属性、事件和服务中的至少一种；

所述预设的物模型结构包括属性数据结构、事件数据结构和服务数据结构。

4.根据权利要求1所述的方法，其中，

所述基于所述功能信息对应的结构化信息，得到所述功能信息对应的界面卡片，包括：

基于预设的界面卡片布局，对所述功能信息对应的结构化信息进行布局，并生成所述功能信息对应的界面卡片；其中，所述预设的界面卡片布局为结构化信息在界面卡片中的布局。

5.根据权利要求4所述的方法，其中，

所述预设的界面卡片布局包括：一级界面卡片布局、二级界面卡片布局和三级界面卡片布局；

其中，所述一级界面卡片布局包括：属性卡片布局、事件卡片布局和服务卡片布局；

所述二级界面卡片布局包括：组合操作卡片布局和属性时序卡片布局，其中，所述组合操作为属性、事件和服务中至少两种的组合操作；

所述三级界面卡片布局包括：组态卡片布局。

6.根据权利要求1所述的方法，其中，

所述基于所述功能信息对应的结构化信息，得到所述功能信息对应的界面卡片后，所述方法还包括：获取所述界面卡片的权重配置信息；

所述基于所述界面卡片，搭建应用页面，包括：基于所述界面卡片的权重配置信息，确定所述界面卡片在应用页面模板中的布局位置和/或显示优先级；基于所述布局位置和/或所述显示优先级，搭建应用页面。

7.根据权利要求6所述的方法，其中，

所述应用页面模板为页面栅格化的模板，且所述应用页面模板中的每个栅格预先配置权重范围。

8.根据权利要求6所述的方法，其中，

所述应用页面模板包括多个设备端的模板；

所述方法还包括：获取指定的设备端信息；并确定所述指定的设备端信息对应的应用页面模板。

9.根据权利要求1所述的方法，其中，所述方法还包括：

获取数据复杂度和/或行业模式；

所述界面卡片与所述数据复杂度和/或行业模式相对应，且同一功能信息在不同数据复杂度和/或行业模式下对应不同样式的界面卡片。

10.一种应用可视化开发装置，包括：

信息获取单元，用于获取对象的功能信息；

结构化单元，用于基于所述功能信息和预设的物模型结构，确定所述对象的物模型，所述物模型包括所述功能信息对应的结构化信息；

卡片化单元，用于基于所述功能信息对应的结构化信息，得到所述功能信息对应的界面卡片，所述界面卡片为用于布局在应用页面中的可重复使用的图形组件；

页面搭建单元，用于基于所述界面卡片，搭建应用页面，所述应用页面中包括至少一个界面卡片。

11.一种电子设备，包括：处理器和存储器；

所述处理器通过调用所述存储器存储的程序或指令，用于执行如权利要求1至9任一项所述方法的步骤。

12.一种非暂态计算机可读存储介质，所述非暂态计算机可读存储介质存储程序或指令，所述程序或指令使计算机执行如权利要求1至9任一项所述方法的步骤。

Images