CN114722112A - 一种可视化列表数据展示方法及其装置 - Google Patents
一种可视化列表数据展示方法及其装置 Download PDFInfo
- Publication number
- CN114722112A CN114722112A CN202210269194.XA CN202210269194A CN114722112A CN 114722112 A CN114722112 A CN 114722112A CN 202210269194 A CN202210269194 A CN 202210269194A CN 114722112 A CN114722112 A CN 114722112A
- Authority
- CN
- China
- Prior art keywords
- configuration file
- data
- list
- binary tree
- array
- 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
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/20—Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
- G06F16/26—Visual data mining; Browsing structured data
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/20—Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
- G06F16/22—Indexing; Data structures therefor; Storage structures
- G06F16/2282—Tablespace storage structures; Management thereof
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/20—Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
- G06F16/24—Querying
- G06F16/245—Query processing
- G06F16/2453—Query optimisation
Abstract
本发明涉及计算机前端显示领域,具体涉及一种可视化列表数据展示方法及其装置;获取待显示界面的原始配置文件,原始配置文件包括JSON结构数据列表;将原始配置文件的代码格式转换为统一指定格式,得到中间配置文件,中间配置文件为二叉树结构数据列表;解析中间配置文件的数据结构与语法结构,数据结构用于反映中间配置文件中各对象之间的数理关系,语法结构用于反映中间配置文件中各对象之间的逻辑关系;基于数据结构与所述语法结构,生成转换后配置文件,转换后的配置文件包括UI列表;根据转换后配置文件对待显示界面进行渲染显示;本发明提供的方案通过JSON‑二叉树‑UI的转换,建立起JSON数据与组织架构之间的关系,更易于实现,查找速度更快。
Description
技术领域
本发明涉及计算机前端显示领域,具体涉及一种可视化列表数据展示方法及其装置。
背景技术
移动APP中有很多人员组织架构等类型,通过JSON类型,在开启闭合时,不便于文件结构的渲染,且在切换文件夹闭合的开启过程中不便于文件列表UI渲染。
发明内容
本申请实施例提供一种可视化列表数据展示方法,针对iOS环境下移动应用程序UI界面的渲染,建立JSON数据与组织架构之间的关系,解决现有界面设计方法下信息寻找速度低的问题。为了达到上述目的,本申请实施例采用的技术方案如下:
第一方面,本实施例提供一种可视化列表数据展示方法,包括:
获取待显示界面的原始配置文件,所述原始配置文件包括JSON结构数据列表;
将所述原始配置文件的代码格式转换为统一指定格式,得到中间配置文件,所述中间配置文件为二叉树结构数据列表;
解析所述中间配置文件的数据结构与语法结构,所述数据结构用于反映所述中间配置文件中各对象之间的数理关系,所述语法结构用于反映所述中间配置文件中各对象之间的逻辑关系;
基于所述数据结构与所述语法结构,生成转换后配置文件,所述转换后的配置文件包括UI列表;
根据所述转换后配置文件对所述待显示界面进行渲染显示。
进一步的,所述初始JSON结构数据列表包含唯一ID、父ID、同层排序和待展示信息。
进一步的,对将所述原始配置文件的代码格式转换为统一指定格式,得到中间配置文件,包括对所述初始JSON结构数据列表进行按照父ID进行归类、排序和存储处理,所述归类、排序后的JSON数据存储至虚拟存储空间内,将列表中的json数据处理为键/值形式的数据。
进一步的,对将所述原始配置文件的代码格式转换为统一指定格式,得到中间配置文件,还包括对同类型的JSON数据进行初始化,得到第一虚拟存储空间和第二虚拟存储空间:并对所述虚拟存储空间进行遍历处理,基于排序好的要素按照二叉树结构将数据分配至所述第一虚拟存储空间和第二虚拟存储空间内,所述第一虚拟存储空间与所述第二虚拟存储空间对应排布。
进一步的,对所述初始JSON数据列表进行处理,还包括基于所述第一虚拟存储空间和第二虚拟存储空间,生成二叉树的对应根节点,所述根节点的value的ID为设定默认值。
进一步的,所述二叉树数据结构的获得包括对所述二叉树的根节点进行递归处理,得到二叉树数据结构。
进一步的,所述中间配置文件的数据结构包括所述二叉树数据结构中的树节点保存的数据信息的展开标志,所述中间配置文件的语法结构包括所述二叉树数据结构中的树节点的左右子树的性质;所述展开标志包括1和0,当展开标志为1时,获取该树节点的左子树数据并将数据转为列表数据。
进一步的,基于所述数据结构与所述语法结构,生成转换后配置文件,包括根据所述二叉树数据结构中的树节点保存的数据信息的展开标志,以及树节点的左右子树的性质生成对应的UI列表的多个数组。
进一步的,根据所述转换后配置文件对所述待显示界面进行渲染显示包括:
对所述UI列表的数组添加点击事件,所述数组包括索引;
根据所述数组的索引,对所述数组的进行查找,确定所述数组中的ID列表;
根据所述ID列表对二叉树中的指定节点进行展开标志的切换;
根据展开标志的切换,获取二叉树中的数组;
根据所述数组对所述UI列表进行二次渲染;
循环执行以上过程,直至渲染结束。
第二方面,本申请实施例提供了一种可视化列表数据站是装置,包括:
配置文件获取模块,用于获取待显示界面的原始配置文件,所述原始配置文件包括JSON结构数据列表;
格式转换模块,用于将所述原始配置文件的格式转换为统一指定格式,得到中间配置文件,所述中间配置文件为二叉树结构数据列表;
配置文件解析模块,用于解析所述中间配置文件的数据结构与语法结构,所述数据结构用于反映所述中间配置文件中各对象之间的数理关系,所述语法结构用于反映所述中间配置文件中各对象之间的逻辑关系;
配置文件转换模块,用于基于所述数据结构与所述语法结构,生成转换后配置文件,所述转换后的配置文件包括UI列表;
界面渲染显示模块,用于根据所述转换后配置文件对所述待显示界面进行渲染显示,所述界面为UI列表界面。
根据本申请实施例的一个方面,提供了一种计算机设备,所述计算机设备包括处理器和存储器,所述存储器中存储有至少一条指令、至少一段程序、代码集或指令集,所述至少一条指令、所述至少一段程序、所述代码集或指令集由所述处理器加载并执行以实现上述界面显示方法。
根据本申请实施例的一个方面,提供了一种计算机可读存储介质,所述存储介质中存储有至少一条指令、至少一段程序、代码集或指令集,所述至少一条指令、所述至少一段程序、所述代码集或指令集由处理器加载并执行以实现上述界面显示方法。
根据本申请实施例的一个方面,提供了一种计算机程序产品或计算机程序,该计算机程序产品或计算机程序包括计算机指令,该计算机指令存储在计算机可读存储介质中。计算机设备的处理器从计算机可读存储介质读取该计算机指令,处理器执行该计算机指令,使得该计算机设备执行上述界面显示方法。
本申请实施例提供的一种可视化列表数据展示方法,通过将带显示的JSON结构文件中的数据进行转换处理,得到了二叉树数据结构的文件,基于二叉树数据结构文件的数据关系和语法关系生成转换后的UI结构数据,进而对转换后的UI结构数据进行渲染,得到渲染后的界面,通过JSON-二叉树-UI的转换,建立起JSON数据与组织架构之间的关系,更易于实现,查找速度更快。
附图说明
为了更清楚地说明本申请实施例中的技术方案,下面将对实施例描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本申请的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
附图中的方法、系统和/或程序将根据示例性实施例进一步描述。这些示例性实施例将参照图纸进行详细描述。这些示例性实施例是非限制的示例性实施例,其中示例数字在附图的各个视图中代表相似的机构。
图1是根据本申请的一个是实施例提供的可视化列表数据展示系统的框图;
图2是根据本申请的一个实施例提供的可视化列表数据展示方法的流程图;
图3是根据本申请的一个实施例提供的初始配置文件的层级结构示意图;
图4是根据本申请的一个实施例提供的中间配置文件的层级结构示意图;
图5是根据本申请的一个实施例提供的转换后配置文件的层级结构示意图;
图6是根据本申请的一个实施例提供的装置的框图;
图7是根据本申请的一个实施例提供的格式转换模块结构框图;
图8是根据本申请的一个实施例提供的配置文件转换模块结构框图;
图9是根据本申请的一个实施例提供的循环模块结构框图;
图10是根据本申请的一个实施例提供的计算机设备的结构框图。
具体实施方式
为了更好的理解上述技术方案,下面通过附图以及具体实施例对本申请技术方案做详细的说明,应当理解本申请实施例以及实施例中的具体特征是对本申请技术方案的详细的说明,而不是对本申请技术方案的限定,在不冲突的情况下,本申请实施例以及实施例中的技术特征可以相互组合。
在下面的详细描述中,通过实例阐述了许多具体细节,以便提供对相关指导的全面了解。然而,对于本领域的技术人员来说,显然可以在没有这些细节的情况下实施本申请。在其他情况下,公知的方法、程序、系统、组成和/或电路已经在一个相对较高水平上被描述,没有细节,以避免不必要的模糊本申请的方面。
本申请中使用流程图说明根据本申请的实施例的系统所执行的执行过程。应当明确理解的是,流程图的执行过程可以不按顺序执行。相反,这些执行过程可以以相反的顺序或同时执行。另外,可以将至少一个其他执行过程添加到流程图。一个或多个执行过程可以从流程图中删除。
首先,对本申请中部分用于进行解释说明,以便于本领域技术人员理解。
Swift是一种基于运行于macOS和iOS平台,用于搭建基于苹果平台的应用程序。它采用了Objective-C的命名参数以及动态对象模型,可以无缝对接到现有的Cocoa框架,并且可以兼容Objective-C代码。
JSON(JavaScript Object Notation,JS对象简谱)是一种轻量级的数据交换格式。它基于ECMAScript(欧洲计算机协会制定的js规范)的一个子集,采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得JSON成为理想的数据交换语言。易于人阅读和编写,同时也易于机器解析和生成,并有效地提升网络传输效率。JSON是一个标记符的序列。这套标记符包含六个构造字符、字符串、数字和三个字面名。JSON是一个序列化的对象或数组。JSON是对象的字符串表示法,它使用文本表示一个对象的信息,本质是一个字符串。要实现从JSON字符串转换为对象,使用JSON.parse()方法,要实现从对象转换为JSON字符串,使用JSON.stringify()方法,任何支持的类型都可以通过JSON来表示,例如字符串、数字、对象、数组等。但是对象和数组是比较特殊且常用的两种类型。
对象:对象在Swift中是使用花括号包裹{}起来的内容,数据结构为{key1:value1,key2:value2,...}的键值对结构。在面向对象的语言中,key为对象的属性,value为对应的值。键名可以使用整数和字符串来表示。值的类型可以是任意类型。
数组:数组在JS中是方括号[]包裹起来的内容,数据结构为["java","javascript","vb",...]的索引结构。数组是一种比较特殊的数据类型,它也可以像对象那样使用键值对,但还是索引使用得多。同样,值的类型可以是任意类型。
二叉树:是树形结构的一个重要类型,数理意义上二叉树是n个有限元素的集合,该集合或者为空、或者由一个称为根(root)的元素及两个不相交的、被分别称为左子树和右子树的二叉树组成,是有序树。
叶子节点:简称叶子,是树形结构中没有子节点的节点,即节点的度为0,又称为终端节点。
请参考图1,其示出了本申请一个实施例提供的界面显示系统的框图。该界面显示系统包括至少一个计算机设备,如终端110、网络120和服务器130。
终端110可以是手机、平板电脑、媒体播放移动终端、可穿戴设备、台式电脑、笔记本电脑等设备。终端120是存在界面显示需求的终端。
在本实施例中,终端110优选手机,即本实施例提供的可视化列表数据站是方法优先在手机为终端110上进行配置。
服务器130是用于提供待显示界面的配置文件的后台服务器。服务器130可以是独立的物理服务器,也可以是多个物理服务器构成的服务器集群或者分布式系统,还可以是提供云服务、云数据库、云计算、云函数、云存储、网络服务、云通信、中间件服务、域名服务、安全服务、CDN(Content Delivery Network,内容分发网络)、以及大数据和人工智能平台等基础云计算服务的云服务器(云计算服务中心)。终端110可以通过网络120与服务器130相连。网络120可以是有线网络或无线网络。服务器130用于为终端110提供后台服务,例如,服务器130可以将待显示界面的配置文件传输给终端110,由终端110完成界面显示。
可选地,服务器130同时为多个终端110提供后台服务。终端110以及服务器130可以通过有线或无线通信方式进行直接或间接地连接,本申请在此不做限制。
参阅图2,其示出了本申请一个实施例提供的方法的流程图。该方法的执行主体可以是图1中的终端110,该方法可以包括以下几个步骤:
步骤210,获取待显示界面的原始配置文件。
原始配置文件存储有描述待显示界面的显示内容所编写的代码。可选地,原始配置文件包括多种开发框架类型下的配置文件。可选地,原始配置文件的代码是前端开发人员在其选择的前端框架下编写的代码,可通过浏览器加载在网页中显示待显示界面,但也可以通过其他转换方法在移动端界面中显示。
在本实施例中,原始配置文件为JSON结构数据列表。
参阅图3,为JSON结构数据列表的文件层级结构,在JSON结构数据列表包含唯一ID、父ID、同层排序和待展示信息。
本实施例中的待展示信息为基本展示数据,根据具体的使用场景根据具体的展示目的进行信息的确定。
步骤220,将原始配置文件的格式转换为统一指定格式,得到中间配置文件。
在本实施例中,对于文件格式的转换为中间配置文件,主要是将原始JSON结构数据列表转换为树状结构列表,实现对于数据的直观分层和分级。优选的,在本实施例中,树状结构列表为二叉树结构数据列表,即步骤220是将原始JSON结构数据列表转换为二叉树结构数据列表。
在示例性实施例中,上述步骤220包括如下子步骤:
步骤221,获取JSON结构数据列表的文件结构。
文件结构包括JSON结构数据列表中的唯一ID、父ID、同层排序和待展示信息。
步骤222,对JSON结构数据列表进行按照父ID进行归类、排序和存储处理。
在本实施例中,针对于JSON结构数据列表进行存储具体位置在归类、排序处理后的JSON数据存储至虚拟存储空间内,并将列表中的JSON数据处理为键/值形式的数据。
在本实施例中,进行排序前首先基于中间配置文件的结构进行初始中间配置文件的构建,具体为根据JSON结构数据列表的结构进行对应中间配置文件的构建,在本实施例中,中间配置文件为二叉树结构数据列表。
并对JSON结构数据列表进行初始化处理,将JSON结构数据列表转换为虚拟存储空间,虚拟存储空间内存储有JSON对象。在本实施例中,JSON对象为键值对数据结构,其形式为<key:id,value:[JSON]列表>。
对初始JSON列表进行遍历处理,将同一父ID的JSON对象按照rank函数进行排序,组成第二JSON列表,并以父ID为key存入至虚拟存储空间内。
对虚拟存储空间进行初始化处理,得到第一虚拟存储空间和第二虚拟存储空间,其中第一虚拟空间与第二虚拟空间对应排布。按照数据排布结构,在本实施例中,第一虚拟存储空间定义为leftMap,第二虚拟空间定义为rightMap。
对虚拟存储空间进行遍历处理,具体为取value:[JSON]对[JSON]进行遍历处理,将第一元素JSON以父ID为key存入至leftMap,将后续的元素以前一个元素的ID为key存入至rightMap中。
步骤223,生成中间配置文件的关键节点数据。
具体为基于第一虚拟存储空间和第二虚拟存储空间生成中间配置文件的关键节点数据。
参阅图4,公开了一种二叉树层结构示意图。
在本实施例中,中间配置文件为二叉树结构数据列表,第一虚拟存储空间和第二虚拟存储空间分别为leftMap和rightMap。则基于leftMap和rightMap生成二叉树的关键节点数据。
在本实施例中,二叉树的关键节点为根节点,则基于leftMap和rightMap生成二叉树的根节点。本实施例中,根节点的对象中value的ID为设定默认值。
步骤224,根据根节点,生成二叉树。
具体为通过递归处理手段,基于根节点,生成二叉树。
步骤230,解析中间配置文件的数据结构与语法结构。
在本实施例中,中间配置文件为二叉树,二叉树数据结构用于反映二叉树中个对象之间的数理关系,二叉树语法结构用于反映二叉树中各对象之间的逻辑关系。
在本实施例中,数据结构包括二叉树中的树节点保存的数据信息的展开标志,具体为根据二叉树的深度,进行判断;当树的深度小于等于1时,根节点展开状态为1,当树的深度大于1时,根节点的展开状态为0.
语法结构包括二叉树中的树节点的左右子树的性质。
步骤240,基于数据结构与语法结构,生成转换后配置文件。
在本实施例中,转换后配置文件为UI列表。
参阅图5,为基于二叉树数据结构转换成的UI列表数据结构示意图。
在示例性实施例中,上述步骤240包括如下子步骤:
步骤241,生成初始UI列表。
针对二叉树数据进行递归先序遍历处理,根据处理过程实时生成初始UI列表数据。
在本实施例中,初始UI列表数据为多个数组组成的列表,每个数组包含树节点保存的数据信息以及列表展示的基本信息,基本信息可以为空集。
步骤242,对初始UI列表中的树节点进行遍历处理,并获取遍历后树节点的左右孩子块返回的状态,根据返回状态组成新的信息返回。
在本实施例中,返回状态包括以下三种:
1.空数据;
2.数据不为空,该树节点为根的树只有基本信息,该树节点不满足构成数组的数据;
3.数据不为空,该树节点生成一系列的数组及附带非该数组中的额外的基本数据。
步骤243,根据返回状态、展开状态、左右子树的性质生成对应的UI列表的多个数组。
根据返回状态包括以下几种情况:
a.如果返回状态为空数据,则返回空数组;
b.节点为叶子节点,返回列表基本数据,在本实施例中,列表基本数据为该叶子节点的保存的数据信息,本实施例中的叶子节点保存的数据信息供递归处理时上层节点使用;
c.节点无左子树,且右子树每一个节点都无左孩子,将该节点的列表基本数据插入到右孩子返回的叶子节点保存的数据信息中的第一位并返回;
d.节点无右子树,且左子树是只有右孩子的二叉树。根据该节点的展开标志,如果展开标志为1,即展开标志为真,则返回以该节点保存的数据及左子树列表基本数据组成的列表,如果展开标志为0,即展开标志为假,则只返回左子树的列表基本数据。
e.节点的左右子树只有右孩子的二叉树,则只提供列表基本数据,如果展开标志为1,即展开标志为真,返回一个数组的列表,该数组中的列表数据为左右两个孩子的列表展示基本数据的和;当展开标志为0,即展开标志为假,只返回一个数组,但该数组中的列表展示的基本数据只包含右子树返回的列表展示基本数据,左子树的返回的列表展示基本数据为隐藏状态不返回。
f.节点无左子树,右子树返回数组即额外的列表展示基本数据,如果展开状态为1,即展开状态为真,以该节点的保存的数据信息及额外的列表展示基本数据生成新的数组,并将新的数组插入到数组中的第一位并返回;如果展开状态为0,即展开状态为假,则使用该节点的保存的数据信息生成新的数组,并返回只有该新的数组的一个元素的数组。
g.左子树返回数组及额外的左列表展示的数据,右子树只返回右侧列表展示的数据,如果展开状态为1,即展开状态为真,将右子树返回的右侧列表展示的数据插入到左子树数组中最后一个数组的列表展示数据中,使用该节点保存的数据与左子树返回的左侧列表展示数据生成新的数组,并将该数组插入到左子树返回的数组中,插入到列表最前面,返回数组;如果展开状态为0,即展开状态为假,由该节点保存的数据与右侧列表展示的基本数据生成新的数组,返回只有该数组组成的数组。
h.左子树只返回左侧列表展示数据,右子树返回数组及额外的右侧列表展示数据,如果展开状态为1,即展开状态为真,由该节点保存的数据与左侧列表展示基本数据和右侧列表展示基本数据进行组合,形成新的数组,并将新的数组插入到数组中的首位,并返回数组;如果展开状态为0,即转开状态为假,则由该节点保存的数据与右侧列表生成新的数组,将该数组插入到数组的首位,并返回数组。
i.左子树返回左侧数组及额外的左侧列表,右子树返回右侧数组及额外的右侧列表,如果展开状态为1即展开状态为真,将右子树返回的右侧列表插入到左子树数组中最后一个数组的列表展示数据中,由该节点保存的数据及左侧数列生成新的数组,将数组插入到左侧数组的首位,返回由左数组、右数组组成的新的数组;如果展开状态为0即展开状态为假,由该节点保存的数据与右侧数列生成新的数组,并将该数组插入带右数组的首位,并返回右数组。
步骤244,根据步骤243的多种情况递归计算出根节点返回的数据。
此步骤包含多种情况,具体为:
(1)根节点返回的数据为空,则UI列表数据为空;
(2)根节点值返回了列表展示数据,个数为count,则生成每一个列表展示数据对应的数组,即最终UI上展示的是count个数组;
(3)如果根节点返回了数组与列表展示的数据,则根据列表展示数据生成对应的新数组,并将新的数组全部插入到数组的首部并组成最终的数组。
步骤250,根据转换后配置文件对待显示界面进行渲染显示。
在本实施例中,基于转换后配置文件即UI数据列表,以及新的信息返回对待显示界面即UI列表进行渲染。
具体包括根据步骤240返回的数组填充至列表展示的UI列表,根据数组对UI列表进行渲染。
步骤260,点击事件添加,对UI列表重新渲染。
包括以下子步骤:
261.在每个UI列表的数组上添加点击事件,根据点击的数组的索引,在数组中查找到之前的数组的ID列表,根据该ID列表对二叉树中的某个指定节点执行切换展开状态的操作。
在本实施例中,点击事件可以是光标的点击、选中、悬浮等操作。
262.展开状态切换后,再次读取二叉树中的数组数据,对UI列表展示方式进行重新渲染,即针对二叉树转换为UI列表渲染进行循环。
在本实施例中,循环的次数基于业务场景复杂度。
业务场景复杂度是根据业务需求确定。业务模块的业务场景复杂度越复杂,对应的json数据越复杂,判断键所对应的值得类型是否是复杂数据类型,然后通过递归方式处理值的数据直到所有值都是简单数据类型的键/值,将复杂的数据结构进行简化,使得最终的json数据简单化。
假设一个结构复杂的多维json,不确定它的下标索引,不确定它的嵌套多少层,只能通过某一属性的属性值来确定它是要完成业务所需的数据。例如:一个表单模块每个大的筛选条件还有子筛选条件,子筛选条件还有分类筛选,分类筛选是多选。
请参考图6,其示出了本申请一个实施例提供的装置的框图。该装置具有实现上述方法的功能。该可视化列表数据展示装置600包括:配置文件获取模块610、格式转换模块620、配置文件解析模块630、配置文件转换模块640和界面渲染显示模块650。
配置文件获取模块610,用于获取待显示界面的原始配置文件。
格式转换模块620,用于将所述原始配置文件的格式转换为统一指定格式,得到中间配置文件。
配置文件解析模块630,用于解析中间配置文件的数据结构与语法结构,数据结构用于反映中间配置文件中各对象之间的数理关系,语法结构用于反映中间配置文件中各对象之间的逻辑关系。
配置文件转换模块640,用于基于数据结构与语法结构,生成转换后配置文件。
界面渲染显示模块650,用于根据转换后配置文件对待显示界面进行渲染显示。
循环模块670,用于添加点击事件,并对UI列表重新渲染。
在示例性实施例中,如图7所示,格式转换模块620,包括:原始文件结构获取单元621、原始文件结构处理单元622、关键节点数据获取单元623、二叉树结构生成单元624。
在本实施例中,原始文件结构获取单元621,用于获取JSON结构数据列表中的文件结构。
原始文件结构处理单元622,用于对JSON结构数据列表进行按照父ID进行归类、培训和存储处理。
关键节点数据获取单元623,用于生成中间配置文件的关键节点数据。
二叉树结构生成单元624,用于根据根节点生成二叉树。
在示例性实施例中,如图8所示,配置文件转换模块640,包括:初始UI列表生成单元641、初始UI列表处理单元642、UI列表数组生成单元643、返回数据确定单元644。
在本实施例中,初始UI列表生成单元642用于生成初始UI列表。
初始UI列表处理单元642,用于对出书UI列表中的树节点进行遍历处理,并获取遍历后树节点的左右孩子块返回的状态,根据返回状态组成新的信息返回。
UI列表数组生成单元643,用于根据犯规状态、展开状态、左右子树的性质生成对应的UI列表的多个数组。
返回数据确定单元644,用于根据多种情况下的UI列表多个数组递归计算出根节点返回数据。
在示例性实施例中,如图9所示,循环模块670包括:点击事件添加单元671和循环渲染单元672。
在本实施例中,点击事件添加单元671用于在每个UI列表的数组上添加点击事件,根据点击的数组的索引,在数组中查找到之前的数组的ID列表,根据该ID列表对二叉树中的某个指定节点执行切换展开状态的操作。
循环渲染单元672,用于再次读取二叉树中的数组数据,对UI列表展示方式进行重新渲染。
请参考图10,其示出了本申请一个实施例提供的计算机设备的结构框图。该计算机设备可以是诸如多媒体播放设备、手机、平板电脑、游戏主机等电子设备。该计算机设备用于实施上述实施例中提供的界面显示方法。具体来讲:
通常,计算机设备包括有:处理器和存储器。
处理器可以包括一个或多个处理核心,比如4核心处理器、8核心处理器等。处理器可以采用DSP(Digital Signal Processing,数字信号处理)、FPGA(FieldProgrammableGate Array,现场可编程门阵列)、PLA(Programmable Logic Array,可编程逻辑阵列)中的至少一种硬件形式来实现。处理器也可以包括主处理器和协处理器,主处理器是用于对在唤醒状态下的数据进行处理的处理器,也称CPU(Central ProcessingUnit,中央处理器);协处理器是用于对在待机状态下的数据进行处理的低功耗处理器。在一些实施例中,处理器可以在集成有GPU(Graphics Processing Unit,图像处理器),GPU用于负责显示屏所需要显示的内容的渲染和绘制。一些实施例中,处理器还可以包括AI(ArtificialIntelligence,人工智能)处理器,该AI处理器用于处理有关机器学习的计算操作。
存储器可以包括一个或多个计算机可读存储介质,该计算机可读存储介质可以是非暂态的。存储器还可包括高速随机存取存储器,以及非易失性存储器,比如一个或多个磁盘存储设备、闪存存储设备。在一些实施例中,存储器中的非暂态的计算机可读存储介质用于存储至少一个指令,至少一段程序、代码集或指令集,所述至少一条指令、至少一段程序、代码集或指令集,且经配置以由一个或者一个以上处理器执行,以实现上述方法。
在一些实施例中,计算机设备还可选包括有:外围设备接口和至少一个外围设备。处理器、存储器和外围设备接口之间可以通过总线或信号线相连。各个外围设备可以通过总线、信号线或电路板与外围设备接口相连。具体地,外围设备包括:射频电路、显示屏、摄像头组件、音频电路、定位组件和电源中的至少一种。
本领域技术人员可以理解,图10中示出的结构并不构成对计算机设备的限定,可以包括比图示更多或更少的组件,或者组合某些组件,或者采用不同的组件布置。
在示例性实施例中,还提供了一种计算机可读存储介质,所述存储介质中存储有至少一条指令、至少一段程序、代码集或指令集,所述至少一条指令、所述至少一段程序、所述代码集或所述指令集在被处理器执行时以实现上述可视化列表数据展示方法。
可选地,该计算机可读存储介质可以包括:ROM(Read Only Memory,只读存储器)、RAM(Random Access Memory,随机存取记忆体)、SSD(Solid State Drives,固态硬盘)或光盘等。其中,随机存取记忆体可以包括ReRAM(Resistance Random Access Memory,电阻式随机存取记忆体)和DRAM(Dynamic Random Access Memory,动态随机存取存储器)。
本申请实施例公开的上述内容对于本领域技术人员而言是清楚完整的。应当理解,本领域技术人员基于上述公开的内容对未作解释的技术术语进行推导和分析的过程是基于本申请所记载的内容进行的,因此上述内容并不是对整体方案的创造性的评判。
上文已对基本概念做了描述,显然,对于本领域技术人员来说,上述详细披露仅作为示例,而并不构成对本申请的限定。虽然此处并没有明确说明,本领域技术人员可以对本申请进行各种修改、改进和修正。该类修改、改进和修正在本申请中被建议,所以该类修改、改进、修正仍属于本申请示范实施例的精神和范围。
同时,本申请使用了特定术语来描述本申请的实施例。如“一个实施例”、“一实施例”、和/或“一些实施例”意指与本申请至少一个实施例相关的某一特征、结构或特点。因此,应强调并注意的是,本说明书中在不同部分两次或多次提到的“一实施例”或“一个实施例”或“一替代性实施例”并不一定是指同一实施例。此外,本申请的至少一个实施例中的某些特征、结构或特点可以进行适当的组合。
另外,本领域普通技术人员可以理解的是,本申请的各个方面可以通过若干具有可专利性的种类或情况进行说明和描述,包括任何新的和有用的工序、机器、产品或物质的组合,或对他们任何新的和有用的改进。相应地,本申请的各个方面可以完全由硬件执行、可以完全由软件(包括固件、常驻软件、微码等)执行、也可以由硬件和软件组合执行。以上硬件或软件均可以被称为“单元”、“组件”或“系统”。此外,本申请的各方面可以表现为位于至少一个计算机可读介质中的计算机产品,所述产品包括计算机可读程序编码。
此外,除非申请专利范围中明确说明,本申请所述处理元件和序列的顺序、数位字母的使用、或其他名称的使用,并非用于限定本申请流程和方法的顺序。尽管上述披露中通过各种示例讨论了一些目前认为有用的发明实施例,但应当理解的是,该类细节仅起到说明的目的,附加的申请专利范围并不仅限于披露的实施例,相反,申请专利范围旨在覆盖所有符合本申请实施例实质和范围的修正和等价组合。例如,虽然以上所描述的系统组件可以通过硬件装置实现,但是也可以只通过软件的解决方案得以实现,如在现有的服务器或行动装置上安装所描述的系统。
同样应当理解的是,为了简化本申请揭示的表述,从而帮助对至少一个发明实施例的理解,前文对本申请实施例的描述中,有时会将多种特征归并至一个实施例、附图或对其的描述中。但是,这种披露方法幷不意味着本申请对象所需要的特征比权利要求中提及的特征多。实际上,实施例的特征要少于上述披露的单个实施例的全部特征。
Claims (10)
1.一种可视化列表数据展示方法,其特征在于,所述方法包括:
获取待显示界面的原始配置文件,所述原始配置文件包括初始JSON结构数据列表;
将所述原始配置文件的格式转换为统一指定格式,得到中间配置文件,所述中间配置文件为二叉树结构数据列表;
解析所述中间配置文件的数据结构与语法结构,所述数据结构用于反映所述中间配置文件中各对象之间的数理关系,所述语法结构用于反映所述中间配置文件中各对象之间的逻辑关系;
基于所述数据结构与所述语法结构,生成转换后配置文件,所述转换后的配置文件包括UI列表;
根据所述转换后配置文件对所述待显示界面进行渲染显示,所述界面为UI列表界面。
2.根据权利要求1所述的可视化列表数据展示方法,其特征在于,所述初始JSON结构数据列表包含唯一ID、父ID、同层排序和待展示信息。
3.根据权利要求2所述的可视化列表数据展示方法,其特征在于,对将所述原始配置文件的代码格式转换为统一指定格式,得到中间配置文件,包括对所述初始JSON结构数据列表进行按照父ID进行归类、排序和存储处理,所述归类、排序后的JSON数据存储至虚拟存储空间内,将列表中的json数据处理为键/值形式的数据。
4.根据权利要求3所述的可视化列表数据展示方法,其特征在于,对将所述原始配置文件的代码格式转换为统一指定格式,得到中间配置文件,还包括对同类型的JSON数据进行初始化,得到第一虚拟存储空间和第二虚拟存储空间:并对所述虚拟存储空间进行遍历处理,基于排序好的要素按照二叉树结构将数据分配至所述第一虚拟存储空间和第二虚拟存储空间内,所述第一虚拟存储空间与所述第二虚拟存储空间对应排布。
5.根据权利要求4所述的可视化列表数据展示方法,其特征在于,对所述初始JSON数据列表进行处理,还包括基于所述第一虚拟存储空间和第二虚拟存储空间,生成二叉树的对应根节点,所述根节点的value的ID为设定默认值。
6.根据权利要求5所述的可视化列表数据展示方法,其特征在于,所述二叉树数据结构的获得包括对所述二叉树的根节点进行递归处理,得到二叉树数据结构。
7.根据权利要求1所述的可视化列表数据展示方法,其特征在于,所述中间配置文件的数据结构包括所述二叉树数据结构中的树节点保存的数据信息的展开标志,所述中间配置文件的语法结构包括所述二叉树数据结构中的树节点的左右子树的性质;所述展开标志包括1和0,当展开标志为1时,获取该树节点的左子树数据并将数据转为列表数据。
8.根据权利要求7所述的可视化列表数据展示方法,其特征在于,基于所述数据结构与所述语法结构,生成转换后配置文件,包括根据所述二叉树数据结构中的树节点保存的数据信息的展开标志,以及树节点的左右子树的性质生成对应的UI列表的多个数组。
9.根据权利要求1所述的可视化列表数据展示方法,其特征在于,根据所述转换后配置文件对所述待显示界面进行渲染显示包括:
对所述UI列表的数组添加点击事件,所述数组包括索引;
根据所述数组的索引,对所述数组的进行查找,确定所述数组中的ID列表;
根据所述ID列表对二叉树中的指定节点进行展开标志的切换;
根据展开标志的切换,获取二叉树中的数组;
根据所述数组对所述UI列表进行二次渲染;
循环执行以上过程,直至渲染结束。
10.一种可视化列表数据展示装置,其特征在于,包括:
配置文件获取模块,用于获取待显示界面的原始配置文件,所述原始配置文件包括JSON结构数据列表;
格式转换模块,用于将所述原始配置文件的格式转换为统一指定格式,得到中间配置文件,所述中间配置文件为二叉树结构数据列表;
配置文件解析模块,用于解析所述中间配置文件的数据结构与语法结构,所述数据结构用于反映所述中间配置文件中各对象之间的数理关系,所述语法结构用于反映所述中间配置文件中各对象之间的逻辑关系;
配置文件转换模块,用于基于所述数据结构与所述语法结构,生成转换后配置文件,所述转换后的配置文件包括UI列表;
界面渲染显示模块,用于根据所述转换后配置文件对所述待显示界面进行渲染显示,所述界面为UI列表界面。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202210269194.XA CN114722112A (zh) | 2022-03-18 | 2022-03-18 | 一种可视化列表数据展示方法及其装置 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202210269194.XA CN114722112A (zh) | 2022-03-18 | 2022-03-18 | 一种可视化列表数据展示方法及其装置 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN114722112A true CN114722112A (zh) | 2022-07-08 |
Family
ID=82237468
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202210269194.XA Pending CN114722112A (zh) | 2022-03-18 | 2022-03-18 | 一种可视化列表数据展示方法及其装置 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN114722112A (zh) |
Cited By (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN115733858A (zh) * | 2022-11-04 | 2023-03-03 | 广州懿豪科技有限公司 | 基于大数据和物联网通信的数据处理方法及系统 |
-
2022
- 2022-03-18 CN CN202210269194.XA patent/CN114722112A/zh active Pending
Cited By (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN115733858A (zh) * | 2022-11-04 | 2023-03-03 | 广州懿豪科技有限公司 | 基于大数据和物联网通信的数据处理方法及系统 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
US10579344B2 (en) | Converting visual diagrams into code | |
KR101299670B1 (ko) | 웹페이지의 동적 변환 시스템, 방법 및 컴퓨터 판독 가능한 기록 매체 | |
CN105760534B (zh) | 自定义的可序列化的数据结构、hadoop集群、服务器及其应用方法 | |
US8631041B2 (en) | Secondary lazy-accessible serialization of electronic content | |
JP4997749B2 (ja) | 文書処理方法、プログラム及びシステム | |
US11907203B2 (en) | Path encoded tree structures for operations | |
US20120137273A1 (en) | Trace visualization for object oriented programs | |
CN101799753B (zh) | 一种实现树形结构的方法及装置 | |
US10489024B2 (en) | UI rendering based on adaptive label text infrastructure | |
CN110032368B (zh) | 信息配置方法及装置 | |
CN111382192B (zh) | 一种数据列表展示方法、装置和电子设备 | |
US10776351B2 (en) | Automatic core data service view generator | |
CN111221530A (zh) | 移动端Web应用界面构建方法、Web应用界面及其操作方法 | |
CN116610398A (zh) | 递归树形组件展示方法、装置、计算机设备及计算机可读存储介质 | |
CN114722112A (zh) | 一种可视化列表数据展示方法及其装置 | |
CN116932829A (zh) | 针对开发者的支持大数据树形视图组件的解决方案 | |
CN111508562A (zh) | 流程描述性语言的可视化显示方法、装置、设备和介质 | |
CN116028062A (zh) | 目标代码的生成方法、npu指令的显示方法及装置 | |
CN114968235A (zh) | 一种页面表单生成方法、装置、计算机设备及存储介质 | |
Shihab et al. | Angur: A visualization system for XML documents | |
Milovanovic et al. | Python Data Visualization Cookbook | |
CN117035067B (zh) | 一种思维导图的渲染方法、装置及电子设备 | |
CN108536443B (zh) | 基于声明式的.net对象和多种数据格式自动相互转化的方法 | |
CN116775934A (zh) | 基于数字化孪生的三维可视化数据索引方法及系统 | |
Rodrigues | Analyzing textual data by multiple word clouds |
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 |