基于Sketch的跨平台界面开发方法和系统、计算机设备和介质技术方案

技术编号:30769956 阅读:100 留言:0更新日期:2021-11-10 12:37
本发明专利技术实施例公开一种基于Sketch的跨平台界面开发方法和装置、计算机设备和介质。在一具体实施方式中,该方法包括:获取标准模板,标准模板具有标准界面版式;获取目标模板、提取目标模板的图层信息并将图层信息发送至服务器,使得服务器根据所述图层信息提取文本信息数据,目标模板具有与待形成的界面对应的目标界面版式;接收文本信息数据并注入至标准模板以更新目标界面版式;以及根据目标界面版式进行代码化生成代码块文件,代码块文件用于生成具有目标界面版式的跨平台界面。该实施方式通过Sketch插件提取目标模板的图层信息并发送至服务器使其提取目标模板的文本信息数据,从而更新目标模板并代码化以生成跨平台界面,降低了UI设计人员的工作量。降低了UI设计人员的工作量。降低了UI设计人员的工作量。

【技术实现步骤摘要】
基于Sketch的跨平台界面开发方法和系统、计算机设备和介质


[0001]本专利技术涉及计算机技术。更具体地,涉及一种基于Sketch的跨平台界面开发方法和系统、计算机设备和介质。

技术介绍

[0002]低代码,是一种可以让开发者依托平台快速搭建企业信息化的系统,在这过程中,使用者只需要少量的代码编写,其他的大部分工作都是通过可视化的拖拽、点选完成。无代码或称零代码是一种完全不需要任何代码编程的开发方式,它主要是围绕企业数据和业务管理需求,通过可视化方式设计数据结构,用户交互形式、设置访问权限和定义工作流程的平台。
[0003]目前,市面上的低代码平台更多的使用用户面向开发人员,无代码开发平台一般也需要具备部分软件开发技术能力可以流畅使用,而缺乏面向UI(User Interface)设计人员的无代码设计平台,UI设计人员在设计时需要大量冗余工作量,设计风格也难以保持统一,UI设计开发周期长。

技术实现思路

[0004]本专利技术的目的在于提供一种,以解决现有技术存在的问题中的至少一个。
[0005]为达到上述目的,本专利技术采用下述技术方案:
[0006]本专利技术第一方面提供了一种基于Sketch的跨平台界面开发方法,应用于客户端,包括:
[0007]获取标准模板,标准模板具有标准界面版式;
[0008]获取目标模板、提取目标模板的图层信息并将图层信息发送至服务器,使得服务器根据图层信息提取文本信息数据,目标模板具有与待形成的界面对应的目标界面版式;
>[0009]接收文本信息数据并注入至标准模板以将标准模板更新为目标界面版式;以及
[0010]根据目标界面版式进行代码化生成代码块文件,代码块文件用于生成具有目标界面版式的跨平台界面。
[0011]在一些可选的实施例中,获取目标模板、提取目标模板的图层信息并将图层信息发送至服务器进一步包括:
[0012]获取目标模板;
[0013]提取目标模板的图层;
[0014]将图层中的元素解析为元素数据;
[0015]将元素数据转换为用于发送的编码数据。
[0016]在一些可选的实施例中,接收文本信息数据并注入至标准模板以将标准模板更新为目标界面版式进一步包括:
[0017]将文本信息数据按照目标界面版式中的界面图形逻辑解析为表征各图形的多个
数据数组,界面图形逻辑包括:每个图形的维数、文本位置、以及文本内容中的一个或多个;以及
[0018]将数据数组注入标准模板并根据数据数组表征的界面图形逻辑将目标模板的界面版式更新为目标界面版式。
[0019]在一些可选的实施例中,根据目标界面版式进行代码化生成代码块文件进一步包括:
[0020]获取预存储的标准模板的标准代码块;
[0021]根据目标界面版式的数据数组修改标准代码块中的位置信息;
[0022]将位置信息和所述多个数据数组中的文本内容注入标准代码块,形成基于跨平台的代码块文件,基于跨平台的代码块文件用于生成跨平台界面。
[0023]在一些可选的实施例中,编码数据为基于Base64的编码数据,跨平台的代码块文件为Flutter代码块文件。
[0024]本专利技术第二方面提供了一种跨平台界面开发方法,应用于服务器,包括:
[0025]接收目标模板的图层信息,其中目标模板具有与待形成的界面对应的目标界面版式;
[0026]根据图层信息提取文本信息数据;
[0027]输出文本信息数据以生成具有目标界面版式的跨平台界面。
[0028]在一些可选的实施例中,根据图层信息提取文本信息数据进一步包括:
[0029]对图层信息进行文本检测;
[0030]基于文本检测结果识别图层信息中的文本数据;以及
[0031]基于文本数据提取文本信息数据。
[0032]在一些可选的实施例中,对图层信息进行文本检测进一步包括:对图层信息进行解码并基于解码结果对图层信息进行文本检测,
[0033]当文本检测结果表示包含文本数据时,根据图层信息提取文本信息数据进一步包括:
[0034]基于信息抽取算法提取文本数据的文本信息,文本信息包括文本位置和文本内容;以及
[0035]基于文本信息生成具有第一结构体格式的文本信息数据。
[0036]在一些可选的实施例中,文本检测结果表示未包含文本数据时,基于文本数据提取文本信息数据进一步包括:
[0037]生成具有第二结构体格式的文本信息数据,文本信息数据为提取失败消息。
[0038]本专利技术第三方面提供了一种实现如上文所述第一方面所述的跨平台界面开发方法的界面开发装置,包括:
[0039]交互模块,配置为获取标准模板和目标模板,其中,标准模板具有标准界面版式,目标模板具有与待形成的界面对应的目标界面版式;
[0040]提取模块,配置为提取目标模板的图层信息;
[0041]通信模块,配置为将图层信息发送至服务器并自服务器接收文本信息数据;
[0042]逻辑处理模块,配置为将文本信息数据注入标准模板以更新目标界面版式;以及
[0043]代码块生成模块,配置为根据目标界面版式进行代码化生成代码块文件,代码块
文件用于生成具有目标界面版式的跨平台界面。
[0044]本专利技术第四方面提供了一种实现如上文第二方面所述的跨平台界面开发方法的界面开发装置,包括:
[0045]文本提取模块,配置为对接收到的目标模板的图层信息提取文本信息数据,目标模板具有与待形成的界面对应的目标界面版式;
[0046]通信模块,配置为接收图层数据并输出文本信息数据,以用于生成具有目标界面版式的跨平台界面。
[0047]本专利技术第五方面提供了一种计算机设备,包括:
[0048]一个或多个处理器;
[0049]存储装置,其上存储一个或多个程序;
[0050]当所述一个或多个程序被所述一个或多个处理器执行时,使得所述一个或多个处理器实现如上文第一方面所述的方法或者如上文第二方面所述的方法。
[0051]本专利技术第六方面一种计算机可读存储介质,其上存储有计算机程序,其中,该程序被处理器执行时实现如第一方面所述的方法或者如第二方面所述的方法。
[0052]本专利技术的有益效果如下:
[0053]本专利技术针对目前现有的问题,制定一种基于Sketch的跨平台界面开发方法和系统、计算机设备和介质,通过利用Sketch插件提取目标模板的图层信息并发送至服务器,使其提取目标模板的文本信息数据,将接收的文本信息数据注入标准模板来更新界面版式并代码化以生成具有目标界面版式的跨平台界面,实现了面对界面设计人员的无代码化开发平台,降低了界面设计人员的工作量,从而弥补了现有技术中存在的问题,有效提高界面设计的灵活性,提高设计人员的工作效率,降低产品设计开发成本,具有广泛的应用前景。
附图说明
[0054]下面结本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种基于Sketch的跨平台界面开发方法,应用于客户端,其特征在于,包括:获取标准模板,所述标准模板具有标准界面版式;获取目标模板、提取所述目标模板的图层信息并将所述图层信息发送至服务器,使得所述服务器根据所述图层信息提取文本信息数据,所述目标模板具有与待形成的界面对应的目标界面版式;接收所述文本信息数据并注入至所述标准模板以将所述标准模板更新为所述目标界面版式;以及根据所述目标界面版式进行代码化生成代码块文件,所述代码块文件用于生成具有目标界面版式的跨平台界面。2.根据权利要求1所述的跨平台界面开发方法,其特征在于,所述获取目标模板、提取所述目标模板的图层信息并将所述图层信息发送至服务器进一步包括:获取所述目标模板;提取所述目标模板的图层;将所述图层中的元素解析为元素数据;将所述元素数据转换为用于发送的编码数据。3.根据权利要求1所述的跨平台界面开发方法,其特征在于,所述接收所述文本信息数据并注入至所述标准模板以将标准模板更新为所述目标界面版式进一步包括:将所述文本信息数据按照所述目标界面版式中的界面图形逻辑解析为表征各图形的多个数据数组,所述界面图形逻辑包括:每个图形的维数、文本位置、以及文本内容中的一个或多个;以及将所述数据数组注入所述标准模板并根据所述数据数组表征的界面图形逻辑将所述目标模板的界面版式更新为所述目标界面版式。4.根据权利要求3所述的跨平台界面开发方法,其特征在于,所述根据所述目标界面版式进行代码化生成代码块文件进一步包括:获取预存储的标准模板的标准代码块;根据所述目标界面版式的所述数据数组修改所述标准代码块中的位置信息;将所述位置信息和所述多个数据数组中的文本内容注入所述标准代码块,形成基于跨平台的代码块文件,所述基于跨平台的代码块文件用于生成跨平台界面。5.根据权利要求2所述的跨平台界面开发方法,其特征在于,所述编码数据为基于Base64的编码数据,所述跨平台的代码块文件为Flutter代码块文件。6.一种跨平台界面开发方法,应用于服务器,其特征在于,包括:接收目标模板的图层信息,其中所述目标模板具有与待形成的界面对应的目标界面版式;根据所述图层信息提取文本信息数据;输出所述文本信息数据以生成具有目标界面版式的跨平台界面。7.根据权利要求6所述的跨平台界面开发方法,其特征在于,所述根据所述图层信息提取文本信息数据进一步包括:对所述图层信息进行文本检测;基于文本检测结果识别所述图层信息中的文本数据;以及
基...

【专利技术属性】
技术研发人员:赵振焱姜苏珈李坤陈乃川张哲李存青
申请(专利权)人:京东方科技集团股份有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1