CN105446710B - 界面提供系统及界面提供方法 - Google Patents

界面提供系统及界面提供方法 Download PDF

Info

Publication number
CN105446710B
CN105446710B CN201410384409.8A CN201410384409A CN105446710B CN 105446710 B CN105446710 B CN 105446710B CN 201410384409 A CN201410384409 A CN 201410384409A CN 105446710 B CN105446710 B CN 105446710B
Authority
CN
China
Prior art keywords
data
interface
layout
client
control
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Active
Application number
CN201410384409.8A
Other languages
English (en)
Other versions
CN105446710A (zh
Inventor
饶俊学
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Advanced New Technologies Co Ltd
Advantageous New Technologies Co Ltd
Original Assignee
Alibaba Group Holding Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Alibaba Group Holding Ltd filed Critical Alibaba Group Holding Ltd
Priority to CN201410384409.8A priority Critical patent/CN105446710B/zh
Publication of CN105446710A publication Critical patent/CN105446710A/zh
Priority to HK16109402.5A priority patent/HK1221307A1/zh
Application granted granted Critical
Publication of CN105446710B publication Critical patent/CN105446710B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Landscapes

  • Digital Computer Display Output (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本申请公开了一种界面提供系统及界面提供方法,该界面提供系统包括:服务器和客户端,其中,该服务器,用于生成界面描述数据,并根据该客户端的请求将该界面描述数据和脚本数据发送至该客户端,其中,该界面描述数据基于JSON格式生成并用于生成界面,该脚本数据用于在被执行时将该客户端中的API接口与该界面中的界面元素进行关联,该界面描述数据包括界面类型数据、控件样式数据CSS、菜单内容数据和布局数据;该客户端,用于接收并加载该界面描述数据,并执行该脚本数据。该界面提供系统提高了开发速度、降低了更新工作量并提高了安全性。

Description

界面提供系统及界面提供方法
技术领域
本申请涉及互联网技术领域,特别涉及一种界面提供系统及界面提供方法。
背景技术
随着移动互联技术的不断发展,移动终端越来越普及,基于移动终端开发了大量的应用程序(APP)。目前,移动终端APP(特别是针对Native APP)的主要实现方式是在移动终端中安装APP客户端,APP客户端接收服务器端提供的数据,并且通过APP客户端将界面和流程写在客户端本地,从而进行加载和渲染等操作。然而,这样的实现方式存在如下缺点:
首先,对于每个APP客户端开发来说,都需要去了解该APP客户端的业务场景和流程,例如运行APP客户端的移动终端的操作系统类型等,并且需要根据该APP客户端的具体特性来实现,从而使得APP客户端的开发速度较慢。
其次,对于界面和流程的更新等,都必须要对APP客户端进行更新或升级。由于对不同的移动终端与用户来说,APP客户端的版本往往有很多个,不能很好的统一。因此,界面和流程的更新往往需要同时维护多个版本的APP客户端,不仅导致业务更新不够及时,而且服务器端需要同时维护多个版本的APP客户端也极大地增加了工作量。
最后,由于界面和流程的相关程序都记录在APP客户端本地,因此很容易出现界面注入和逻辑篡改等安全问题。
发明内容
本申请旨在至少在一定程度上解决现有技术中的上述技术问题之一。
为此,本申请的一个目的在于提出一种开发速度快、更新工作量小和安全性高的界面提供系统。
本申请实施例的第一方面提出一种界面提供系统,包括:服务器和客户端,其中,该服务器,用于生成界面描述数据,并根据该客户端的请求将该界面描述数据和脚本数据发送至该客户端,其中,该界面描述数据基于JSON格式生成并用于生成界面,该脚本数据用于在被执行时将该客户端中的API接口与该界面中的界面元素进行关联,该界面描述数据包括界面类型数据、控件样式数据CSS、菜单内容数据和布局数据;该客户端,用于接收并加载该界面描述数据,并执行该脚本数据。
在本申请的实施例中,界面提供系统具有以下三方面的技术效果。
1)提高了界面的开发速度
在本申请的实施例中,服务器基于JSON格式直接生成统一的界面描述数据,并将界面描述数据和脚本数据发送至客户端。因此服务器可以生成格式统一的界面描述数据,本申请从而界面的开发无需关注界面运行平台的具体特性,进而提高了界面的开发速度。
2)降低了更新界面所需的工作量
在本申请的实施例中,界面描述数据均基于JSON格式生成,由于JSON格式具有极强的可扩展性和通用性,因此在各个平台上均可以很好的进行加载。这就使得无需随着服务器的内容更新而更新客户端,从而减小界面更新所需的工作量。
3)提高了界面的安全性
在本申请的实施例中,由于界面描述数据和脚本数据均在服务器中生成,即界面和流程的相关数据都记录在服务器远端而非APP客户端本地,进而,避免了界面注入和逻辑篡改等安全性问题的出现。
在本申请的一个具体实施例中,该布局数据包括垂直布局数据和/或水平布局数据,该垂直布局数据包括至少一个垂直布局块,每个该垂直布局块包括基本元素数据和/或水平布局子数据,该水平布局数据包括至少一个水平布局块,每个该水平布局块包括基本元素数据和/或垂直布局子数据。
优选地,在本申请实施例的界面提供系统中,该界面类型数据包括:小窗口类型数据window、全屏界面类型数据fullscreen、提示类型数据toast和弹框类型数据dialog。
优选地,在本申请实施例的界面提供系统中,该基本元素数据包括:控件类型数据、控件名称数据name、控件值数据value、控件样式子数据和显示判断数据display。
此外,在本申请实施例的界面提供系统中,该脚本数据还用于根据用户针对该客户端生成的界面输入的操作指令调用该客户端对应的API接口,或者向该服务器反馈该操作指令以控制该界面进行相应跳转。
本申请实施例的第二方面提出一种界面提供方法,包括:服务器生成界面描述数据,并根据客户端的请求将该界面描述数据和脚本数据发送至该客户端;客户端接收并加载该界面描述数据,并执行该脚本数据,其中,该界面描述数据基于JSON格式生成并用于生成界面,该界面描述数据包括界面类型数据、控件样式数据CSS、菜单内容数据和布局数据。
在本申请的实施例中,界面提供方法具有以下三方面的技术效果。
1)提高了界面的开发速度
在本申请的实施例中,服务器基于JSON格式直接生成统一的界面描述数据,并将界面描述数据和脚本数据发送至客户端。因此服务器可以生成格式统一的界面描述数据,本申请从而使得界面的开发无需关注界面运行平台的具体特性,进而提高了界面的开发速度。
2)降低了更新界面所需的工作量
在本申请的实施例中,界面描述数据均基于JSON格式生成,由于JSON格式具有极强的可扩展性和通用性,因此在各个平台上均可以很好的进行加载。这就使得无需随着服务器的内容更新而更新客户端,从而减小界面更新所需的工作量。
3)提高了界面的安全性
在本申请的实施例中,由于界面描述数据和脚本数据均在服务器中生成,即界面和流程的相关数据都记录在服务器远端而非APP客户端本地,进而,避免了界面注入和逻辑篡改等安全性问题的出现。
本申请实施例的第三方面提出一种服务器,包括:界面描述数据生成模块,用于生成界面描述数据和脚本数据;发送模块,用于根据客户端的请求将该界面描述数和脚本数据发送至该客户端,其中,该脚本数据用于在被执行时将该客户端中的API接口与该界面中的界面元素进行关联,该界面描述数据基于JSON格式生成,该界面描述数据包括界面类型数据、控件样式数据CSS、菜单内容数据和布局数据。
本申请实施例的第四方面提出一种客户端,包括:接收模块,用于接收界面描述数据和脚本数据;加载模块,用于加载该界面描述数据并执行该脚本数据,其中,该脚本数据用于在被执行时将该客户端中的API接口与该界面中的界面元素进行关联,该界面描述数据基于JSON格式生成,该界面描述数据包括界面类型数据、控件样式数据CSS、菜单内容数据和布局数据。
附图说明
图1是根据本申请实施例的界面提供系统的结构示意图;图2是根据本申请实施例的界面提供系统的布局数据之间的关系的示意图;
图3是根据本申请实施例的界面提供系统的垂直布局数据的示意图;
图4是根据本申请实施例的界面提供系统的基本元素数据的示意图;
图5是根据本申请实施例的界面提供系统的水平布局数据的示意图;
图6是根据本申请实施例的界面提供方法的流程图;以及
图7是根据本申请实施例的界面提供系统的效果图。
具体实施方式
下面详细描述本申请的实施例,所述实施例的示例在附图中示出,其中自始至终相同或类似的标号表示相同或类似的元件或具有相同或类似功能的元件。下面通过参考附图描述的实施例是示例性的,旨在用于解释本申请,而不能理解为对本申请的限制。
在本申请的描述中,“多个”的含义是两个或两个以上,除非另有明确具体的限定。此外,对于本领域的普通技术人员而言,可以根据具体情况理解上述术语在本申请中的具体含义。
下面参照附图来描述根据本申请实施例提出的界面提供系统和界面提供方法。
图1是根据本申请实施例的界面提供系统的结构示意图。
如图1所示,在本申请的一个实施例中,界面提供系统包括:服务器10和客户端20。其中,服务器10用于生成界面描述数据a。根据客户端20的请求,服务器10将界面描述数据a和脚本数据b发送至客户端20。其中,界面描述数据a基于JSON格式生成并用于生成界面,脚本数据b用于在被执行时将客户端20中的API接口与界面中的界面元素进行关联,即客户端20可通过执行脚本数据b进行操作系统的高权限数据的读取,以进行与操作系统的高权限数据相关的操作,并保证了用户的应用体验,例如,采用预制功能对应表来执行预制功能,例如发短信和通过Lua脚本解释器以解释执行Lua脚本。
此外,界面描述数据a包括界面类型数据、控件样式数据CSS、菜单内容数据和布局数据。此外,客户端20用于接收并加载界面描述数据a,并执行脚本数据b。由于JSON格式中的JSON数组的顺序性,因此可以很好地用来控制界面元素的显示顺序,且由于JSON节点的父子关系,可以很好地用来描述页面布局和元素容器,同时由于JSON节点的水平扩展和键值唯一性,可以很好地用来描述元素的类型功能和样式。在本发明的实施例中,客户端20可为移动终端,如手机等,当然在本发明的其他实施例中,客户端20也可为其他类型的终端。
在本申请的一个具体实施例中,界面类型数据a包括:用于描述小窗口界面显示的小窗口类型数据window,用于描述全屏界面显示的全屏界面类型数据fullscreen,用于描述提示界面显示的提示类型数据toast和用于描述弹框界面显示的弹框类型数据dialog。
在本申请的该实施例中,布局数据包括垂直布局数据和/或水平布局数据。其中,该垂直布局数据包括至少一个垂直布局块,并且每个垂直布局块包括基本元素数据和/或水平布局子数据,同时,水平布局数据也包括至少一个水平布局块,并且每个水平布局块也包括基本元素数据和/或垂直布局子数据。其中,基本元素数据包括:控件类型数据、控件名称数据name、控件值数据value、控件样式子数据和显示判断数据display。
此外,在本申请的该实施例中,脚本数据b还用于根据用户针对客户端生成的界面输入的操作指令调用客户端对应的API接口,或者向服务器反馈操作指令以控制界面进行相应跳转。
在本申请的一个具体实施例中,所述界面描述数据a的基本结构如下:
Figure BDA0000549873870000071
其中,type、block、menu和css均为该界面描述数据的基本元素,type为类型数据,block为布局块,menu为菜单内容数据,css为控件样式数据。
需要说明的是,在本申请的该实施例中,由于服务器可以基于JSON格式直接生成格式统一的界面描述数据,并将界面描述数据和脚本数据发送至客户端。因此本申请服务器可以生成格式统一的界面描述数据,从而使得界面的开发无需关注界面运行平台的具体特性,进而提高了界面的开发速度。
此外,在本申请的该实施例中,类型数据type包括:用于描述小窗口界面显示的小窗口类型数据window,用于描述全屏界面显示的全屏界面类型数据fullscreen,用于描述提示界面显示的提示类型数据toast和用于描述弹框界面显示的弹框类型数据dialog。
在本申请的另一个实施例中,如表1所示,布局数据Element由五个基础属性数据组成:类型数据type、控件名称name、控件值value、控件样式数据CSS和是否显示display。
属性名称 含义
type 类型数据
name 控件名称
value 控件值
CSS 控件样式数据
display 是否显示
表1 布局数据的基础属性数据表
图2是根据本申请实施例的界面提供系统的布局数据之间的关系的示意图。
如图2所示,在本申请的该实施例中,垂直布局数据Block、水平布局数据Component和基本元素数据SimpleElement均是该布局数据Element的子类,均由上述五个基础属性数据的全部或部分构成。其中,垂直布局数据Block包括至少一个垂直布局块,且每个该垂直布局块均包括基本元素数据SimpleElement和/或水平布局子数据。此外,水平布局数据Component包括至少一个水平布局块,且每个该水平布局块均包括基本元素数据SimpleElement和/或垂直布局子数据。本申请的实施例采用的垂直布局块和水平布局块可以在二元维度上精确地描述界面组成,理论上可以支持无限的细分。
具体地,在本申请实施例中,如图3所示,垂直布局数据Block包括垂直布局块block0、block1、block2、block3、block4及block i,其中,每个垂直布局块block均具有表示垂直布局块的高度的数据,如高度wrap content,以及表示垂直布局块block的宽度的数据,如宽度fill parent,并且每个垂直布局块block的高度wrap content都是内容自适应的,每个垂直布局块block的宽度fill parent都是充满父节点的。该垂直布局数据Block的具体数据结构如下:
Figure BDA0000549873870000091
Figure BDA0000549873870000101
从上述垂直布局数据Block的数据结构中可以看出,该垂直布局数据Block由三个布局块组成,每个布局块均包含了类型数据type、控件名称name以及是否显示display这三个基础属性数据。
图4是根据本申请实施例的界面提供系统的基本元素数据的示意图。
在本申请的一个具体实施例中,如图4所示,基本元素数据SimpleElement包括多个元素element0、element1、element2以及element i,由于基本元素数据SimpleElement与垂直布局数据Block均是布局数据Element的一个子类,因此,该基本元素数据SimpleElement与垂直布局数据Block类似,即,其每个元素element均具有高度wrapcontent和宽度fill parent,并且每个元素element的高度wrap content都是内容自适应的,每个元素element的宽度fill parent都是充满父节点的。该基本元素数据SimpleElement的具体数据结构如下:
Figure BDA0000549873870000111
其中,与垂直布局数据Block相类似地,该基本数据元素SimpleElement也包含了类型数据type、控件名称name以及是否显示display这三个基础属性数据。此外,该基本数据元素SimpleElement还包括一些扩展属性,以描述其他语义,例如,label、input、password、checkbox、radio、link、combox、icon、button、img、web等基础控件。
图5是根据本申请实施例的界面提供系统的水平布局数据的示意图。
在本申请的一个具体实施例中,如图5所示,所述水平布局数据Component包括两个基本元素数据element0.2.0和element0.2.2以及一个垂直布局子数据block2.1。与垂直布局数据Block和基本元素数据SimpleElement相类似地,该水平布局数据Component也包括至少一个布局块block,并且每个布局块block均具有表示布局块block的高度的数据,高度wrap content,以及表示布局块block的宽度的数据,宽度fill parent,并且每个布局块block的高度wrap content都是内容自适应的,每个布局块block的宽度fill parent都是充满父节点的。该水平布局数据Component的具体数据结构如下:
Figure BDA0000549873870000121
Figure BDA0000549873870000131
从上述水平布局数据Component的数据结构中可以看出,该水平布局数据Component由三个布局块组成,每个布局块均包含了类型数据type、控件名称name以及是否显示display这三个基础属性数据。
在本申请的一个实施例中,控件样式数据CSS用于控件的样式,该控件样式数据CSS采用标识的CSS语法,例如:
Figure BDA0000549873870000132
此外,在本申请的该实施例中,利用控件样式数据CSS的可水平扩展性,还可引入私有属性,以辅助平台和业务区分。
在本申请的实施例中,界面描述数据均基于JSON格式生成,由于布局数据具有此结构特点,因此可以非常方便地在各个平台上进行加载,因此,对于界面的更新,只需在服务器端进行,无需客户端随服务器的内容更新而更新,从而减小界面更新所需的工作量。
此外,由于界面描述数据和脚本数据均在服务器中生成,即界面和流程的相关数据都记录在服务器远端而非APP客户端本地,进而,避免了界面注入和逻辑篡改等安全性问题的出现。
如图1所示,在本申请的一个具体实施例中,本申请服务器10包括界面描述数据生成模块101和发送模块102。界面描述数据生成模块101用于生成界面描述数据a和脚本数据b。在本申请的一个实施例中,脚本数据b用于在被执行时将客户端20中的API接口与界面中的界面元素进行关联,界面描述数据a基于JSON格式生成,界面描述数据a包括界面类型数据、控件样式数据CSS、菜单内容数据和布局数据。发送模块102用于根据客户端20的请求将界面描述数据a和脚本数据b发送至客户端20。
如图1所示,在本申请的一个具体实施例中,客户端20包括接收模块201和加载模块202。接收模块201用于接收界面描述数据a和脚本数据b。加载模块202用于加载所述界面描述数据a并执行所述脚本数据b。在本申请的该实施例中,脚本数据b用于在被执行时将客户端20中的API接口与界面中的界面元素进行关联,界面描述数据a基于JSON格式生成,界面描述数据a包括界面类型数据、控件样式数据CSS、菜单内容数据和布局数据。此外,在本发明的实施例中,客户端20可为移动终端,如手机等,当然在本发明的其他实施例中,客户端20也可为其他类型的终端。
图6是根据本申请实施例的界面提供方法的流程图。
如图6所示,本申请实施例的界面提供方法包括:
S1,服务器生成界面描述数据,并根据客户端的请求将所述界面描述数据和脚本数据发送至所述客户端。其中,界面描述数据基于JSON格式生成并用于生成界面,并且界面描述数据包括界面类型数据、控件样式数据CSS、菜单内容数据和布局数据。
S2,客户端接收并加载所述界面描述数据,并执行所述脚本数据。其中,脚本数据用于在被执行时将客户端中的API接口与界面中的界面元素进行关联。
在申请的一个优选实施例中,界面类型数据包括:用于描述小窗口界面显示的小窗口类型数据window,用于描述全屏界面显示的全屏界面类型数据fullscreen,用于描述提示界面显示的提示类型数据toast和用于描述弹框界面显示的弹框类型数据dialog。
此外,在本申请的该实施例中,布局数据包括垂直布局数据和/或水平布局数据。其中,该垂直布局数据包括至少一个垂直布局块,并且每个垂直布局块包括基本元素数据和/或水平布局子数据,同时,水平布局数据也包括至少一个水平布局块,并且每个水平布局块也包括基本元素数据和/或垂直布局子数据。其中,基本元素数据包括:控件类型数据、控件名称数据name、控件值数据value、控件样式子数据和显示判断数据display。
在本申请的一个优选实施例中,界面描述数据的基本结构有类型数据type、布局块block、菜单内容数据menu和控件样式数据css组成。在本申请的该实施例中,由于服务器可以基于JSON格式直接生成格式统一的界面描述数据,并将界面描述数据和脚本数据发送至客户端。因此本申请服务器可以生成格式统一的界面描述数据,从而使得界面的开发无需关注界面运行平台的具体特性,进而提高了界面的开发速度。
此外,在本申请的该实施例中,类型数据type包括:用于描述小窗口界面显示的小窗口类型数据window,用于描述全屏界面显示的全屏界面类型数据fullscreen,用于描述提示界面显示的提示类型数据toast和用于描述弹框界面显示的弹框类型数据dialog。
如图2所示,在本申请的另一个实施例中,布局数据Element由五个基础属性数据组成:类型数据type、控件名称name、控件值value、控件样式数据CSS和是否显示display。在本申请的该实施例中,垂直布局数据Block、水平布局数据Component和基本元素数据SimpleElement均是该布局数据Element的子类,均由上述五个基础属性数据的全部或部分构成。其中,垂直布局数据Block包括至少一个垂直布局块,且每个该垂直布局块均包括基本元素数据SimpleElement和/或水平布局子数据。此外,水平布局数据Component包括至少一个水平布局块,且每个该水平布局块均包括基本元素数据SimpleElement和/或垂直布局子数据。本申请的实施例采用的垂直布局块和水平布局块可以在二元维度上精确地描述界面组成,理论上可以支持无限的细分。
具体地,在本申请实施例中,如图3所示,垂直布局数据Block包括垂直布局块block0、block1、block2、block3、block4及block i,其中,每个垂直布局块block均具有表示垂直布局块的高度的数据,如高度wrap content,以及表示垂直布局块block的宽度的数据,如宽度fill parent,并且每个垂直布局块block的高度wrap content都是内容自适应的,每个垂直布局块block的宽度fill parent都是充满父节点的。
在本申请的一个优选实施例中,如图4所示,基本元素数据SimpleElement包括多个元素element0、element1、element2以及element i,由于基本元素数据SimpleElement与垂直布局数据Block均是布局数据Element的一个子类,因此,该基本元素数据SimpleElement与垂直布局数据Block类似,即,其每个元素element均具有高度wrapcontent和宽度fill parent,并且每个元素element的高度wrap content都是内容自适应的,每个元素element的宽度fill parent都是充满父节点的。此外,该基本数据元素SimpleElement还包括一些扩展属性,以描述其他语义,例如,label、input、password、checkbox、radio、link、combox、icon、button、img、web等基础控件。
在本申请的一个具体实施例中,如图5所示,所述水平布局数据Component包括两个基本元素数据element0.2.0和element0.2.2以及一个垂直布局子数据block2.1。与垂直布局数据Block和基本元素数据SimpleElement相类似地,该水平布局数据Component也包括至少一个布局块block,并且每个布局块block均具有表示布局块block的高度的数据,高度wrap content,以及表示布局块block的宽度的数据,宽度fill parent,并且每个布局块block的高度wrap content都是内容自适应的,每个布局块block的宽度fill parent都是充满父节点的。
此外,在本申请的一个实施例中,控件样式数据CSS用于控件的样式,该控件样式数据CSS采用标识的CSS语法。在本申请的该实施例中,利用控件样式数据CSS的可水平扩展性,还可引入私有属性,以辅助平台和业务区分。
在本申请的实施例中,界面描述数据均基于JSON格式生成,由于布局数据具有此结构特点,因此可以非常方便地在各个平台上进行加载,因此,对于界面的更新,只需在服务器端进行,无需客户端随服务器的内容更新而更新,从而减小界面更新所需的工作量。
此外,由于界面描述数据和脚本数据均在服务器中生成,即界面和流程的相关数据都记录在服务器远端而非APP客户端本地,进而,避免了界面注入和逻辑篡改等安全性问题的出现。
在本申请的一个实施例中,通过本申请的界面提供系统及界面提供方法提供的界面效果图如图7所示。
在本说明书的描述中,参考术语“一个实施例”、“一些实施例”、“示例”、“具体示例”、或“一些示例”等的描述意指结合该实施例或示例描述的具体特征、结构、材料或者特点包含于本申请的至少一个实施例或示例中。在本说明书中,对上述术语的示意性表述不必须针对的是相同的实施例或示例。而且,描述的具体特征、结构、材料或者特点可以在任何的一个或多个实施例或示例中以合适的方式结合。此外,本领域的技术人员可以将本说明书中描述的不同实施例或示例进行接合和组合。
尽管上面已经示出和描述了本申请的实施例,可以理解的是,上述实施例是示例性的,不能理解为对本申请的限制,本领域的普通技术人员在本申请的范围内可以对上述实施例进行变化、修改、替换和变型。

Claims (16)

1.一种界面提供系统,其特征在于,包括服务器和客户端,其中,
所述服务器,用于生成界面描述数据,并根据所述客户端的请求将所述界面描述数据和脚本数据发送至所述客户端,其中,所述界面描述数据基于JSON格式生成并用于生成界面,所述脚本数据用于在被执行时将所述客户端中的API接口与所述界面中的界面元素进行关联,所述界面描述数据包括界面类型数据、控件样式数据CSS、菜单内容数据和布局数据;
所述客户端,用于接收并加载所述界面描述数据,并执行所述脚本数据;
所述布局数据包括垂直布局数据和/或水平布局数据,所述垂直布局数据包括至少一个垂直布局块,每个所述垂直布局块包括基本元素数据和/或水平布局子数据,所述水平布局数据包括至少一个水平布局块,每个所述水平布局块包括基本元素数据和/或垂直布局子数据;
其中,所述垂直布局数据、所述水平布局数据和所述基本元素数据均是所述布局数据的子类,均由具有基础属性:类型数据、控件名称、控件值、控件样式数据、是否显示的数据的全部或者部分构成,每个所述垂直布局块均具有表示垂直布局块的高度的数据,以及表示所述垂直布局块的宽度的数据,且每个所述垂直布局块的高度都是内容自适应的,每个所述垂直布局块的宽度都是充满父节点的,每个所述基本元素数据的元素均具有高度和宽度,且每个所述元素的高度都是内容自适应的,每个所述元素的宽度都是充满父节点的。
2.根据权利要求1所述的界面提供系统,其特征在于,所述界面类型数据包括:小窗口类型数据window、全屏界面类型数据fullscreen、提示类型数据toast和弹框类型数据dialog。
3.根据权利要求1所述的界面提供系统,其特征在于,所述基本元素数据包括:控件类型数据、控件名称数据name、控件值数据value、控件样式子数据和显示判断数据display。
4.根据权利要求1所述的界面提供系统,其特征在于,所述脚本数据还用于根据用户针对所述客户端生成的界面输入的操作指令调用所述客户端对应的API接口,或者向所述服务器反馈所述操作指令以控制所述界面进行相应跳转。
5.一种界面提供方法,其特征在于,包括:
服务器生成界面描述数据,并根据客户端的请求将所述界面描述数据和脚本数据发送至所述客户端;
客户端接收并加载所述界面描述数据,并执行所述脚本数据,其中,所述界面描述数据基于JSON格式生成并用于生成界面,所述界面描述数据包括界面类型数据、控件样式数据CSS、菜单内容数据和布局数据;
所述布局数据包括垂直布局数据和/或水平布局数据,所述垂直布局数据包括至少一个垂直布局块,每个所述垂直布局块包括基本元素数据和/或水平布局子数据,所述水平布局数据包括至少一个水平布局块,每个所述水平布局块包括基本元素数据和/或垂直布局子数据;
其中,所述垂直布局数据、所述水平布局数据和所述基本元素数据均是所述布局数据的子类,均由具有基础属性:类型数据、控件名称、控件值、控件样式数据、是否显示的数据的全部或者部分构成,每个所述垂直布局块均具有表示垂直布局块的高度的数据,以及表示所述垂直布局块的宽度的数据,且每个所述垂直布局块的高度都是内容自适应的,每个所述垂直布局块的宽度都是充满父节点的,每个所述基本元素数据的元素均具有高度和宽度,且每个所述元素的高度都是内容自适应的,每个所述元素的宽度都是充满父节点的。
6.根据权利要求5所述的界面提供方法,其特征在于,所述界面类型数据包括:小窗口类型数据window、全屏界面类型数据fullscreen、提示类型数据toast和弹框类型数据dialog。
7.根据权利要求5所述的界面提供方法,其特征在于,所述基本元素数据包括:控件类型数据、控件名称数据name、控件值数据value、控件样式子数据和显示判断数据display。
8.根据权利要求6所述的界面提供方法,其特征在于,所述脚本数据还用于根据用户针对所述客户端生成的界面输入的操作指令调用所述客户端对应的API接口,或者向所述服务器反馈所述操作指令以控制所述界面进行相应跳转。
9.一种服务器,其特征在于,包括:
界面描述数据生成模块,用于生成界面描述数据和脚本数据;
发送模块,用于根据客户端的请求将所述界面描述数和脚本数据发送至所述客户端,其中,所述脚本数据用于在被执行时将所述客户端中的API接口与所述界面中的界面元素进行关联,所述界面描述数据基于JSON格式生成,所述界面描述数据包括界面类型数据、控件样式数据CSS、菜单内容数据和布局数据;
其中,所述布局数据包括垂直布局数据和/或水平布局数据,所述垂直布局数据包括至少一个垂直布局块,每个所述垂直布局块包括基本元素数据和/或水平布局子数据,所述水平布局数据包括至少一个水平布局块,每个所述水平布局块包括基本元素数据和/或垂直布局子数据;
其中,所述垂直布局数据、所述水平布局数据和所述基本元素数据均是所述布局数据的子类,均由具有基础属性:类型数据、控件名称、控件值、控件样式数据、是否显示的数据的全部或者部分构成,每个所述垂直布局块均具有表示垂直布局块的高度的数据,以及表示所述垂直布局块的宽度的数据,且每个所述垂直布局块的高度都是内容自适应的,每个所述垂直布局块的宽度都是充满父节点的,每个所述基本元素数据的元素均具有高度和宽度,且每个所述元素的高度都是内容自适应的,每个所述元素的宽度都是充满父节点的。
10.如权利要求9所述的服务器,其特征在于,所述界面类型数据包括:小窗口类型数据window、全屏界面类型数据fullscreen、提示类型数据toast和弹框类型数据dialog。
11.如权利要求9所述的服务器,其特征在于,所述基本元素数据包括:控件类型数据、控件名称数据name、控件值数据value、控件样式子数据和显示判断数据display。
12.如权利要求9所述的服务器,其特征在于,所述脚本数据还用于根据用户针对所述客户端生成的界面输入的操作指令调用所述客户端对应的API接口,或者向所述服务器反馈所述操作指令以控制所述界面进行相应跳转。
13.一种客户端,其特征在于,包括:
接收模块,用于接收界面描述数据和脚本数据;
加载模块,用于加载所述界面描述数据并执行所述脚本数据,其中,所述脚本数据用于在被执行时将所述客户端中的API接口与所述界面中的界面元素进行关联,所述界面描述数据基于JSON格式生成,所述界面描述数据包括界面类型数据、控件样式数据CSS、菜单内容数据和布局数据;
其中,所述布局数据包括垂直布局数据和/或水平布局数据,所述垂直布局数据包括至少一个垂直布局块,每个所述垂直布局块包括基本元素数据和/或水平布局子数据,所述水平布局数据包括至少一个水平布局块,每个所述水平布局块包括基本元素数据和/或垂直布局子数据;
其中,所述垂直布局数据、所述水平布局数据和所述基本元素数据均是所述布局数据的子类,均由具有基础属性:类型数据、控件名称、控件值、控件样式数据、是否显示的数据的全部或者部分构成,每个所述垂直布局块均具有表示垂直布局块的高度的数据,以及表示所述垂直布局块的宽度的数据,且每个所述垂直布局块的高度都是内容自适应的,每个所述垂直布局块的宽度都是充满父节点的,每个所述基本元素数据的元素均具有高度和宽度,且每个所述元素的高度都是内容自适应的,每个所述元素的宽度都是充满父节点的。
14.如权利要求13所述的客户端,其特征在于,所述界面类型数据包括:小窗口类型数据window、全屏界面类型数据fullscreen、提示类型数据toast和弹框类型数据dialog。
15.如权利要求13所述的客户端,其特征在于,所述基本元素数据包括:控件类型数据、控件名称数据name、控件值数据value、控件样式子数据和显示判断数据display。
16.如权利要求13所述的客户端,其特征在于,所述脚本数据还用于根据用户针对所述客户端生成的界面输入的操作指令调用所述客户端对应的API接口,或者向服务器反馈所述操作指令以控制所述界面进行相应跳转。
CN201410384409.8A 2014-08-06 2014-08-06 界面提供系统及界面提供方法 Active CN105446710B (zh)

Priority Applications (2)

Application Number Priority Date Filing Date Title
CN201410384409.8A CN105446710B (zh) 2014-08-06 2014-08-06 界面提供系统及界面提供方法
HK16109402.5A HK1221307A1 (zh) 2014-08-06 2016-08-08 界面提供系統及界面提供方法

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201410384409.8A CN105446710B (zh) 2014-08-06 2014-08-06 界面提供系统及界面提供方法

Publications (2)

Publication Number Publication Date
CN105446710A CN105446710A (zh) 2016-03-30
CN105446710B true CN105446710B (zh) 2020-04-14

Family

ID=55556964

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201410384409.8A Active CN105446710B (zh) 2014-08-06 2014-08-06 界面提供系统及界面提供方法

Country Status (2)

Country Link
CN (1) CN105446710B (zh)
HK (1) HK1221307A1 (zh)

Families Citing this family (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN107066244B (zh) * 2016-12-12 2020-12-18 阿里巴巴(中国)有限公司 一种移动终端应用界面的生成方法和装置
CN110471661A (zh) * 2019-08-20 2019-11-19 深圳科蓝金信科技发展有限公司 前端界面的数据描述方法及前端界面的生成方法

Citations (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN1487446A (zh) * 2003-06-24 2004-04-07 深圳市华磊网络技术有限公司 服务器端应用为浏览器客户端提供用户界面的方法
CN102667751A (zh) * 2010-03-12 2012-09-12 波鲁格有限公司 实现基于网络的通信终端的用户界面的装置及其方法
CN103176804A (zh) * 2013-04-19 2013-06-26 中国海洋大学 一种用户界面实现方法
CN103645951A (zh) * 2013-12-19 2014-03-19 北京邮电大学 一种跨平台的移动数据管理系统及其方法
CN104503742A (zh) * 2014-12-01 2015-04-08 北京金和软件股份有限公司 一种自动生成app的方法
CN104503746A (zh) * 2014-12-11 2015-04-08 北京金和软件股份有限公司 一种在app开发平台上快速打包ios应用程序的方法
CN104516738A (zh) * 2014-12-15 2015-04-15 北京金和软件股份有限公司 一种app应用的开发与发布一体化实现方法

Patent Citations (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN1487446A (zh) * 2003-06-24 2004-04-07 深圳市华磊网络技术有限公司 服务器端应用为浏览器客户端提供用户界面的方法
CN102667751A (zh) * 2010-03-12 2012-09-12 波鲁格有限公司 实现基于网络的通信终端的用户界面的装置及其方法
CN103176804A (zh) * 2013-04-19 2013-06-26 中国海洋大学 一种用户界面实现方法
CN103645951A (zh) * 2013-12-19 2014-03-19 北京邮电大学 一种跨平台的移动数据管理系统及其方法
CN104503742A (zh) * 2014-12-01 2015-04-08 北京金和软件股份有限公司 一种自动生成app的方法
CN104503746A (zh) * 2014-12-11 2015-04-08 北京金和软件股份有限公司 一种在app开发平台上快速打包ios应用程序的方法
CN104516738A (zh) * 2014-12-15 2015-04-15 北京金和软件股份有限公司 一种app应用的开发与发布一体化实现方法

Also Published As

Publication number Publication date
HK1221307A1 (zh) 2017-05-26
CN105446710A (zh) 2016-03-30

Similar Documents

Publication Publication Date Title
KR102002754B1 (ko) 스프레드시트 객체의 코드리스 공유
US20120317172A1 (en) Mobile web app infrastructure
US8001213B2 (en) Method, apparatus and computer program product for providing unrestricted content on a user terminal
US20130067456A1 (en) Application configuration framework for enterprise resource planning application installation
CN109445783A (zh) 由服务驱动的动态配置应用的构建方法及装置
CN104601433A (zh) 应用信息窗口展示方法、客户端、服务器及系统
CN103870254A (zh) 一种动态表单的实现方法、客户端及服务器
CN104702703A (zh) 一种数据更新方法及装置
CN105446710B (zh) 界面提供系统及界面提供方法
CN104077151A (zh) 快速启动网络应用的方法和电子设备
US8635525B2 (en) Systems, methods and computer readable media for creating and updating electronic documents
CN101876998A (zh) 一种实现数据编辑的方法和系统
CN108920645A (zh) 智能设备页面显示的方法、装置、智能设备和存储介质
CN112764746A (zh) 数据处理方法、装置、电子设备及存储介质
CN103200266B (zh) 对网络应用进行管理的方法、网络应用管理器及系统
CN106775790B (zh) 一种控件调用方法以及装置
CN107301089B (zh) 一种app部署及调用方法和终端
CN115146198A (zh) 一种基于Electron的简易浏览器实现方法及系统
CN111124386B (zh) 基于Unity的动画事件处理方法、装置、设备和存储介质
CN114255084A (zh) 一种广告页面展示方法、装置及系统
CN114296833A (zh) 业务界面组件配置方法及其装置、设备、介质
US20200320148A1 (en) Multi-entry point navigation for user interfaces
CN113886240A (zh) 可视化回归测试方法、装置、计算机设备及存储介质
KR101415249B1 (ko) 어플리케이션의 제작 및 실행을 지원하는 방법 및 장치
CN115134651A (zh) 数据处理方法、装置、计算机设备和存储介质

Legal Events

Date Code Title Description
C06 Publication
PB01 Publication
C10 Entry into substantive examination
SE01 Entry into force of request for substantive examination
REG Reference to a national code

Ref country code: HK

Ref legal event code: DE

Ref document number: 1221307

Country of ref document: HK

GR01 Patent grant
GR01 Patent grant
TR01 Transfer of patent right
TR01 Transfer of patent right

Effective date of registration: 20200924

Address after: Cayman Enterprise Centre, 27 Hospital Road, George Town, Grand Cayman Islands

Patentee after: Innovative advanced technology Co.,Ltd.

Address before: Cayman Enterprise Centre, 27 Hospital Road, George Town, Grand Cayman Islands

Patentee before: Advanced innovation technology Co.,Ltd.

Effective date of registration: 20200924

Address after: Cayman Enterprise Centre, 27 Hospital Road, George Town, Grand Cayman Islands

Patentee after: Advanced innovation technology Co.,Ltd.

Address before: A four-storey 847 mailbox in Grand Cayman Capital Building, British Cayman Islands

Patentee before: Alibaba Group Holding Ltd.