CN114090066A - 用户界面卡片视图生成方法、装置、计算机设备及介质 - Google Patents
用户界面卡片视图生成方法、装置、计算机设备及介质 Download PDFInfo
- Publication number
- CN114090066A CN114090066A CN202111432672.6A CN202111432672A CN114090066A CN 114090066 A CN114090066 A CN 114090066A CN 202111432672 A CN202111432672 A CN 202111432672A CN 114090066 A CN114090066 A CN 114090066A
- Authority
- CN
- China
- Prior art keywords
- card
- view
- user interface
- generating
- configuration file
- 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.)
- Pending
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/70—Software maintenance or management
- G06F8/71—Version control; Configuration management
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/34—Graphical or visual programming
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- General Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Computer Security & Cryptography (AREA)
- Human Computer Interaction (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本申请实施例属于界面设计技术领域,涉及一种用户界面卡片视图生成方法,包括获取用户界面卡片的标识信息,根据标识信息生成视图配置文件,按照预设数据结构配置用户界面卡片的卡片参数,解析预设数据结构,获得对应的卡片参数,根据卡片参数和视图配置文件生成用户界面卡片的卡片配置文件,在接收到视图更新请求时,根据卡片配置文件渲染出卡片视图。本申请还提供一种用户界面卡片视图生成装置、计算机设备及介质。此外,本申请还涉及区块链技术,卡片参数可存储于区块链中。本申请可以提升新用户界面卡片的开发效率。
Description
技术领域
本申请涉及界面设计技术领域,尤其涉及一种用户界面卡片视图生成方法、装置、计算机设备及介质。
背景技术
随着智能终端的发展,各种内容的提供商、服务供应商等基本都开发属于自己的APP(应用程序)。APP UI(User Interface,用户界面)可配置化是提高日活的基础能力,对于产品、运营人员来说,及时生效的UI效果,可以根据实际需要配置个性化样式,增加用户黏性,并且有助于产品、运营人员调整卡片位置,修改运营策略。
传统智能终端如果需要修改UI卡片位置,或者移动到其他模块,需要经过开发修改、测试、产品验收、提交市场审核等一系列繁琐过程,时间成本非常高。同时,对于临时进行发版修改,不利于充分测试,新版本容易出现异常,用户体验度较差,进而造成用户的流失。
发明内容
本申请实施例的目的在于提出一种用户界面卡片视图生成方法、装置、计算机设备及介质,以解决相关技术中用户界面卡片视图开发过程繁琐,开发效率低,造成临时发行的新版本无法充分测试,导致新版本容易出现异常的技术问题。
为了解决上述技术问题,本申请实施例提供一种用户界面卡片视图生成方法,采用了如下所述的技术方案:
获取用户界面卡片的标识信息,根据所述标识信息生成视图配置文件;
按照预设数据结构配置所述用户界面卡片的卡片参数;
解析所述预设数据结构,获得所述预设数据结构中的卡片参数;
根据所述卡片参数和所述视图配置文件生成所述用户界面卡片的卡片配置文件;
在接收到视图更新请求时,根据所述卡片配置文件渲染出卡片视图。
进一步的,所述根据所述标识信息生成视图配置文件的步骤包括:
根据所述标识信息,构建所述用户界面卡片对应的待展示视图;
根据所述待展示视图生成所述待展示视图的视图逻辑,基于所述待展示视图和所述视图逻辑生成所述视图配置文件。
进一步的,所述根据所述待展示视图生成所述待展示视图的视图逻辑的步骤包括:
将所述待展示视图拆分为各子视图,并生成各子视图相对应的视图类;
根据每个所述视图类生成与每个所述子视图对应的子视图控制器和子视图逻辑;
将所述各视图类和所述子视图逻辑分别封装在所述各子视图控制器中,得到所述视图逻辑。
进一步的,所述解析所述预设数据结构,获得所述预设数据结构中的卡片参数的步骤包括:
对所述预设数据结构解析,从所述预设数据结构中获得每个所述卡片参数的层级关系;
根据所述层级关系得到DOM树;
遍历所述DOM树的节点,得到每个所述节点对应的卡片参数。
进一步的,所述根据所述卡片参数和所述视图配置文件生成所述用户界面卡片的卡片配置文件的步骤包括:
根据所述卡片参数得到卡片数据;
根据所述卡片参数,创建所述视图配置文件与所述卡片数据的映射关系;
基于所述映射关系,将所述卡片数据分发至所述卡片对应的视图配置文件;
将所述卡片数据和对应的所述视图配置文件进行组装,生成所述卡片配置文件。
进一步的,所述根据所述卡片参数得到卡片数据的步骤包括:
从所述卡片参数中读取卡片业务接口;
根据所述卡片业务接口获取业务数据,将所述卡片参数和所述业务数据作为卡片数据。
进一步的,所述根据所述卡片配置文件渲染出卡片视图的步骤包括:
通过数据源机制,从所述卡片配置文件中获取到所述卡片数据和所述视图逻辑;
通过代理机制,按照所述视图逻辑将所述卡片数据渲染至所述用户界面卡片,得到卡片视图。
为了解决上述技术问题,本申请实施例还提供一种卡片视图生成装置,采用了如下所述的技术方案:
获取模块,用于获取用户界面卡片的标识信息,根据所述标识信息生成视图配置文件;
配置模块,用于按照预设数据结构配置所述用户界面卡片的卡片参数;
解析模块,用于解析所述预设数据结构,获得所述预设数据结构中的卡片参数;
生成模块,用于根据所述卡片参数和所述视图配置文件生成所述用户界面卡片的卡片配置文件;
展示模块,用于在接收到视图更新请求时,根据所述卡片配置文件渲染出卡片视图。
为了解决上述技术问题,本申请实施例还提供一种计算机设备,采用了如下所述的技术方案:
该计算机设备包括存储器和处理器,所述存储器中存储有计算机可读指令,所述处理器执行所述计算机可读指令时实现如上所述的用户界面卡片视图生成方法的步骤。
为了解决上述技术问题,本申请实施例还提供一种计算机可读存储介质,采用了如下所述的技术方案:
所述计算机可读存储介质上存储有计算机可读指令,所述计算机可读指令被处理器执行时实现如上所述的用户界面卡片视图生成方法的步骤。
与现有技术相比,本申请实施例主要有以下有益效果:
本申请通过获取用户界面卡片的标识信息,根据标识信息生成视图配置文件,按照预设数据结构配置用户界面卡片的卡片参数,解析预设数据结构,获得预设数据结构中的卡片参数,根据卡片参数和视图配置文件生成用户界面卡片的卡片配置文件,在接收到视图更新请求时,根据卡片配置文件渲染出卡片视图;本申请通过配置的卡片参数和视图配置文件生成的卡片配置文件渲染出卡片视图,可以提升新用户界面卡片的开发效率,提升新用户界面卡片生成效率,同时可以保证充分测试,减少异常问题的出现,提升用户体验,增加用户黏性,此外,开发过程简单,可以降低维护成本。
附图说明
为了更清楚地说明本申请中的方案,下面将对本申请实施例描述中所需要使用的附图作一个简单介绍,显而易见地,下面描述中的附图是本申请的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
图1是本申请可以应用于其中的示例性系统架构图;
图2根据本申请的用户界面卡片视图生成方法的一个实施例的流程图;
图3是根据本申请的用户界面卡片视图生成装置的一个实施例的结构示意图;
图4是根据本申请的计算机设备的一个实施例的结构示意图。
具体实施方式
除非另有定义,本文所使用的所有的技术和科学术语与属于本申请的技术领域的技术人员通常理解的含义相同;本文中在申请的说明书中所使用的术语只是为了描述具体的实施例的目的,不是旨在于限制本申请;本申请的说明书和权利要求书及上述附图说明中的术语“包括”和“具有”以及它们的任何变形,意图在于覆盖不排他的包含。本申请的说明书和权利要求书或上述附图中的术语“第一”、“第二”等是用于区别不同对象,而不是用于描述特定顺序。
在本文中提及“实施例”意味着,结合实施例描述的特定特征、结构或特性可以包含在本申请的至少一个实施例中。在说明书中的各个位置出现该短语并不一定均是指相同的实施例,也不是与其它实施例互斥的独立的或备选的实施例。本领域技术人员显式地和隐式地理解的是,本文所描述的实施例可以与其它实施例相结合。
为了使本技术领域的人员更好地理解本申请方案,下面将结合附图,对本申请实施例中的技术方案进行清楚、完整地描述。
本申请提供了一种用户界面卡片视图生成方法,可以应用于如图1所示的系统架构100中,系统架构100可以包括终端设备101、102、103,网络104和服务器105。网络104用以在终端设备101、102、103和服务器105之间提供通信链路的介质。网络104可以包括各种连接类型,例如有线、无线通信链路或者光纤电缆等等。
用户可以使用终端设备101、102、103通过网络104与服务器105交互,以接收或发送消息等。终端设备101、102、103上可以安装有各种通讯客户端应用,例如网页浏览器应用、购物类应用、搜索类应用、即时通信工具、邮箱客户端、社交平台软件等。
终端设备101、102、103可以是具有显示屏并且支持网页浏览的各种电子设备,包括但不限于智能手机、平板电脑、电子书阅读器、MP3播放器(Moving Picture ExpertsGroup Audio Layer III,动态影像专家压缩标准音频层面3)、MP4(Moving PictureExperts Group Audio Layer IV,动态影像专家压缩标准音频层面4)播放器、膝上型便携计算机和台式计算机等等。
服务器105可以是提供各种服务的服务器,例如对终端设备101、102、103上显示的页面提供支持的后台服务器。
需要说明的是,本申请实施例所提供的用户界面卡片视图生成方法一般由服务器/终端设备执行,相应地,用户界面卡片视图生成装置一般设置于服务器/终端设备中。
应该理解,图1中的终端设备、网络和服务器的数目仅仅是示意性的。根据实现需要,可以具有任意数目的终端设备、网络和服务器。
继续参考图2,示出了根据本申请的用户界面卡片视图生成方法的一个实施例的流程图,包括以下步骤:
步骤S201,获取用户界面卡片的标识信息,根据标识信息生成视图配置文件。
其中,用户界面(User Interface,UI)卡片,是展示视图的容器,不同用户界面卡片对应展示不同视图,用户界面卡片预先在用户终端本地进行构建。
在本实施例中,用户终端本地获取用户界面卡片的标识信息,根据用户界面卡片标识信息生成用户界面卡片对应的视图配置文件。其中,视图配置文件包括视图(View)和视图逻辑(ViewConfig)。应当理解,View和ViewConfig一一对应,每张用户界面卡片都有其对应的View和ViewConfig。
步骤S202,按照预设数据结构配置用户界面卡片的卡片参数。
在本实施例中,卡片参数可以在系统后台进行配置,包括但不限于卡内容标题、详情页跳转路径、卡片标识信息、卡片类型、业务接口等,将卡片参数按照系统可读的预设数据结构进行配置。
需要强调的是,为进一步保证卡片参数的私密和安全性,上述卡片参数还可以存储于一区块链的节点中。
本申请所指区块链是分布式数据存储、点对点传输、共识机制、加密算法等计算机技术的新型应用模式。区块链(Blockchain),本质上是一个去中心化的数据库,是一串使用密码学方法相关联产生的数据块,每一个数据块中包含了一批次网络交易的信息,用于验证其信息的有效性(防伪)和生成下一个区块。区块链可以包括区块链底层平台、平台产品服务层以及应用服务层等。
步骤S203,解析预设数据结构,获得预设数据结构中的卡片参数。
用户终端启动后,会从系统后台拉取配置的卡片参数,按照协议规定的数据解析逻辑进行数据解析,得到解析后的卡片参数。
具体的,对预设数据结构解析,从预设数据结构中获得每个卡片参数的层级关系,根据层级关系得到DOM树,遍历DOM树的节点,得到每个节点对应的卡片参数。
其中,DOM(Document Object Model,虚拟文档对象模型)树是网页页面中用来表示文档中对象的标准模型,将文档中的对象组织在一个树形结构中。
在本实施例中,DOM树是卡片参数的对象表示,卡片参数的数据结构与网页页面结构类似,可以通过解析预设数据结构生成的DOM树来获取卡片参数,可以提升解析效率。
步骤S204,根据卡片参数和视图配置文件生成用户界面卡片的卡片配置文件。
具体的,根据卡片参数得到卡片数据,根据卡片参数,创建视图配置文件与卡片数据的映射关系,基于映射关系,将卡片数据分发至用户界面卡片对应的视图配置文件,将卡片数据和对应的视图配置文件进行组装,生成卡片配置文件。
在一些可选的实现方式中,可以从解析出来的卡片参数中读取卡片业务接口,根据卡片业务接口获取业务数据,将卡片参数和业务数据作为卡片数据。
在本实施例中,从卡片参数可以获得卡片业务接口,向卡片业务接口发送访问请求,服务端根据访问请求获得访问请求对应的业务数据,将业务数据返回至卡片业务接口。这种方式,可以提升获取业务数据的效率,方便后续卡片视图的生成。
在本实施例中,解析出卡片参数后,根据卡片参数中的标识信息可以查询到用户终端本地与之对应视图配置文件,创建视图配置文件与卡片数据的映射关系。其中,映射关系可以通过预配置的CardConfigEngine组件进行保存。
根据映射关系在用户终端本地查询到对应的视图配置文件,将卡片数据通过CardConfigEngine组件分发至对应的用户界面卡片,由ViewConfig进行处理。
需要说明,CardConfigEngine组件的功能包括但不限于:保存本地卡片映射表(即映射关系);提供卡片组装功能;并解析配置的卡片业务接口;请求卡片业务数据成功后,将业务数据分发到具体的用户界面卡片等。在本实施例中,可以使用CardConfigEngine组件对卡片参数和对应的视图配置文件进行组装。
具体的,通过CardConfigEngine组件对卡片数据和视图配置文件进行组装,组装完成,生成卡片配置文件,相应生成一个RefreshTask事件,在触发该RefreshTask事件后,会刷新出对应的视图。
其中,卡片配置文件包括预构建的StackView卡片容器和StackViewConfig容器配置文件,功能如下:
StackView卡片容器作为卡片容器可以承载多个用户界面卡片的视图;
StackViewConfig容器配置文件用于统一计算各个卡片高度、分发子卡片视图交给StackView渲染,配置相关卡片配置信息。
本实施例通过创建卡片数据和视图配置文件的映射关系,可以快速开发新用户界面卡片,提高开发效率,将卡片数据和对应的视图配置文件进行组装以生成卡片配置文件,有利于快速生成新用户界面卡片的卡片视图样式。
步骤S205,在接收到视图更新请求时,根据卡片配置文件渲染出卡片视图。
以iOS系统为例,在实现列表视图时,都是通过iOS系统提供的原生控件UITableView或UICollectionView来实现的,在为UITableView或UICollectionView提供datasource(数据源)信息和delegate(代理)信息后可以实现相应的列表效果。具体的,用于显示列表内容的内容显示单元(cell)是由datasource来提供,并在相应的delegate中处理对应的cell的相应的逻辑,以实现列表视图更新。
通过预配置的CardTableViewEventHolder组件封装了系统tableView(表格视图)的delegate和datasource方法,可以提供视图刷新、删除、插入,更新视图高度、滚动到指定section(内容显示模块)等功能。
在本实施例中,在接收到视图更新请求时,获取视图更新请求对应的卡片配置文件,通过delegate和datasource方法,根据卡片配置文件在对应的用户界面卡片上进行渲染,得到卡片视图。
本申请通过配置的卡片参数和视图配置文件生成的卡片配置文件渲染出卡片视图,可以提高界面视图的开发效率,提升新用户界面卡片生成效率,同时可以保证充分测试,减少异常问题的出现,提升用户体验,增加用户黏性,此外,开发过程简单,可以降低维护成本。
在本实施例的一些可选的实现方式中,上述根据标识信息生成视图配置文件的步骤包括:
根据标识信息,构建用户界面卡片对应的待展示视图;
根据待展示视图生成待展示视图的视图逻辑,基于待展示视图和视图逻辑生成视图配置文件。
在本实施例中,用户界面卡片的标识信息可以为卡片ID,是用户界面卡片的唯一标识。根据用户界面卡片的标识信息构建卡片对应的待展示视图,使得UI卡片和待展示视图一一对应,通过用户界面卡片将视图进行展示。
每个待展示视图都有其对应的视图逻辑,通过视图逻辑可以实现视图展示。视图逻辑通过ViewConfig配置,ViewConfig遵循如下协议:
a.组装请求参数,拼接生成卡片请求的taskID;
b.处理上层传递过来的UI信息,埋点数据;
c.处理业务接口返回的数据;
d.处理用户界面卡片高度。
其中,请求参数包括但不限于pageID、channelID、pageCode等,pageID表示当前待展示视图的ID,用于标识待展示视图的唯一性,channelID表示当前登录用户渠道ID,pageCode表示当前展示视图编码,也是唯一的;UI信息包括但不限于是否需要圆角展示、显示标题的名称、是否需要更多按钮以及跳转URL等;埋点数据用于记录记录和追踪用户的操作记录,计算出当前应用功能日活、月活比例,以便针对用户习惯,为设计更好的产品提供有力数据支撑。
其中,请求参数按照post请求规则,组装好成为一个字典,交给网络框架AFNetworking处理拼接。
在一些可选的实现方式中,上述根据待展示视图生成待展示视图的视图逻辑的步骤包括:
将待展示视图拆分为各子视图,并生成各子视图相对应的视图类;
根据每个视图类生成与每个所述子视图对应的子视图控制器和子视图逻辑;
将各视图类和子视图逻辑分别封装在各子视图控制器中,得到视图逻辑。
视图主要用于处理数据的显示。在本实施例中,将待展示视图view拆分为多个子视图view1、view2、…、viewN,并生成每个子视图对应的视图类(即UIView类)。
针对每个待展示视图创建与之对应的视图子类viewClass1、ViewClass2、…、ViewClassN,应当理解,系统开发中,所有的视图都应该是UIView类或UIView的子类。
具体的,根据每个ViewClass,构建每个ViewClass对应的视图控制器,即UIViewController的子类ViewController1、ViewController2、…、ViewControllerN,并在这些子类中封装视图的处理逻辑,得到每个待展示视图的视图逻辑。这样,将每个子视图逻辑封装与对应的子视图控制器中,可以避免出现大量的碎片代码(碎片代码指逻辑不连贯的代码)。
在本实施例一些可选的实现方式中,上述根据卡片配置文件渲染出卡片视图的步骤包括:
通过数据源机制,从卡片配置文件中获取到卡片数据和视图逻辑;
通过代理机制,按照视图逻辑将卡片数据渲染至用户界面卡片,得到卡片视图。
在本实施例中,通过数据源机制(datasource机制)中的回调方法可以获取到待展示视图的配置信息,具体包括:
执行dataSouce回调方法,直接获取卡片的section数量;
执行dataSouce回调方法,获取每个section中cell数量;每个section中cell数量通过section协议中获取cell数量的方法获取;
执行dataSouce回调方法,获取UI卡片的每个cell的信息;每个cell的信息包括cell的获取方法和装配方法;cell的获取方法通过cell协议中设定的cell的重用标识符获取;cell的装配方法通过cell协议中设定的cell的装配方法获取。
获取到待展示视图的配置信息后,执行dataSouce回调方法从卡片配置文件中获取到卡片数据和视图逻辑。
在本实施例中,数据源机制获取视图更新所需要的数据,代理机制(delegate机制)则是将数据按照代理机制中配置的方法将卡片数据按照视图逻辑填写至对应的section和cell中,得到卡片视图。这种方式,可以提升视图界面的执行率,方便快捷。
在一些可选的实现方式中,通过配置的RefreshTaskManager组件优化了刷新机制,增加了容错时间,减少短时间内高强度刷新频率。
在一些可选的实现方式中,通过配置的EventDispatcher组件封装了事件分发功能,减少通知、block、代理等回调,并且统一了事件注册,方便后续人员理解和维护。
其中,事件分发功能用于统一了事件处理机制。通常View(视图)的点击事件需要一层层上传到Controller(控制器),需要经过多个回调或者发送一个通知事件,但是,这种方式的回调代码链路很长,或者通知响应事件不集中,不利于后续人员的维护。EventDispatcher组件在View上面触发点击事件后,框架会根据事件响应者链,找到View所属的控制器,由于控制器里面预先注册响应方法,这样,所有方法都规整到一个地方,方便维护。
本申请可用于众多通用或专用的计算机系统环境或配置中。例如:个人计算机、服务器计算机、手持设备或便携式设备、平板型设备、多处理器系统、基于微处理器的系统、置顶盒、可编程的消费电子设备、网络PC、小型计算机、大型计算机、包括以上任何系统或设备的分布式计算环境等等。本申请可以在由计算机执行的计算机可执行指令的一般上下文中描述,例如程序模块。一般地,程序模块包括执行特定任务或实现特定抽象数据类型的例程、程序、对象、组件、数据结构等等。也可以在分布式计算环境中实践本申请,在这些分布式计算环境中,由通过通信网络而被连接的远程处理设备来执行任务。在分布式计算环境中,程序模块可以位于包括存储设备在内的本地和远程计算机存储介质中。
本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程,是可以通过计算机可读指令来指令相关的硬件来完成,该计算机可读指令可存储于一计算机可读取存储介质中,该程序在执行时,可包括如上述各方法的实施例的流程。其中,前述的存储介质可为磁碟、光盘、只读存储记忆体(Read-Only Memory,ROM)等非易失性存储介质,或随机存储记忆体(Random Access Memory,RAM)等。
应该理解的是,虽然附图的流程图中的各个步骤按照箭头的指示依次显示,但是这些步骤并不是必然按照箭头指示的顺序依次执行。除非本文中有明确的说明,这些步骤的执行并没有严格的顺序限制,其可以以其他的顺序执行。而且,附图的流程图中的至少一部分步骤可以包括多个子步骤或者多个阶段,这些子步骤或者阶段并不必然是在同一时刻执行完成,而是可以在不同的时刻执行,其执行顺序也不必然是依次进行,而是可以与其他步骤或者其他步骤的子步骤或者阶段的至少一部分轮流或者交替地执行。
进一步参考图3,作为对上述图2所示方法的实现,本申请提供了一种卡片视图生成装置的一个实施例,该装置实施例与图2所示的方法实施例相对应,该装置具体可以应用于各种电子设备中。
如图3所示,本实施例所述的用户界面卡片视图生成装置300包括:获取模块301、配置模块302、解析模块303、生成模块304以及展示模块305。
其中:
获取模块301用于获取用户界面卡片的标识信息,根据所述标识信息生成视图配置文件;
配置模块302用于按照预设数据结构配置所述用户界面卡片的卡片参数;
解析模块303用于解析所述预设数据结构,获得所述预设数据结构中的卡片参数;
生成模块304用于根据所述卡片参数和所述视图配置文件生成所述用户界面卡片的卡片配置文件;
展示模块305用于在接收到视图更新请求时,根据所述卡片配置文件渲染出卡片视图。
需要强调的是,为进一步保证卡片参数的私密和安全性,上述卡片参数还可以存储于一区块链的节点中。
上述用户界面卡片视图生成装置,通过配置的卡片参数和视图配置文件生成的卡片配置文件渲染出卡片视图,可以提高用户界面卡片视图的开发效率,提升新用户界面卡片生成效率,同时可以保证充分测试,减少异常问题的出现,提升用户体验,增加用户黏性,此外,开发过程简单,可以降低维护成本。
在本实施例中,获取模块301包括构建子模块和生成子模块,构建子模块用于根据所述标识信息,构建所述用户界面卡片对应的待展示视图;生成子模块用于根据所述待展示视图生成所述待展示视图的视图逻辑,基于所述待展示视图和所述视图逻辑生成所述视图配置文件。
在本实施例中,生成子模块进一步用于将所述待展示视图拆分为各子视图,并生成各子视图相对应的视图类,根据每个所述视图类生成与每个所述子视图对应的子视图控制器和子视图逻辑,将所述各视图类和所述子视图逻辑分别封装在所述各子视图控制器中,得到所述视图逻辑。
本实施例可以避免出现大量的碎片代码。
在本实施例的一些可选的实现方式中,解析模块303进一步用于:
对所述预设数据结构解析,从所述预设数据结构中获得每个所述卡片参数的层级关系;
根据所述层级关系得到DOM树;
遍历所述DOM树的节点,得到每个所述节点对应的卡片参数。
本实施例通过解析预设数据结构生成的DOM树来获取卡片参数,可以提升解析效率。
在本实施例中,生成模块304包括获取子模块、创建子模块、分发子模块和组装子模块,其中:
获取子模块用于根据所述卡片参数得到卡片数据;
创建子模块用于根据所述卡片参数,创建所述视图配置文件与所述卡片数据的映射关系;
分发子模块用于基于所述映射关系,将所述卡片数据分发至所述用户界面卡片对应的视图配置文件;
组装子模块用于将所述卡片数据和对应的所述视图配置文件进行组装,生成所述卡片配置文件。
本实施例通过创建卡片数据和视图配置文件的映射关系,可以快速开发新卡片,提高开发效率,将卡片数据和对应的视图配置文件进行组装以生成卡片配置文件,有利于快速生成新卡片视图样式。
在本实施例中,获取子模块进一步用于从所述卡片参数中读取卡片业务接口,根据所述卡片业务接口获取业务数据,将所述卡片参数和所述业务数据作为卡片数据。
本实施例可以提升获取业务数据的效率,方便后续卡片视图的生成。
在本实施例的一些可选的实现方式中,展示模块305进一步用于:
通过数据源机制,从所述卡片配置文件中获取到所述卡片数据和所述视图逻辑;
通过代理机制,按照所述视图逻辑将所述卡片数据渲染至所述用户界面卡片,得到卡片视图。
本实施例通过数据源机制和代理机制进行渲染生成卡片视图,可以提升视图界面的执行率,方便快捷。
为解决上述技术问题,本申请实施例还提供计算机设备。具体请参阅图4,图4为本实施例计算机设备基本结构框图。
所述计算机设备4包括通过系统总线相互通信连接存储器41、处理器42、网络接口43。需要指出的是,图中仅示出了具有组件41-43的计算机设备4,但是应理解的是,并不要求实施所有示出的组件,可以替代的实施更多或者更少的组件。其中,本技术领域技术人员可以理解,这里的计算机设备是一种能够按照事先设定或存储的指令,自动进行数值计算和/或信息处理的设备,其硬件包括但不限于微处理器、专用集成电路(ApplicationSpecific Integrated Circuit,ASIC)、可编程门阵列(Field-Programmable GateArray,FPGA)、数字处理器(Digital Signal Processor,DSP)、嵌入式设备等。
所述计算机设备可以是桌上型计算机、笔记本、掌上电脑及云端服务器等计算设备。所述计算机设备可以与用户通过键盘、鼠标、遥控器、触摸板或声控设备等方式进行人机交互。
所述存储器41至少包括一种类型的可读存储介质,所述可读存储介质包括闪存、硬盘、多媒体卡、卡型存储器(例如,SD或DX存储器等)、随机访问存储器(RAM)、静态随机访问存储器(SRAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)、可编程只读存储器(PROM)、磁性存储器、磁盘、光盘等。在一些实施例中,所述存储器41可以是所述计算机设备4的内部存储单元,例如该计算机设备4的硬盘或内存。在另一些实施例中,所述存储器41也可以是所述计算机设备4的外部存储设备,例如该计算机设备4上配备的插接式硬盘,智能存储卡(Smart Media Card,SMC),安全数字(Secure Digital,SD)卡,闪存卡(FlashCard)等。当然,所述存储器41还可以既包括所述计算机设备4的内部存储单元也包括其外部存储设备。本实施例中,所述存储器41通常用于存储安装于所述计算机设备4的操作系统和各类应用软件,例如用户界面卡片视图生成方法的计算机可读指令等。此外,所述存储器41还可以用于暂时地存储已经输出或者将要输出的各类数据。
所述处理器42在一些实施例中可以是中央处理器(Central Processing Unit,CPU)、控制器、微控制器、微处理器、或其他数据处理芯片。该处理器42通常用于控制所述计算机设备4的总体操作。本实施例中,所述处理器42用于运行所述存储器41中存储的计算机可读指令或者处理数据,例如运行所述用户界面卡片视图生成方法的计算机可读指令。
所述网络接口43可包括无线网络接口或有线网络接口,该网络接口43通常用于在所述计算机设备4与其他电子设备之间建立通信连接。
本实施例通过处理器执行存储在存储器的计算机可读指令时实现如上述实施例用户界面卡片视图生成方法的步骤,通过配置的卡片参数和视图配置文件生成的卡片配置文件渲染出卡片视图,可以提高界面卡片视图的开发效率,保证充分测试,减少异常问题的出现,提升用户体验,增加用户黏性,同时,开发过程简单,可以降低维护成本。
本申请还提供了另一种实施方式,即提供一种计算机可读存储介质,所述计算机可读存储介质存储有计算机可读指令,所述计算机可读指令可被至少一个处理器执行,以使所述至少一个处理器执行如上述的用户界面卡片视图生成方法的步骤,通过配置的卡片参数和视图配置文件生成的卡片配置文件渲染出卡片视图,可以提高界面视图的开发效率,保证充分测试,减少异常问题的出现,提升用户体验,增加用户黏性,同时,开发过程简单,可以降低维护成本。
通过以上的实施方式的描述,本领域的技术人员可以清楚地了解到上述实施例方法可借助软件加必需的通用硬件平台的方式来实现,当然也可以通过硬件,但很多情况下前者是更佳的实施方式。基于这样的理解,本申请的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储介质(如ROM/RAM、磁碟、光盘)中,包括若干指令用以使得一台终端设备(可以是手机,计算机,服务器,空调器,或者网络设备等)执行本申请各个实施例所述的方法。
显然,以上所描述的实施例仅仅是本申请一部分实施例,而不是全部的实施例,附图中给出了本申请的较佳实施例,但并不限制本申请的专利范围。本申请可以以许多不同的形式来实现,相反地,提供这些实施例的目的是使对本申请的公开内容的理解更加透彻全面。尽管参照前述实施例对本申请进行了详细的说明,对于本领域的技术人员来而言,其依然可以对前述各具体实施方式所记载的技术方案进行修改,或者对其中部分技术特征进行等效替换。凡是利用本申请说明书及附图内容所做的等效结构,直接或间接运用在其他相关的技术领域,均同理在本申请专利保护范围之内。
Claims (10)
1.一种用户界面卡片视图生成方法,其特征在于,包括下述步骤:
获取用户界面卡片的标识信息,根据所述标识信息生成视图配置文件;
按照预设数据结构配置所述用户界面卡片的卡片参数;
解析所述预设数据结构,获得所述预设数据结构中的卡片参数;
根据所述卡片参数和所述视图配置文件生成所述用户界面卡片的卡片配置文件;
在接收到视图更新请求时,根据所述卡片配置文件渲染出卡片视图。
2.根据权利要求1所述的用户界面卡片视图生成方法,其特征在于,所述根据所述标识信息生成视图配置文件的步骤包括:
根据所述标识信息,构建所述用户界面卡片对应的待展示视图;
根据所述待展示视图生成所述待展示视图的视图逻辑,基于所述待展示视图和所述视图逻辑生成所述视图配置文件。
3.根据权利要求2所述的用户界面卡片视图生成方法,其特征在于,所述根据所述待展示视图生成所述待展示视图的视图逻辑的步骤包括:
将所述待展示视图拆分为各子视图,并生成各子视图相对应的视图类;
根据每个所述视图类生成与每个所述子视图对应的子视图控制器和子视图逻辑;
将所述各视图类和所述子视图逻辑分别封装在所述各子视图控制器中,得到所述视图逻辑。
4.根据权利要求1所述的用户界面卡片视图生成方法,其特征在于,所述解析所述预设数据结构,获得所述预设数据结构中的卡片参数的步骤包括:
对所述预设数据结构解析,从所述预设数据结构中获得每个所述卡片参数的层级关系;
根据所述层级关系得到DOM树;
遍历所述DOM树的节点,得到每个所述节点对应的卡片参数。
5.根据权利要求1所述的用户界面卡片视图生成方法,其特征在于,所述根据所述卡片参数和所述视图配置文件生成所述用户界面卡片的卡片配置文件的步骤包括:
根据所述卡片参数得到卡片数据;
根据所述卡片参数,创建所述视图配置文件与所述卡片数据的映射关系;
基于所述映射关系,将所述卡片数据分发至所述用户界面卡片对应的视图配置文件;
将所述卡片数据和对应的所述视图配置文件进行组装,生成所述卡片配置文件。
6.根据权利要求5所述的用户界面卡片视图生成方法,其特征在于,所述根据所述卡片参数得到卡片数据的步骤包括:
从所述卡片参数中读取卡片业务接口;
根据所述卡片业务接口获取业务数据,将所述卡片参数和所述业务数据作为卡片数据。
7.根据权利要求1所述的用户界面卡片视图生成方法,其特征在于,所述根据所述卡片配置文件渲染出卡片视图的步骤包括:
通过数据源机制,从所述卡片配置文件中获取到所述卡片数据和所述视图逻辑;
通过代理机制,按照所述视图逻辑将所述卡片数据渲染至所述用户界面卡片,得到卡片视图。
8.一种用户界面卡片视图生成装置,其特征在于,包括:
获取模块,用于获取用户界面卡片的标识信息,根据所述标识信息生成视图配置文件;
配置模块,用于按照预设数据结构配置所述用户界面卡片的卡片参数;
解析模块,用于解析所述预设数据结构,获得所述预设数据结构中的卡片参数;
生成模块,用于根据所述卡片参数和所述视图配置文件生成所述用户界面卡片的卡片配置文件;
展示模块,用于在接收到视图更新请求时,根据所述卡片配置文件渲染出卡片视图。
9.一种计算机设备,包括存储器和处理器,所述存储器中存储有计算机可读指令,所述处理器执行所述计算机可读指令时实现如权利要求1至7中任一项所述的用户界面卡片视图生成方法的步骤。
10.一种计算机可读存储介质,其特征在于,所述计算机可读存储介质上存储有计算机可读指令,所述计算机可读指令被处理器执行时实现如权利要求1至7中任一项所述的用户界面卡片视图生成方法的步骤。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202111432672.6A CN114090066A (zh) | 2021-11-29 | 2021-11-29 | 用户界面卡片视图生成方法、装置、计算机设备及介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202111432672.6A CN114090066A (zh) | 2021-11-29 | 2021-11-29 | 用户界面卡片视图生成方法、装置、计算机设备及介质 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN114090066A true CN114090066A (zh) | 2022-02-25 |
Family
ID=80305560
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202111432672.6A Pending CN114090066A (zh) | 2021-11-29 | 2021-11-29 | 用户界面卡片视图生成方法、装置、计算机设备及介质 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN114090066A (zh) |
Cited By (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN116166242A (zh) * | 2023-03-22 | 2023-05-26 | 广州嘉为科技有限公司 | 一种基于画布的度量卡片实现方法、装置及存储介质 |
-
2021
- 2021-11-29 CN CN202111432672.6A patent/CN114090066A/zh active Pending
Cited By (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN116166242A (zh) * | 2023-03-22 | 2023-05-26 | 广州嘉为科技有限公司 | 一种基于画布的度量卡片实现方法、装置及存储介质 |
CN116166242B (zh) * | 2023-03-22 | 2023-08-01 | 广州嘉为科技有限公司 | 一种基于画布的度量卡片实现方法、装置及存储介质 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
US11132114B2 (en) | Method and apparatus for generating customized visualization component | |
CN111666490A (zh) | 基于kafka的信息推送方法、装置、设备及存储介质 | |
CN111414407A (zh) | 数据库的数据查询方法、装置、计算机设备及存储介质 | |
CN113435846A (zh) | 业务流程编排方法、装置、计算机设备及存储介质 | |
CN110764798A (zh) | 一种微码升级方法、装置、计算机设备及存储介质 | |
CN113536185B (zh) | 应用页面的加载方法、存储介质、及其相关设备 | |
CN112416458A (zh) | 基于ReactNative的预加载方法、装置、计算机设备及存储介质 | |
CN112394908A (zh) | 埋点页面自动生成的方法、装置、计算机设备及存储介质 | |
CN110795181A (zh) | 基于跳转协议的应用程序界面展示方法、装置及电子设备 | |
CN110795649A (zh) | 目标页面展示方法、装置、系统及电子设备 | |
CN112631924A (zh) | 自动化测试方法、装置、计算机设备及存储介质 | |
CN112650905A (zh) | 基于标签的反爬虫方法、装置、计算机设备及存储介质 | |
CN114090066A (zh) | 用户界面卡片视图生成方法、装置、计算机设备及介质 | |
CN110765610B (zh) | Pdm集成方法、装置、计算机设备及存储介质 | |
CN112685115A (zh) | 国际提示语生成方法、系统、计算机设备及存储介质 | |
CN115712422A (zh) | 表单页面的生成方法、装置、计算机设备及存储介质 | |
CN115033634A (zh) | 数据采集方法、装置、电子设备和介质 | |
CN115203304A (zh) | 一种基于定时轮询的批量数据导入方法及相关设备 | |
CN115203672A (zh) | 信息访问的管控方法、装置、计算机设备及介质 | |
CN103970513A (zh) | 一种源数据信息的访问方法和平台 | |
CN112650491A (zh) | 基于ReactNative的日期选择模态组件开发方法及相关设备 | |
CN116108814B (zh) | 甘特图处理方法、装置、计算机设备及存储介质 | |
CN114238466A (zh) | 一种消息推送方法、装置、计算机设备及存储介质 | |
CN113449035B (zh) | 数据同步方法、装置、计算机设备及可读存储介质 | |
CN115795209A (zh) | 基于浏览器插件的Eval函数执行方法、装置、设备及介质 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination |