CN104461549B - 图形界面的排列显示方法及装置 - Google Patents

图形界面的排列显示方法及装置 Download PDF

Info

Publication number
CN104461549B
CN104461549B CN201410779459.6A CN201410779459A CN104461549B CN 104461549 B CN104461549 B CN 104461549B CN 201410779459 A CN201410779459 A CN 201410779459A CN 104461549 B CN104461549 B CN 104461549B
Authority
CN
China
Prior art keywords
rectangle
arrangement
icon
data
data content
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
CN201410779459.6A
Other languages
English (en)
Other versions
CN104461549A (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.)
Beijing Gridsum Technology Co Ltd
Original Assignee
Beijing Gridsum Technology Co 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 Beijing Gridsum Technology Co Ltd filed Critical Beijing Gridsum Technology Co Ltd
Priority to CN201410779459.6A priority Critical patent/CN104461549B/zh
Publication of CN104461549A publication Critical patent/CN104461549A/zh
Application granted granted Critical
Publication of CN104461549B publication Critical patent/CN104461549B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Abstract

本发明公开了一种图形界面的排列显示方法及装置。其中,该方法包括:读取屏幕的屏幕分辨率;根据屏幕分辨率对图形界面进行划分,生成排列网格;获取需要显示的数据内容集合;根据数据内容集合,获取与数据内容集合匹配的矩形组合排列模板;将数据内容集合按照矩形组合排列模板对数据内容进行排列显示;将矩形显示单元按照预定的单元排列模板进行排列显示。本发明解决了现有技术中设计人员、技术人员、咨询人员以及界面使用用户需要针对每个前端界面进行重复开发,导致的开发效率低、浪费人力资源的问题。

Description

图形界面的排列显示方法及装置
技术领域
本发明涉及计算机领域,具体而言,涉及一种图形界面的排列显示方法及装置。
背景技术
在日常的软件开发过程中,程序开发人员往往在对软件功能进行开发之后,还要对前端显示界面进行设计开发。在开发调试阶段,不但要对软件功能的可靠性进行测试,还要对前端界面的兼容性和美观度进行验证。
对于程序开发人员来说,前端显示界面的设计开发工作往往并不能得心应手,很难在保证前端显示界面兼容性的同时,还兼顾美观度。每次在对功能开发完毕之后,还要花费大量的时间和精力对前端显示界面进行重复的开发,造成了程序开发人员资源的浪费。
进一步的,如果在多个开发人员对同一个软件进行开发时,很难统一每个程序开发人员开发出来的前端显示界面的一致性。
就设计人员来说,创意的结果是多样的,从创意产生到最终的工程图样的呈现都是需要经过大量的尺度换算和设定。同时在设计中存在大量的定制和个性多元化的设计概念,这样在多平台设计当中增加了设计师的工作量。就咨询人员来说,需要大量将咨询结果转换为简单易懂的图形的绘图任务,处理图形界面的工作量非常庞大。就界面的使用用户来说,想要打造具有自己个性的操作界面的学习成本和实施成本都很高。
针对现有技术中设计人员、技术人员、咨询人员以及界面使用用户需要针对每个前端界面进行重复开发,导致的开发效率低、浪费人力资源的问题,目前尚未提出有效的解决方案。
发明内容
本发明的主要目的在于提供一种图形界面的排列显示方法及装置,以解决现有技术中设计人员、技术人员、咨询人员以及界面使用用户需要针对每个前端界面进行重复开发,导致的开发效率低、浪费人力资源的问题。
为了实现上述目的,根据本发明实施例的一个方面,提供了一种图形界面的排列显示方法。该方法包括:读取屏幕的屏幕分辨率;根据屏幕分辨率对图形界面进行划分,生成排列网格;获取需要显示的数据内容集合;根据数据内容集合,获取与数据内容集合匹配的矩形组合排列模板,其中,矩形组合排列模板用于表征在图形界面内,由在横向方向上以等高矩形图标,在纵向方向上以等宽矩形图标按预定的图标排列方式组合成矩形图标集合,并进行显示的排列显示方法,排列网格用于表征矩形组合排列模板中用于计算各个矩形图标的各个边长的基本单位;将数据内容集合按照矩形组合排列模板对数据内容进行排列显示;将矩形显示单元按照预定的单元排列模板进行排列显示。
为了实现上述目的,根据本发明实施例的另一方面,提供了一种图形界面的排列显示装置,该装置包括:读取模块,用于读取屏幕的屏幕分辨率;第一生成模块,用于根据屏幕分辨率对图形界面进行划分,生成排列网格;第一获取模块,用于获取需要显示的数据内容集合;第二获取模块,用于根据数据内容集合,获取与数据内容集合匹配的矩形组合排列模板,其中,矩形组合排列模板用于表征在图形界面内,由在横向方向上以等高矩形图标,在纵向方向上以等宽矩形图标按预定的图标排列方式组合成矩形图标集合,并进行显示的排列显示方法,排列网格用于表征矩形组合排列模板中用于计算各个矩形图标的各个边长的基本单位;第二生成模块,用于将数据内容集合按照矩形组合排列模板对数据内容进行排列显示;显示模块,用于将矩形显示单元按照预定的单元排列模板进行排列显示。
根据发明实施例,通过读取屏幕的屏幕分辨率;根据屏幕分辨率对图形界面进行划分,生成排列网格;获取需要显示的数据内容集合;根据数据内容集合,获取与数据内容集合匹配的矩形组合排列模板,其中,矩形组合排列模板用于表征在图形界面内,由在横向方向上以等高矩形图标,在纵向方向上以等宽矩形图标按预定的图标排列方式组合成矩形图标集合,并进行显示的排列显示方法,排列网格用于表征矩形组合排列模板中用于计算各个矩形图标的各个边长的基本单位;将数据内容集合按照矩形组合排列模板对数据内容进行排列显示;将矩形显示单元按照预定的单元排列模板进行排列显示,解决了现有技术中设计人员、技术人员、咨询人员以及界面使用用户需要针对每个前端界面进行重复开发,导致的开发效率低、浪费人力资源的问题。实现了根据需要显示的数据内容自动生成与数据内容匹配的图形界面的效果。
附图说明
构成本申请的一部分的附图用来提供对本发明的进一步理解,本发明的示意性实施例及其说明用于解释本发明,并不构成对本发明的不当限定。在附图中:
图1是根据本发明实施例一的图形界面的排列显示方法的流程图;
图2是根据本发明实施例二的图形界面的排列显示装置的结构示意图;以及
图3是根据本发明实施例二优选的图形界面的排列显示装置的结构示意图。
具体实施方式
需要说明的是,在不冲突的情况下,本申请中的实施例及实施例中的特征可以相互组合。下面将参考附图并结合实施例来详细说明本发明。
为了使本技术领域的人员更好地理解本发明方案,下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本发明一部分的实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都应当属于本发明保护的范围。
需要说明的是,本发明的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象,而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换,以便这里描述的本发明的实施例。此外,术语“包括”和“具有”以及他们的任何变形,意图在于覆盖不排他的包含,例如,包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元,而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。
实施例1
本发明实施例提供了一种图形界面的排列显示方法。
图1是根据本发明实施例的图形界面的排列显示方法的流程图。如图1所示,该方法包括步骤如下:
步骤S11,读取屏幕的屏幕分辨率。
具体的,通过上述步骤S11,获取当前用于显示图形界面的屏幕的屏幕分辨率。
步骤S13,根据屏幕分辨率对图形界面进行划分,生成排列网格。
具体的,通过上述步骤S13,根据屏幕的屏幕分辨率,对图形界面以网状形式进行划分。将图形界面按照预定的间隔划分为若干个正方形区域,得到与屏幕分辨率对应的用于排列图标的排列网格。
在实际应用当中,常用的屏幕分辨率,以及屏幕比例只有几种。可以预先根据屏幕的分辨率设置与屏幕分辨率对应的排列网格划分的方案,以提高图形界面在各种屏幕分辨率的屏幕上都能得到很好的显示效果。
步骤S15,获取需要显示的数据内容集合。
具体的,通过上述步骤S15,获取需要通过图形界面进行显示的数据内容集合,通过数据内容集合可以确定需要显示的内容数量,以及需要进行显示的数据内容。
步骤S17,根据数据内容集合,获取与数据内容集合匹配的矩形组合排列模板,其中,矩形组合排列模板用于表征在图形界面内,由在横向方向上以等高矩形图标,在纵向方向上以等宽矩形图标按预定的图标排列方式组合成矩形图标集合,并进行显示的排列显示方法,排列网格用于表征矩形组合排列模板中用于计算各个矩形图标的各个边长的基本单位。
具体的,通过上述步骤S17,将预先设置的矩形组合排列模板与由数据内容集合确定的需要显示的内容数量进行匹配,得到与数据内容集合匹配的矩形组合排列模板。其中,矩形组合排列模板的排列方式,首先,需要在排列网格上确定用于确定初始位置的正方形图标的位置。然后,在正方形图标的纵向方向排列宽度相同而高度不同的长方形图标,在正方形图标的横向方向排列高度相同而宽度不同的长方形图标。正方形图标和长方形图标都可以用来显示数据内容集合中的数据内容。通过矩形组合排列模板中的正方形图标和长方形图标的数量与数据内容集合中的数据内容进行匹配,得到与数据内容集合匹配的矩形组合排列模板。矩形组合排列模板中的各个矩形图标的各个边长设定为排列网格的基本单位的整数倍,故需要通过排列网格的基本单位计算得到矩形组合排列模板中,各个图标在显示界面内的具体显示位置和大小。
步骤S19,将数据内容集合按照矩形组合排列模板对数据内容进行排列显示。
具体的,上述步骤S19,将数据内容中的数据,按照经过匹配得到的矩形组合排列模板进行显示。
步骤S21,将矩形显示单元按照预定的单元排列模板进行排列显示。
具体的,上述步骤S21,将数据内容中的数据以矩形组合排列模板构成的矩形显示单元。在生成的矩形显示单元大于或等于两个时,因为数据内容集合中的数据内容的数量不同,所以不同数据内容集合所对应的显示单元的形状和大小也不同。根据显示单元的边长,对各个显示单元进行排列并显示。
在实际应用当中,可以通过计算得出各个显示单元边长的比例,与预先设置在单元排列模板中的边长比例进行匹配,并将各个显示单元按照匹配结果进行排列显示。也可以在单元排列模板中预先设置固定的显示单元大小和显示单元位置,将各个生成的显示单元通过等比缩放,按照预先设置的模板排列方式进行排列显示。当然,单元排列模板也可以根据需要显示的矩形显示单元的数量设置多个单元排列模板,已达到更好的现实效果。
通过上述步骤S11至步骤S21,首先根据不同屏幕的屏幕分辨率,对图形界面进行划分,划分为与屏幕分辨率对应的用于排列图标的排列网格。然后,将预先设置的矩形组合排列模板与数据内容集合的属性信息进行匹配,得到适用于数据内容集合的矩形组合排列模板。最后,将数据内容集合中的各个需要显示的数据内容依照划分的排列网格,生成矩形显示单元。根据各个矩形显示单元的边长,将矩形显示单元按照预定的单元排列模板进行显示。
在实际应用当中,程序开发人员仅仅需要确定在图形界面显示的数据内容,本方法就可以根据屏幕的屏幕分辨率和需要显示的内容获取一套适用的矩形组合排列模板。将数据内容以至少两个矩形图标的形式生成矩形显示单元。在有多个矩形显示单元时,还会进一步的对各个矩形显示单元进行排列显示。
综上可知,本发明解决了现有技术中设计人员、技术人员、咨询人员以及界面使用用户需要针对每个前端界面进行重复开发,导致的开发效率低、浪费人力资源的问题,实现了根据需要显示的数据内容自动生成与数据内容匹配的图形界面的效果。
优选的,本申请上述实施例中,在步骤S21将矩形显示单元按照预定的单元排列模板进行排列显示的步骤包括:
步骤S211,确定矩形显示单元的单元数量。
步骤S213,获取与单元数量匹配的预先设置的单元排列模板。
步骤S215,将矩形显示单元按照单元排列模板进行排列显示。
具体的,通过上述步骤S211至步骤S215,针对于生成的矩形显示单元大于或者等于两个的情况,可以根据生成的举行显示单元的单元数量,获取预先设置的与单元数量相同的单元排列模板,将各个矩形显示单元,按照单元排列模板中的排列方式进行排列显示。
优选的,本申请上述实施例中,在步骤S13根据屏幕分辨率对图形界面进行划分,生成排列网格中,步骤可以包括:
步骤S131,根据屏幕分辨率,确定用于划分图形界面的基本单位a。
步骤S133,按照基本单位a对图形界面进行划分,将图形界面划分为由正方形组成的排列网格,其中,正方形边长为基本单位a。
具体的,上述步骤S131至步骤S133,通过屏幕分辨率确认适用于当前屏幕分辨率的用于划分图形界面的基本单位a。对图形界面按照基本单位a分别进行横向和纵向的划分,将图形界面划分为由边长为a的正方形组成的排列网格。根据屏幕分辨率确定基本单位a的具体步骤可以是:根据分辨率确定屏幕的横向、纵向像素数,进而根据横向、纵向像素数对图形界面进行划分,横向得到边长为a个像素点的数个正方形,纵向得到边长为a个像素点的数个正方形。
在实际应用当中,可以通过对图形界面划分的排列网格,确定每个正方形图标的位置。在对正方形等比排列模板的设计过程中,只需要确定各个图标在排列网格中的相对位置即可,不需要再针对每种屏幕分辨率设计单独的显示模板或者调节模板中的各个图标在屏幕中的绝对位置。
优选的,本申请上述实施例中,数据内容集合至少包括:至少一个功能性数据和至少一个用于描述功能性数据的指标数据的情况下,在步骤S17根据数据内容集合,获取与数据内容集合匹配的矩形组合排列模板中,步骤可以包括:
步骤S171,根据数据内容集合,确定数据内容集合中包含的与每个功能性数据对应的指标数据的指标数量。
步骤S173,将指标数量与矩形组合排列模板中定义为用于显示指标数据的矩形图标的显示数量进行匹配,得到与数据内容集合匹配的矩形图标排列模板。
具体的,通过上述步骤S171至步骤S173,将获取到的数据内容集合进行分析,得到数据内容集合中包含的功能性数据和与功能性数据对应的指标数据的数量。将矩形组合排列模板定义的正方形图标纵向方向的等宽矩形图标、正方形图标横向方向的等高举行图标数量的总和与指标数据进行匹配,确定与数据内容集合匹配的矩形组合排列模板。其中,功能性指标可以是用于点击操作的图标内容,功能性指标也可以是直接反应数据本身的数值。而指标数据为对功能性数据的描述性数据,可以用于对功能型数据进行补充描述,也可以用于对功能性数据的分析数据,还可以用于针对于用户的关于功能性数据的提示性操作。
在实际应用当中,数据内容集合中至少包含了一个功能性参数,而对于功能性参数的指标数据的数量则是随机的,很难针对每种情况设计一套独有的等宽矩形排列模板。所以,可以在设置矩形组合排列模板的时候,为每个矩形组合排列模板设置一个适用内容数量的适用区间,从而扩大每种模板的适用范围。
并且,如果数据内容包含了两个以上的功能性参数时,矩形组合排列模板针对每一组功能性参数进行匹配。并针对于功能性参数对应的指标数据的数量匹配不同的矩形组合排列模板,分别生成不同的矩形显示单元。
以数据内容集合中由四个需要显示的数据内容,并且预设图标属性是预先设置的预设图标边长为例进行说明。首先确定数据内容集合中的数据内容的数量为四。然后获取适用区间包含四个的矩形图标排列模板。最后,按照预设图标属性中预先设置的预设图标的各边边长与矩形图标排列模板中的矩形图标的各边边长进行匹配,得到预设图标各边边长与矩形图标排列模板中矩形图标各边边长的匹配结果。当然,预设图标属性还可以是数据内容的显示优先级等。
优选的,本申请上述实施例中,在步骤S11读取屏幕的屏幕分辨率之前,方法还包括:
步骤S10,设定矩形组合排列模板,矩形组合排列模板用于确定数据内容集合中用于显示功能性数据的正方形图标的位置,以及用于显示指标数据的矩形图标的图标位置和图标大小。
具体的,通过上述步骤S10,针对需要显示的指标数据的数量,预先设置不同的矩形组合排列模板。矩形组合排列模板中规定了各个图标的显示位置和各个图标的显示大小。
优选的,本申请上述实施例中,在步骤S10设定等宽矩形排列模板中,步骤可以包括:
步骤S101,设定矩形图标间的图标间距为a。
步骤S103,设定用于显示功能数据的正方形图标的边长为a*n,其中,n为正整数。
步骤S105,设定各个用于显示指标数据的矩形图标横向宽边边长为a*n1’,纵向高边边长为a*n,其中,n1’为正整数。
步骤S107,设定各个用于显示指标数据的矩形图标纵向宽边边长为a*n,纵向高边边长为a*n2’,其中,n2’为正整数。
步骤S109,根据初始图标的边长a*n、横向矩形图标的宽边边长为a*n1’、纵向矩形图标的高边边长a*n2’和图标间距a,设定矩形图标的排列位置。
具体的,通过上述步骤S101至步骤S109,对设定矩形组合排列模板的步骤进行说明。首先,将矩形组合图标间的图标间距设置为a,其中,a是基本单位,a与屏幕分辨率相对应。然后,确定在图形界面中用于显示功能性数据的初始矩形图标的位置和大小。根据初始正方形图标的位置和大小,在初始正方形图标的横向方向设定若干个用于显示描述功能性数据的指标数据的等高矩形图标,在纵向方向设定若干个用于显示描述功能性数据的指标数据的等宽矩形图标。这些纵向排列的矩形图标的宽边边长都与该矩形图标所在列的第一行的矩形图标的宽边边长相同,而横向排列的矩形图标的高边边长都与该矩形图标所在行的第一列的矩形图标的高边边长相同。最后,根据上述初始图标的大小和各个矩形图标的大小,设定各个矩形图标的相对位置。
在实际应用当中,通过将边长设置为基本单位a的这种方法,可以方便模板设计人员对模板中各个图标的位置进行定位,不用为了保证图标在不同屏幕分辨率的屏幕上显示的准确性,需要确定在每种屏幕上图标的具体坐标值。
实施例2
本发明实施例还提供了一种图形界面的排列显示装置,如图2所示,该装置可以包括:读取模块31、第一生成模块33、第一获取模块35、第二获取模块37、第二生成模块39和显示模块41。
其中,读取模块31,用于读取屏幕的屏幕分辨率。
具体的,通过上述读取模块31,获取当前用于显示图形界面的屏幕的屏幕分辨率。
第一生成模块33,用于根据屏幕分辨率对图形界面进行划分,生成排列网格。
具体的,通过上述第一生成模块33,根据屏幕的屏幕分辨率,对图形界面以网状形式进行划分。将图形界面按照预定的间隔划分为若干个正方形区域,得到与屏幕分辨率对应的用于排列图标的排列网格。
第一获取模块35,用于获取需要显示的数据内容集合。
具体的,通过上述第一获取模块35,获取需要通过图形界面进行显示的数据内容集合,通过数据内容集合可以确定需要显示的内容数量,以及需要进行显示的数据内容。
第二获取模块37,用于根据数据内容集合,获取与数据内容集合匹配的矩形组合排列模板,其中,矩形组合排列模板用于表征在图形界面内,由在横向方向上以等高矩形图标,在纵向方向上以等宽矩形图标按预定的图标排列方式组合成矩形图标集合,并进行显示的排列显示方法,排列网格用于表征矩形组合排列模板中用于计算各个矩形图标的各个边长的基本单位。
具体的,通过上述第二获取模块37,将预先设置的矩形组合排列模板与由数据内容集合确定的需要显示的内容数量进行匹配,得到与数据内容集合匹配的矩形组合排列模板。其中,矩形组合排列模板的排列方式,首先,需要在排列网格上确定用于确定初始位置的正方形图标的位置。然后,在正方形图标的纵向方向排列宽度相同而高度不同的长方形图标,在正方形图标的横向方向排列高度相同而宽度不同的长方形图标。正方形图标和长方形图标都可以用来显示数据内容集合中的数据内容。通过矩形组合排列模板中的正方形图标和长方形图标的数量与数据内容集合中的数据内容进行匹配,得到与数据内容集合匹配的矩形组合排列模板。矩形组合排列模板中的各个矩形图标的各个边长设定为排列网格的基本单位的整数倍,故需要通过排列网格的基本单位计算得到矩形组合排列模板中,各个图标在显示界面内的具体显示位置和大小。
第二生成模块39,用于将数据内容集合按照矩形组合排列模板对数据内容进行排列显示。
具体的,上述第二生成模块39,将数据内容中的数据,按照经过匹配得到的矩形组合排列模板进行显示。
显示模块41,用于将矩形显示单元按照预定的单元排列模板进行排列显示。
具体的,上述显示模块41,将数据内容中的数据以矩形组合排列模板构成的矩形显示单元。在生成的矩形显示单元大于或等于两个时,因为数据内容集合中的数据内容的数量不同,所以不同数据内容集合所对应的显示单元的形状和大小也不同。根据显示单元的边长,对各个显示单元进行排列并显示。
在实际应用当中,可以通过计算得出各个显示单元边长的比例,与预先设置在单元排列模板中的边长比例进行匹配,并将各个显示单元按照匹配结果进行排列显示。也可以在单元排列模板中预先设置固定的显示单元大小和显示单元位置,将各个生成的显示单元通过等比缩放,按照预先设置的模板排列方式进行排列显示。当然,单元排列模板也可以根据需要显示的矩形显示单元的数量设置多个单元排列模板,已达到更好的现实效果。
通过上述读取模块31、第一生成模块33、第一获取模块35、第二获取模块37、第二生成模块39和显示模块41,首先根据不同屏幕的屏幕分辨率,对图形界面进行划分,划分为与屏幕分辨率对应的用于排列图标的排列网格。然后,将预先设置的矩形组合排列模板与数据内容集合的属性信息进行匹配,得到适用于数据内容集合的矩形组合排列模板。最后,将数据内容集合中的各个需要显示的数据内容依照划分的排列网格,生成矩形显示单元。根据各个矩形显示单元的边长,将矩形显示单元按照预定的单元排列模板进行显示。
在实际应用当中,程序开发人员仅仅需要确定在图形界面显示的数据内容,本方法就可以根据屏幕的屏幕分辨率和需要显示的内容获取一套适用的矩形组合排列模板。将数据内容以至少两个矩形图标的形式生成矩形显示单元。在有多个矩形显示单元时,还会进一步的对各个矩形显示单元进行排列显示。
综上可知,本发明解决了现有技术中设计人员、技术人员、咨询人员以及界面使用用户需要针对每个前端界面进行重复开发,导致的开发效率低、浪费人力资源的问题,实现了根据需要显示的数据内容自动生成与数据内容匹配的图形界面的效果。
优选的,本申请上述实施例中,上述显示模块41包括:第一子确定模块、子获取模块和子显示模块。
其中,第一子确定模块,用于确定矩形显示单元的单元数量。
子获取模块,用于获取与单元数量匹配的预先设置的单元排列模板。
子显示模块,用于将矩形显示单元按照单元排列模板进行排列显示。
具体的,通过上述第一子确定模块、子获取模块和子显示模块,针对于生成的矩形显示单元大于或者等于两个的情况,可以根据生成的举行显示单元的单元数量,获取预先设置的与单元数量相同的单元排列模板,将各个矩形显示单元,按照单元排列模板中的排列方式进行排列显示。
进一步的,可以通过上述第一生成模块33,执行如下步骤:
首先,根据屏幕分辨率,确定用于划分图形界面的基本单位a。然后,按照基本单位a对图形界面进行划分,将图形界面划分为由正方形组成的排列网格,其中,正方形边长为基本单位a。
具体的,在上述步骤中,通过屏幕分辨率确认适用于当前屏幕分辨率的用于划分图形界面的基本单位a。对图形界面按照基本单位a分别进行横向和纵向的划分,将图形界面划分为由边长为a的正方形组成的排列网格。根据屏幕分辨率确定基本单位a的具体步骤可以是:根据分辨率确定屏幕的横向、纵向像素数,进而根据横向、纵向像素数对图形界面进行划分,横向得到边长为a个像素点的数个正方形,纵向得到边长为a个像素点的数个正方形。
在实际应用当中,可以通过对图形界面划分的排列网格,确定每个正方形图标的位置。在对正方形等比排列模板的设计过程中,只需要确定各个图标在排列网格中的相对位置即可,不需要再针对每种屏幕分辨率设计单独的显示模板或者调节模板中的各个图标在屏幕中的绝对位置。
优选的,本申请上述实施例中,上述第二获取模块37包括:第二子确定模块和子匹配模块。
其中,第二子确定模块,用于根据数据内容集合,确定数据内容集合中包含的与每个功能性数据对应的指标数据的指标数量,其中,数据内容集合至少包括:至少一个功能性数据和至少一个用于描述功能性数据的指标数据。
子匹配模块,用于将指标数量与矩形组合排列模板中定义为用于显示指标数据的矩形图标的显示数量进行匹配,得到与数据内容集合匹配的矩形组合排列模板。
具体的,通过上述第二子确定模块和子匹配模块,将获取到的数据内容集合进行分析,得到数据内容集合中包含的功能性数据和与功能性数据对应的指标数据的数量。将矩形组合排列模板定义的正方形图标纵向方向的等宽矩形图标、正方形图标横向方向的等高举行图标数量的总和与指标数据进行匹配,确定与数据内容集合匹配的矩形组合排列模板。其中,功能性指标可以是用于点击操作的图标内容,功能性指标也可以是直接反应数据本身的数值。而指标数据为对功能性数据的描述性数据,可以用于对功能型数据进行补充描述,也可以用于对功能性数据的分析数据,还可以用于针对于用户的关于功能性数据的提示性操作。
在实际应用当中,数据内容集合中至少包含了一个功能性参数,而对于功能性参数的指标数据的数量则是随机的,很难针对每种情况设计一套独有的等宽矩形排列模板。所以,可以在设置矩形组合排列模板的时候,为每个矩形组合排列模板设置一个适用内容数量的适用区间,从而扩大每种模板的适用范围。
并且,如果数据内容包含了两个以上的功能性参数时,矩形组合排列模板针对每一组功能性参数进行匹配。并针对于功能性参数对应的指标数据的数量匹配不同的矩形组合排列模板,分别生成不同的矩形显示单元。
以数据内容集合中由四个需要显示的数据内容,并且预设图标属性是预先设置的预设图标边长为例进行说明。首先确定数据内容集合中的数据内容的数量为四。然后获取适用区间包含四个的矩形图标排列模板。最后,按照预设图标属性中预先设置的预设图标的各边边长与矩形图标排列模板中的矩形图标的各边边长进行匹配,得到预设图标各边边长与矩形图标排列模板中矩形图标各边边长的匹配结果。当然,预设图标属性还可以是数据内容的显示优先级等。
优选的,本申请上述实施例中,如图3所示,装置还可以包括:设定模块30。
设定模块30,用于设定矩形组合排列模板,矩形组合排列模板用于确定数据内容集合中用于显示功能性数据的正方形图标的位置,以及用于显示指标数据的矩形图标的图标位置和图标大小。
具体的,通过上述设定模块30,针对需要显示的指标数据的数量,预先设置不同的矩形组合排列模板。矩形组合排列模板中规定了各个图标的显示位置和各个图标的显示大小。
进一步的,通过上述设定模块30设定模板的步骤可以包括:
首先,设定矩形图标间的图标间距为a。然后,设定用于显示功能数据的正方形图标的边长为a*n,其中,n为正整数。进一步,设定各个用于显示指标数据的矩形图标横向宽边边长为a*n1’,纵向高边边长为a*n,其中,n1’为正整数,设定各个用于显示指标数据的矩形图标纵向宽边边长为a*n,纵向高边边长为a*n2’,其中,n2’为正整数。最后,根据初始图标的边长a*n、横向矩形图标的宽边边长为a*n1’、纵向矩形图标的高边边长a*n2’和图标间距a,设定矩形图标的排列位置。
具体的,通过上述步骤,对设定矩形组合排列模板的步骤进行说明。首先,将矩形组合图标间的图标间距设置为a,其中,a是基本单位,a与屏幕分辨率相对应。然后,确定在图形界面中用于显示功能性数据的初始矩形图标的位置和大小。根据初始正方形图标的位置和大小,在初始正方形图标的横向方向设定若干个用于显示描述功能性数据的指标数据的等高矩形图标,在纵向方向设定若干个用于显示描述功能性数据的指标数据的等宽矩形图标。这些纵向排列的矩形图标的宽边边长都与该矩形图标所在列的第一行的矩形图标的宽边边长相同,而横向排列的矩形图标的高边边长都与该矩形图标所在行的第一列的矩形图标的高边边长相同。最后,根据上述初始图标的大小和各个矩形图标的大小,设定各个矩形图标的相对位置。
在实际应用当中,通过将边长设置为基本单位a的这种方法,可以方便模板设计人员对模板中各个图标的位置进行定位,不用为了保证图标在不同屏幕分辨率的屏幕上显示的准确性,需要确定在每种屏幕上图标的具体坐标值。
需要说明的是,对于前述的各方法实施例,为了简单描述,故将其都表述为一系列的动作组合,但是本领域技术人员应该知悉,本发明并不受所描述的动作顺序的限制,因为依据本发明,某些步骤可以采用其他顺序或者同时进行。其次,本领域技术人员也应该知悉,说明书中所描述的实施例均属于优选实施例,所涉及的动作和模块并不一定是本发明所必须的。
在上述实施例中,对各个实施例的描述都各有侧重,某个实施例中没有详述的部分,可以参见其他实施例的相关描述。
在本申请所提供的几个实施例中,应该理解到,所揭露的装置,可通过其它的方式实现。例如,以上所描述的装置实施例仅仅是示意性的,例如所述单元的划分,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式,例如多个单元或组件可以结合或者可以集成到另一个系统,或一些特征可以忽略,或不执行。另一点,所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口,装置或单元的间接耦合或通信连接,可以是电性或其它的形式。
所述作为分离部件说明的单元可以是或者也可以不是物理上分开的,作为单元显示的部件可以是或者也可以不是物理单元,即可以位于一个地方,或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。
另外,在本发明各个实施例中的各功能单元可以集成在一个处理单元中,也可以是各个单元单独物理存在,也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现,也可以采用软件功能单元的形式实现。
所述集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时,可以存储在一个计算机可读取存储介质中。基于这样的理解,本发明的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储介质中,包括若干指令用以使得一台计算机设备(可为个人计算机、移动终端、服务器或者网络设备等)执行本发明各个实施例所述方法的全部或部分步骤。而前述的存储介质包括:U盘、只读存储器(ROM,Read-Only Memory)、随机存取存储器(RAM,Random Access Memory)、移动硬盘、磁碟或者光盘等各种可以存储程序代码的介质。
以上所述仅为本发明的优选实施例而已,并不用于限制本发明,对于本领域的技术人员来说,本发明可以有各种更改和变化。凡在本发明的精神和原则之内,所作的任何修改、等同替换、改进等,均应包含在本发明的保护范围之内。

Claims (7)

1.一种图形界面的排列显示方法,其特征在于,包括:
读取屏幕的屏幕分辨率;
根据所述屏幕分辨率对所述图形界面进行划分,生成排列网格;
获取需要显示的数据内容集合;
根据所述数据内容集合,获取与所述数据内容集合匹配的矩形组合排列模板,其中,所述矩形组合排列模板用于表征在图形界面内,由在横向方向上以等高矩形图标,在纵向方向上以等宽矩形图标按预定的图标排列方式组合成矩形图标集合,并进行显示的排列显示方法,所述排列网格用于表征所述矩形组合排列模板中用于计算各个矩形图标的各个边长的基本单位;
将所述数据内容集合按照所述矩形组合排列模板对所述数据内容进行排列显示,得到矩形显示单元;
将所述矩形显示单元按照预定的单元排列模板进行排列显示;
其中,所述数据内容集合至少包括:至少一个功能性数据和至少一个用于描述所述功能性数据的指标数据;
在所述读取屏幕的屏幕分辨率之前,所述方法还包括:设定所述矩形组合排列模板,所述矩形组合排列模板用于确定所述数据内容集合中用于显示所述功能性数据的正方形图标的位置,以及用于显示所述指标数据的所述矩形图标的图标位置和图标大小;
所述设定所述矩形组合排列模板的步骤包括:设定所述矩形图标间的图标间距为a;设定用于显示所述功能性数据的正方形初始图标的边长为a*n,其中,所述n为正整数;设定各个用于显示所述指标数据的矩形图标横向宽边边长为a*n1’,纵向高边边长为a*n,其中,所述n1’为正整数;设定各个用于显示所述指标数据的矩形图标纵向宽边边长为a*n,纵向高边边长为a*n2’,其中,所述n2’为正整数;根据所述初始图标的边长a*n、所述矩形图标横向宽边边长a*n1’、所述纵向高边边长a*n2’和所述图标间距a,设定所述矩形图标的排列位置。
2.根据权利要求1所述的方法,其特征在于,将矩形显示单元按照预定的单元排列模板进行排列显示的步骤包括:
确定所述矩形显示单元的单元数量;
获取与所述单元数量匹配的预先设置的单元排列模板;
将所述矩形显示单元按照所述单元排列模板进行排列显示。
3.根据权利要求1所述的方法,其特征在于,根据所述屏幕分辨率对所述图形界面进行划分,生成排列网格的步骤包括:
根据所述屏幕分辨率,确定用于划分所述图形界面的基本单位a;
按照所述基本单位a对所述图形界面进行划分,将所述图形界面划分为由正方形组成的所述排列网格,其中,所述正方形边长为所述基本单位a。
4.根据权利要求2所述的方法,其特征在于,根据所述数据内容集合,获取与所述数据内容集合匹配的矩形组合排列模板的步骤包括:
根据所述数据内容集合,确定所述数据内容集合中包含的与每个所述功能性数据对应的指标数据的指标数量;
将所述指标数量与所述矩形组合排列模板中定义为用于显示指标数据的矩形图标的显示数量进行匹配,得到与所述数据内容集合匹配的矩形组合排列模板。
5.一种图形界面的排列显示装置,其特征在于,包括:
读取模块,用于读取屏幕的屏幕分辨率;
第一生成模块,用于根据所述屏幕分辨率对所述图形界面进行划分,生成排列网格;
第一获取模块,用于获取需要显示的数据内容集合;
第二获取模块,用于根据所述数据内容集合,获取与所述数据内容集合匹配的矩形组合排列模板,其中,所述矩形组合排列模板用于表征在图形界面内,由在横向方向上以等高矩形图标,在纵向方向上以等宽矩形图标按预定的图标排列方式组合成矩形图标集合,并进行显示的排列显示方法,所述排列网格用于表征所述矩形组合排列模板中用于计算各个矩形图标的各个边长的基本单位;
第二生成模块,用于将所述数据内容集合按照所述矩形组合排列模板对所述数据内容进行排列显示,得到矩形显示单元;
显示模块,用于将所述矩形显示单元按照预定的单元排列模板进行排列显示;
其中,所述数据内容集合至少包括:至少一个功能性数据和至少一个用于描述所述功能性数据的指标数据;
所述装置还包括:设定模块,用于设定所述矩形组合排列模板,所述矩形组合排列模板用于确定所述数据内容集合中用于显示所述功能性数据的正方形图标的位置,以及用于显示所述指标数据的所述矩形图标的图标位置和图标大小;
其中,所述设定模块设定所述矩形组合排列模板的步骤包括:设定所述矩形图标间的图标间距为a;设定用于显示所述功能性数据的正方形初始图标的边长为a*n,其中,所述n为正整数;设定各个用于显示所述指标数据的矩形图标横向宽边边长为a*n1’,纵向高边边长为a*n,其中,所述n1’为正整数;设定各个用于显示所述指标数据的矩形图标纵向宽边边长为a*n,纵向高边边长为a*n2’,其中,所述n2’为正整数;根据所述初始图标的边长a*n、所述矩形图标横向宽边边长a*n1’、所述纵向高边边长a*n2’和所述图标间距a,设定所述矩形图标的排列位置。
6.根据权利要求5所述的装置,其特征在于,所述显示模块包括:
第一子确定模块,用于确定所述矩形显示单元的单元数量;
子获取模块,用于获取与所述单元数量匹配的预先设置的单元排列模板;
子显示模块,用于将所述矩形显示单元按照所述单元排列模板进行排列显示。
7.根据权利要求6所述的装置,其特征在于,根据所述数据内容集合,获取与所述数据内容集合匹配的矩形组合排列模板的步骤包括:
第二子确定模块,用于根据所述数据内容集合,确定所述数据内容集合中包含的与每个所述功能性数据对应的指标数据的指标数量;
子匹配模块,用于将所述指标数量与所述矩形组合排列模板中定义为用于显示指标数据的矩形图标的显示数量进行匹配,得到与所述数据内容集合匹配的矩形组合排列模板。
CN201410779459.6A 2014-12-15 2014-12-15 图形界面的排列显示方法及装置 Active CN104461549B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201410779459.6A CN104461549B (zh) 2014-12-15 2014-12-15 图形界面的排列显示方法及装置

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201410779459.6A CN104461549B (zh) 2014-12-15 2014-12-15 图形界面的排列显示方法及装置

Publications (2)

Publication Number Publication Date
CN104461549A CN104461549A (zh) 2015-03-25
CN104461549B true CN104461549B (zh) 2018-09-18

Family

ID=52907660

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201410779459.6A Active CN104461549B (zh) 2014-12-15 2014-12-15 图形界面的排列显示方法及装置

Country Status (1)

Country Link
CN (1) CN104461549B (zh)

Families Citing this family (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN106028101A (zh) 2016-05-19 2016-10-12 广州视源电子科技股份有限公司 按键功能图标的屏幕显示方法及其系统
CN111932011A (zh) * 2020-08-10 2020-11-13 南宁市永恒影像有限公司 基于二元组块树的矩形优化排样方法及装置

Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102457528A (zh) * 2010-10-19 2012-05-16 北京邮电大学 面向手机终端的自适应发布Web内容的方法与系统
CN103812888A (zh) * 2012-11-09 2014-05-21 阿里巴巴集团控股有限公司 信息推送、接收、传输方法、服务器、客户端及系统
CN104007991A (zh) * 2014-06-06 2014-08-27 百度在线网络技术(北京)有限公司 应用程序界面布局调整方法和装置

Family Cites Families (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US8497884B2 (en) * 2009-07-20 2013-07-30 Motorola Mobility Llc Electronic device and method for manipulating graphic user interface elements
US20130311940A1 (en) * 2012-05-15 2013-11-21 Salvadore V. Ragusa System of Organizing Digital Images
CN103941958B (zh) * 2013-01-23 2019-01-29 腾讯科技(深圳)有限公司 一种桌面管理的方法及终端设备
CN103873677B (zh) * 2013-05-22 2016-03-09 深圳市明日空间信息技术有限公司 一种基于symbian系统的手机桌面布局的实现方法
CN103927143B (zh) * 2014-04-04 2017-04-19 福建星网视易信息系统有限公司 一种基于屏幕分辨率自适应调整界面布局的方法及装置

Patent Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102457528A (zh) * 2010-10-19 2012-05-16 北京邮电大学 面向手机终端的自适应发布Web内容的方法与系统
CN103812888A (zh) * 2012-11-09 2014-05-21 阿里巴巴集团控股有限公司 信息推送、接收、传输方法、服务器、客户端及系统
CN104007991A (zh) * 2014-06-06 2014-08-27 百度在线网络技术(北京)有限公司 应用程序界面布局调整方法和装置

Also Published As

Publication number Publication date
CN104461549A (zh) 2015-03-25

Similar Documents

Publication Publication Date Title
CN104407779B (zh) 图形界面的排列显示方法及装置
US7827499B2 (en) Hierarchical dataset dashboard view
CN105608319B (zh) 一种数字病理切片的标注方法及标注装置
CN105205180B (zh) 一种知识图谱的评价方法及装置
US8117588B2 (en) Spatial iteration node for a graphical program
CN109358851A (zh) 图表组件的创建方法、装置及计算机可读存储介质
US20140068498A1 (en) Techniques for capturing and displaying user interaction data
CN105893253A (zh) 应用软件测试方法、测试装置及测试设备
CN110442510A (zh) 一种页面属性获取方法、装置及计算机设备、存储介质
CN107436762A (zh) 一种寄存器代码文件生成方法、装置和电子设备
CN106507686A (zh) 设计不同技术领域的复杂信息物理系统的具有其各种软件工件的软件架构的方法和工具
CN107909466A (zh) 客户关系网络展示方法、装置、设备及可读存储介质
CN104915297B (zh) 一种android设备的APP耗电量的自动化测试方法
Silva et al. A Goal Oriented Approach to Identify and Configure Feature Models for Software Product Lines.
CN107729246A (zh) 针对目标应用的辅助测试方法、装置、设备及存储介质
CN108536467B (zh) 代码的定位处理方法、装置、终端设备及存储介质
CN104461547B (zh) 图形界面的排列显示方法及装置
CN109491888A (zh) 应用程序兼容性测试方法、装置、及计算机可读存储介质
CN104484093B (zh) 图形界面的排列显示方法及装置
CN109471899A (zh) 一种可视化方法、装置及其存储介质
CN104461549B (zh) 图形界面的排列显示方法及装置
CN105677851B (zh) 一种界面截图方法及用户设备
CN104461249B (zh) 图形界面的排列显示方法及装置
CN106528115A (zh) 界面的可视化开发方法及装置
CN107895282A (zh) 一种基于时空网格的烟草市场大数据可视化方法

Legal Events

Date Code Title Description
C06 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant
PE01 Entry into force of the registration of the contract for pledge of patent right
PE01 Entry into force of the registration of the contract for pledge of patent right

Denomination of invention: Graphical interface arrangement display method and graphical interface arrangement display device

Effective date of registration: 20190531

Granted publication date: 20180918

Pledgee: Shenzhen Black Horse World Investment Consulting Co., Ltd.

Pledgor: Beijing Guoshuang Technology Co.,Ltd.

Registration number: 2019990000503

CP02 Change in the address of a patent holder
CP02 Change in the address of a patent holder

Address after: 100083 No. 401, 4th Floor, Haitai Building, 229 North Fourth Ring Road, Haidian District, Beijing

Patentee after: Beijing Guoshuang Technology Co.,Ltd.

Address before: 100086 Beijing city Haidian District Shuangyushu Area No. 76 Zhichun Road cuigongfandian 8 layer A

Patentee before: Beijing Guoshuang Technology Co.,Ltd.