CN104407779A - 图形界面的排列显示方法及装置 - Google Patents
图形界面的排列显示方法及装置 Download PDFInfo
- Publication number
- CN104407779A CN104407779A CN201410779533.4A CN201410779533A CN104407779A CN 104407779 A CN104407779 A CN 104407779A CN 201410779533 A CN201410779533 A CN 201410779533A CN 104407779 A CN104407779 A CN 104407779A
- Authority
- CN
- China
- Prior art keywords
- data content
- icon
- square
- template
- geometric ratio
- 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.)
- Granted
Links
- 238000000034 method Methods 0.000 title claims abstract description 41
- 230000013011 mating Effects 0.000 claims description 16
- 238000011161 development Methods 0.000 abstract description 12
- 238000005516 engineering process Methods 0.000 abstract description 2
- 238000013461 design Methods 0.000 description 8
- 239000002699 waste material Substances 0.000 description 6
- 230000008569 process Effects 0.000 description 5
- 238000010168 coupling process Methods 0.000 description 3
- 238000005859 coupling reaction Methods 0.000 description 3
- 230000006870 function Effects 0.000 description 3
- 230000009471 action Effects 0.000 description 2
- 238000006243 chemical reaction Methods 0.000 description 2
- 238000004891 communication Methods 0.000 description 2
- 230000008878 coupling Effects 0.000 description 2
- 238000012938 design process Methods 0.000 description 2
- 238000010586 diagram Methods 0.000 description 2
- 238000012545 processing Methods 0.000 description 2
- 230000006872 improvement Effects 0.000 description 1
- 238000004519 manufacturing process Methods 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
- 238000012360 testing method Methods 0.000 description 1
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0481—Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/14—Digital output to display device ; Cooperation and interconnection of the display device with other functional units
- G06F3/1423—Digital output to display device ; Cooperation and interconnection of the display device with other functional units controlling a plurality of local displays, e.g. CRT and flat panel display
- G06F3/1431—Digital output to display device ; Cooperation and interconnection of the display device with other functional units controlling a plurality of local displays, e.g. CRT and flat panel display using a single graphics controller
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Human Computer Interaction (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Computer Graphics (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本发明公开了一种图形界面的排列显示方法及装置。其中，该方法包括：读取屏幕的屏幕分辨率；根据屏幕分辨率对图形界面进行划分，生成排列网格；获取需要显示的数据内容集合；根据数据内容集合，获取与数据内容集合匹配的正方形等比排列模板，正方形等比排列模板用于表征在图形界面内，不同大小的正方形图标按预定的排列方式进行显示的排列显示方法；将数据内容集合按照正方形等比排列模板对数据内容以正方形图标的形式进行排列显示。本发明解决了现有中设计人员、技术人员、咨询人员以及界面使用用户需要针对每个前端界面进行重复开发，导致的开发效率低、浪费人力资源的问题。
Description
技术领域
本发明涉及计算机领域，具体而言，涉及一种图形界面的排列显示方法及装置。
背景技术
在日常的软件开发过程中，程序开发人员往往在对软件功能进行开发之后，还要对前端显示界面进行设计开发。在开发调试阶段，不但要对软件功能的可靠性进行测试，还要对前端界面的兼容性和美观度进行验证。
对于程序开发人员来说，前端显示界面的设计开发工作往往并不能得心应手，很难在保证前端显示界面兼容性的同时，还兼顾美观度。每次在对功能开发完毕之后，还要花费大量的时间和精力对前端显示界面进行重复的开发，造成了程序开发人员资源的浪费。
进一步的，如果在多个开发人员对同一个软件进行开发时，很难统一每个程序开发人员开发出来的前端显示界面的一致性。
就设计人员来说，创意的结果是多样的，从创意产生到最终的工程图样的呈现都是需要经过大量的尺度换算和设定。同时在设计中存在大量的定制和个性多元化的设计概念，这样在多平台设计当中增加了设计师的工作量。就咨询人员来说，需要大量将咨询结果转换为简单易懂的图形的绘图任务，处理图形界面的工作量非常庞大。就界面的使用用户来说，想要打造具有自己个性的操作界面的学习成本和实施成本都很高。
针对现有技术中设计人员、技术人员、咨询人员以及界面使用用户需要针对每个前端界面进行重复开发，导致的开发效率低、浪费人力资源的问题，目前尚未提出有效的解决方案。
发明内容
本发明的主要目的在于提供一种图形界面的排列显示方法及装置，以解决现有技术中设计人员、技术人员、咨询人员以及界面使用用户需要针对每个前端界面进行重复开发，导致的开发效率低、浪费人力资源的问题。
为了实现上述目的，根据本发明实施例的一个方面，提供了一种图形界面的排列显示方法。该方法包括：读取屏幕的屏幕分辨率；根据屏幕分辨率对图形界面进行划分，生成排列网格；获取需要显示的数据内容集合；根据数据内容集合，获取与数据内容集合匹配的正方形等比排列模板，正方形等比排列模板用于表征在图形界面内，不同大小的正方形图标按预定的排列方式进行显示的排列显示方法，其中，所述排列网格用于表征所述正方形等比模板中用于计算各个正方形图标边长的基本单位；将数据内容集合按照正方形等比排列模板对数据内容以正方形图标的形式进行排列显示。
为了实现上述目的，根据本发明实施例的另一方面，提供了一种图形界面的排列显示装置，该装置包括读取模块，用于读取屏幕的屏幕分辨率；生成模块，用于根据屏幕分辨率对图形界面进行划分，生成排列网格；第一获取模块，用于获取需要显示的数据内容集合；第二获取模块，用于根据数据内容集合，获取与数据内容集合匹配的正方形等比排列模板，正方形等比排列模板用于表征在图形界面内，不同大小的正方形图标按预定的排列方式进行显示的排列显示方法，其中，所述排列网格用于表征所述正方形等比模板中用于计算各个正方形图标边长的基本单位；显示模块，用于将数据内容集合按照正方形等比排列模板对数据内容以正方形图标的形式进行排列显示。
根据发明实施例，通过读取屏幕的屏幕分辨率；根据屏幕分辨率对图形界面进行划分，生成排列网格；获取需要显示的数据内容集合；根据数据内容集合，获取与数据内容集合匹配的正方形等比排列模板，正方形等比排列模板用于表征在图形界面内，不同大小的正方形图标按预定的排列方式进行显示的排列显示方法，其中，所述排列网格用于表征所述正方形等比模板中用于计算各个正方形图标边长的基本单位；将数据内容集合按照正方形等比排列模板对数据内容以正方形图标的形式进行排列显示，解决了现有技术中设计人员、技术人员、咨询人员以及界面使用用户需要针对每个前端界面进行重复开发，导致的开发效率低、浪费人力资源的问题。实现了根据需要显示的数据内容自动生成与数据内容匹配的图形界面的效果。
附图说明
构成本申请的一部分的附图用来提供对本发明的进一步理解，本发明的示意性实施例及其说明用于解释本发明，并不构成对本发明的不当限定。在附图中：
图1是根据本发明实施例一的图形界面的排列显示方法的流程图；
图2是根据本发明实施例二的图形界面的排列显示装置的结构示意图；以及
图3是根据本发明实施例二优选的图形界面的排列显示装置的结构示意图。
具体实施方式
需要说明的是，在不冲突的情况下，本申请中的实施例及实施例中的特征可以相互组合。下面将参考附图并结合实施例来详细说明本发明。
为了使本技术领域的人员更好地理解本发明方案，下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分的实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都应当属于本发明保护的范围。
需要说明的是，本发明的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象，而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换，以便这里描述的本发明的实施例。此外，术语“包括”和“具有”以及他们的任何变形，意图在于覆盖不排他的包含，例如，包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元，而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。
实施例1
本发明实施例提供了一种图形界面的排列显示方法。
图1是根据本发明实施例的图形界面的排列显示方法的流程图。如图1所示，该方法包括步骤如下：
步骤S11，读取屏幕的屏幕分辨率。
具体的，通过上述步骤S11，获取当前用于显示图形界面的屏幕的屏幕分辨率。
步骤S13，根据屏幕分辨率对图形界面进行划分，生成排列网格。
具体的，通过上述步骤S13，根据屏幕的屏幕分辨率，对图形界面以网状形式进行划分。将图形界面按照预定的间隔划分为若干个正方形区域，得到与屏幕分辨率对应的用于排列图标的排列网格。
在实际应用当中，常用的屏幕分辨率，以及屏幕比例只有几种。可以预先根据屏幕的分辨率设置与屏幕分辨率对应的排列网格划分的方案，以提高图形界面在各种屏幕分辨率的屏幕上都能得到很好的显示效果。
步骤S15，获取需要显示的数据内容集合。
具体的，通过上述步骤S15，获取需要通过图形界面进行显示的数据内容集合，通过数据内容集合可以确定需要显示的内容数量，以及需要进行显示的数据内容。
步骤S17，根据数据内容集合，获取与数据内容集合匹配的正方形等比排列模板，正方形等比排列模板用于表征在图形界面内，不同大小的正方形图标按预定的排列方式进行显示的排列显示方法，其中，所述排列网格用于表征所述正方形等比模板中用于计算各个正方形图标边长的基本单位。
具体的，通过上述步骤S17，将预先设置的正方形等比排列模板与由数据内容集合确定的需要显示的内容数量进行匹配，得到与数据内容集合匹配的正方形等比排列模板。正方形等比排列模板中的各个正方形图标的边长都设定为排列网格的基本单位的整数倍，故需要通过排列网格的基本单位计算得到正方形等比排列模板中，各个图标在显示界面内的具体显示位置和大小。
在实际应用当中，可以根据需要显示的内容数量，预先设置不同的正方形等比排列模板。以针对需要对不同数量的内容数据进行显示的情况提供不同的显示方式，从而实现更好地显示效果。
步骤S19，将数据内容集合按照正方形等比排列模板对数据内容以正方形图标的形式进行排列显示。
具体的，上述步骤S19，将数据内容中的数据，按照经过匹配得到的正方形等比排列模板进行显示。
通过上述步骤S11至步骤S19，首先根据不同屏幕的屏幕分辨率，对图形界面进行划分，划分为与屏幕分辨率对应的用于排列图标的排列网格。然后，将预先设置的正方形等比排列模板与数据内容集合的属性信息进行匹配，得到适用于数据内容集合的正方形等比排列模板，最后，将数据内容集合中的各个需要显示的数据内容依照划分的排列网格，按照正方形等比排列模板提供图标位置进行显示。
在实际应用当中，程序开发人员仅仅需要确定在图形界面显示的数据内容，本方法就可以根据屏幕的屏幕分辨率和需要显示的内容获取一套使用的正方形等比排列模板。将数据内容以不同大小的正方形图标的形式进行显示。
综上可知，本发明解决了现有技术中设计人员、技术人员、咨询人员以及界面使用用户需要针对每个前端界面进行重复开发，导致的开发效率低、浪费人力资源的问题，实现了根据需要显示的数据内容自动生成与数据内容匹配的图形界面的效果。
优选的，本申请上述实施例中，在步骤S13根据屏幕分辨率对图形界面进行划分，生成排列网格中，步骤可以包括：
步骤S131，根据屏幕分辨率，确定用于划分图形界面的基本单位a。
步骤S133，按照基本单位a对图形界面进行划分，将图形界面划分为由正方形组成的排列网格，其中，正方形边长为基本单位a。
具体的，上述步骤S131至步骤S133，通过屏幕分辨率确认适用于当前屏幕分辨率的用于划分图形界面的基本单位a。对图形界面按照基本单位a分别进行横向和纵向的划分，将图形界面划分为由边长为a的正方形组成的排列网格。根据屏幕分辨率确定基本单位a的具体步骤可以是：根据分辨率确定屏幕的横向、纵向像素数，进而根据横向、纵向像素数对图形界面进行划分，横向得到边长为a个像素点的数个正方形，纵向得到边长为a个像素点的数个正方形。
在实际应用当中，可以通过对图形界面划分的排列网格，确定每个正方形图标的位置。在对正方形等比排列模板的设计过程中，只需要确定各个图标在排列网格中的相对位置即可，不需要再针对每种屏幕分辨率设计单独的显示模板或者调节模板中的各个图标在屏幕中的绝对位置。
优选的，本申请上述实施例中，在数据内容集合至少包括：数据内容和与数据内容对应的预设图标属性的情况下，步骤S17根据数据内容集合，获取与数据内容集合匹配的正方形等比排列模板中，步骤可以包括：
步骤S171，根据数据内容集合，确定数据内容集合包含的数据内容的数量。
步骤S173，将数据内容的数量与正方形等比排列模板定义的正方形图标的显示数量进行匹配，得到与数据内容集合匹配的正方形等比排列模板。
步骤S175，将数据内容的预设图标属性分别与正方形等比排列模板中预设的图标属性进行匹配，得到数据内容在正方形等比排列模板中的显示位置。
具体的，通过上述步骤S171至步骤S175，将获取到的数据内容集合进行分析，得到数据内容集合中包含的数据内容的数量。通过正方形等比排列模板定义的正方形图标的显示数量与数据内容集合所包含的数据内容的数量进行匹配，确定与数据内容集合匹配的正方形等比排列模板。将数据内容集合中预先对数据内容设置的图标属性与该正方形等比排列模板中各个位置图标的属性进行匹配，从而确定数据内容集合中各个数据内容在正方形等比排列模板中的显示位置。
在实际应用当中，数据内容集合中包含的内容数量是随机的，很难针对每种情况设计一套独有的正方形等比排列模板。所以，可以在设置正方形等比排列模板的时候，为每个正方形等比排列模板设置一个适用内容数量的适用区间，从而扩大每种模板的适用范围。
以数据内容集合中由四个需要显示的数据内容，并且预设图标属性是预先设置的预设图标边长为例进行说明。首先确定数据内容集合中的数据内容的数量为四。然后获取适用区间包含四个的正方形等比排列模板。最后，按照预设图标属性中预先设置的预设图标边长与正方形等比排列模板中的正方形图标的边长进行匹配，得到预设图标边长与正方形等比排列模板中图标边长的匹配结果。当然，预设图标属性还可以是数据内容的显示优先级等。
优选的，本申请上述实施例中，在步骤S11读取屏幕的屏幕分辨率之前，方法还包括：
步骤S10，设定正方形等比排列模板，正方形等比排列模板用于确定正方形图标的显示位置和正方形图标的图标大小。
具体的，通过上述步骤S10，针对需要显示的内容数量，预先设置不同的正方形等比排列模板。正方形等比排列模板中规定了各个图标的显示位置和图标的显示大小。
优选的，本申请上述实施例中，在步骤S10设定正方形等比排列模板中，步骤可以包括：
步骤S101，设定正方形图标间的图标间距为a。
步骤S103，设定正方形图标中用于定义初始位置的初始图标的边长为a*n，其中，n为正整数。
步骤S105，设定正方形图标用于显示数据内容的正方形的显示图标的边长为a*n’，其中，n’为正整数。
步骤S107，根据初始图标的边长、显示图标的边长和图标间距，设定正方形图标的排列位置。
具体的，通过上述步骤S101至步骤S107，对设定正方形等比排列模板的步骤进行说明。首先，将正方形图标间的图标间距设置为a，其中，a是基本单位，a与屏幕分辨率相对应。然后，确定在图形界面中的初始正方形图标的位置和大小。根据初始正方形图标的位置和大小，在初始正方形图标的周围，依次设定若干个正方形的显示图标，这些图标的边长都为a的整数倍。最后，根据上述初始图标的大小和显示图标的大小，设定各个正方形图标的相对位置。
在实际应用当中，通过将边长设置为基本单位a的这种方法，可以方便模板设计人员对模板中各个图标的位置进行定位，不用为了保证图标在不同屏幕分辨率的屏幕上显示的准确性，需要确定在每种屏幕上图标的具体坐标值。
实施例2
本发明实施例还提供了一种图形界面的排列显示装置，如图2所示，该装置可以包括：读取模块21、生成模块23、第一获取模块25、第二获取模块27和显示模块29。
其中，读取模块21，用于读取屏幕的屏幕分辨率。
具体的，通过上述读取模块21，获取当前用于显示图形界面的屏幕的屏幕分辨率。
生成模块23，用于根据屏幕分辨率对图形界面进行划分，生成排列网格。
具体的，通过上述生成模块23，根据屏幕的屏幕分辨率，对图形界面以网状形式进行划分。将图形界面按照预定的间隔划分为若干个正方形区域，得到与屏幕分辨率对应的用于排列图标的排列网格。
在实际应用当中，常用的屏幕分辨率，以及屏幕比例只有几种。可以预先根据屏幕的分辨率设置与屏幕分辨率对应的排列网格划分的方案，以提高图形界面在各种屏幕分辨率的屏幕上都能得到很好的显示效果。
第一获取模块25，用于获取需要显示的数据内容集合。
具体的，通过上述第一获取模块25，获取需要通过图形界面进行显示的数据内容集合，通过数据内容集合可以确定需要显示的内容数量，以及需要进行显示的数据内容。
第二获取模块27，用于根据数据内容集合，获取与数据内容集合匹配的正方形等比排列模板，正方形等比排列模板用于表征在图形界面内，不同大小的正方形图标按预定的排列方式进行显示的排列显示方法，其中，所述排列网格用于表征所述正方形等比模板中用于计算各个正方形图标边长的基本单位。
具体的，通过上述第二获取模块27，将预先设置的正方形等比排列模板与由数据内容集合确定的需要显示的内容数量进行匹配，得到与数据内容集合匹配的正方形等比排列模板。正方形等比排列模板中的各个正方形图标的边长都设定为排列网格的基本单位的整数倍，故需要通过排列网格的基本单位计算得到正方形等比排列模板中，各个图标在显示界面内的具体显示位置和大小。
在实际应用当中，可以根据需要显示的内容数量，预先设置不同的正方形等比排列模板。以针对需要对同数量的内容数据进行显示的情况提供不同的显示方式，从而实现更好地显示效果。
显示模块29，用于将数据内容集合按照正方形等比排列模板对数据内容以正方形图标的形式进行排列显示。
具体的，上述显示模块29，将数据内容中的数据，按照经过匹配得到的正方形等比排列模板进行显示。
通过上述读取模块21、生成模块23、第一获取模块25、第二获取模块27和显示模块29，首先根据不同屏幕的屏幕分辨率，对图形界面进行划分，划分为与屏幕分辨率对应的用于排列图标的排列网格。然后，将预先设置的正方形等比排列模板与数据内容集合的属性信息进行匹配，得到适用于数据内容集合的正方形等比排列模板，最后，将数据内容集合中的各个需要显示的数据内容依照划分的排列网格，按照正方形等比排列模板提供图标位置进行显示。
在实际应用当中，程序开发人员仅仅需要确定在图形界面显示的数据内容，本方法就可以根据屏幕的屏幕分辨率和需要显示的内容获取一套使用的正方形等比排列模板。将数据内容以不同大小的正方形图标的形式进行显示。
综上可知，本发明解决了现有技术中设计人员、技术人员、咨询人员以及界面使用用户需要针对每个前端界面进行重复开发，导致的开发效率低、浪费人力资源的问题，实现了根据需要显示的数据内容自动生成与数据内容匹配的图形界面的效果。
优选的，本申请上述实施例中，生成模块23包括：第一子确定模块231和子生成模块233。
其中，第一子确定模块231，用于根据屏幕分辨率，确定用于划分图形界面的基本单位a。
子生成模块233，用于按照基本单位a对图形界面进行划分，将图形界面划分为由正方形组成的排列网格，其中，正方形边长为基本单位a。
具体的，上述第一子确定模块231和子生成模块233，通过屏幕分辨率确认适用于当前屏幕分辨率的用于划分图形界面的基本单位a。对图形界面按照基本单位a分别进行横向和纵向的划分，将图形界面划分为由边长为a的正方形组成的排列网格。根据屏幕分辨率确定基本单位a的具体步骤可以是：根据分辨率确定屏幕的横向、纵向像素数，进而根据横向、纵向像素数对图形界面进行划分，横向得到边长为a个像素点的数个正方形，纵向得到边长为a个像素点的数个正方形。
在实际应用当中，可以通过对图形界面划分的排列网格，确定每个正方形图标的位置。在对正方形等比排列模板的设计过程中，只需要确定各个图标在排列网格中的相对位置即可，不需要再针对每种屏幕分辨率设计单独的显示模板或者调节模板中的各个图标在屏幕中的绝对位置。
优选的，本申请上述实施例中，第二获取模块27包括：第二子确定模块271、第一子匹配模块273和第二子匹配模块275。
其中，第二子确定模块271，用于根据数据内容集合，确定数据内容集合包含的数据内容的数量，其中，数据内容集合至少包括：数据内容和与数据内容对应的预设图标属性。
第一子匹配模块273，用于将数据内容的数量与正方形等比排列模板定义的正方形图标的显示数量进行匹配，得到与数据内容集合匹配的正方形等比排列模板。
第二子匹配模块275，用于将数据内容的预设图标属性分别与正方形等比排列模板中预设的图标属性进行匹配，得到数据内容在正方形等比排列模板中的显示位置。
具体的，通过上述第二子确定模块271、第一子匹配模块273和第二子匹配模块275，将获取到的数据内容集合进行分析，得到数据内容集合中包含的数据内容的数量。通过正方形等比排列模板定义的正方形图标的显示数量与数据内容集合所包含的数据内容的数量进行匹配，确定与数据内容集合匹配的正方形等比排列模板。将数据内容集合中预先对数据内容设置的图标属性与该正方形等比排列模板中各个位置图标的属性进行匹配，从而确定数据内容集合中各个数据内容在正方形等比排列模板中的显示位置。
在实际应用当中，数据内容集合中包含的内容数量时随机的，很难针对每种情况设计一套独有的正方形等比排列模板。所以，可以在设置正方形等比排列模板的时候，为每个正方形等比排列模板设置一个适用内容数量的适用区间，从而扩大每种模板的适用范围。
以数据内容集合中由四个需要显示的数据内容，并且预设图标属性是预先设置的预设图标边长为例进行说明。首先确定数据内容集合中的数据内容的数量为四。然后获取适用区间包含四个的正方形等比排列模板。最后，按照预设图标属性中预先设置的预设图标边长与正方形等比排列模板中的正方形图标的边长进行匹配，得到预设图标边长与正方形等比排列模板中图标边长的匹配结果。当然，预设图标属性还可以是数据内容的显示优先级等。
优选的，本申请上述实施例中，如图3所述，装置还包括：设定模块20。
其中，设定模块20，用于设定正方形等比排列模板，正方形等比排列模板用于确定正方形图标的显示位置和正方形图标的图标大小。
具体的，通过上述设定模块20，针对需要显示的内容数量，预先设置不同的正方形等比排列模板。正方形等比排列模板中规定了各个图标的显示位置和图标的显示大小。
优选的，本申请上述实施例中，设定模块20包括：第一子设定模块201、第二子设定模块203、第三子设定模块205和第四子设定模块207。
其中，第一子设定模块201，用于设定正方形图标间的图标间距为a。
第二子设定模块203，用于设定正方形图标中用于定义初始位置的初始图标的边长为a*n，其中，n为正整数。
第三子设定模块205，用于设定正方形图标用于显示数据内容的正方形的显示图标的边长为a*n’，其中，n’为正整数。
第四子设定模块207，用于根据初始图标的边长、显示图标的边长和图标间距，设定正方形图标的排列位置。
具体的，通过上述第一子设定模块201、第二子设定模块203、第三子设定模块205和第四子设定模块207，对设定正方形比例排列模板的步骤进行说明。。首先，将正方形图标间的图标间距设置为a，其中，a是基本单位，a与屏幕分辨率相对应。然后，确定在图形界面中的初始正方形图标的位置和大小。根据初始正方形图标的位置和大小，在初始正方形图标的周围，依次设定若干个正方形的显示图标，这些图标的边长都为a的整数倍。最后，根据上述初始图标的大小和显示图标的大小，设定各个正方形图标的相对位置。
在实际应用当中，通过将边长设置为基本单位a的这种方法，可以方便模板设计人员对模板中各个图标的位置进行定位，不用为了保证图标在不同屏幕分辨率的屏幕上显示的准确性，需要确定在每种屏幕上图标的具体坐标值。
需要说明的是，对于前述的各方法实施例，为了简单描述，故将其都表述为一系列的动作组合，但是本领域技术人员应该知悉，本发明并不受所描述的动作顺序的限制，因为依据本发明，某些步骤可以采用其他顺序或者同时进行。其次，本领域技术人员也应该知悉，说明书中所描述的实施例均属于优选实施例，所涉及的动作和模块并不一定是本发明所必须的。
在上述实施例中，对各个实施例的描述都各有侧重，某个实施例中没有详述的部分，可以参见其他实施例的相关描述。
在本申请所提供的几个实施例中，应该理解到，所揭露的装置，可通过其它的方式实现。例如，以上所描述的装置实施例仅仅是示意性的，例如所述单元的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，例如多个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另一点，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口，装置或单元的间接耦合或通信连接，可以是电性或其它的形式。
所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。
另外，在本发明各个实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现，也可以采用软件功能单元的形式实现。
所述集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读取存储介质中。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括若干指令用以使得一台计算机设备(可为个人计算机、移动终端、服务器或者网络设备等)执行本发明各个实施例所述方法的全部或部分步骤。而前述的存储介质包括：U盘、只读存储器(ROM，Read-Only Memory)、随机存取存储器(RAM，Random Access Memory)、移动硬盘、磁碟或者光盘等各种可以存储程序代码的介质。
以上所述仅为本发明的优选实施例而已，并不用于限制本发明，对于本领域的技术人员来说，本发明可以有各种更改和变化。凡在本发明的精神和原则之内，所作的任何修改、等同替换、改进等，均应包含在本发明的保护范围之内。
Claims (10)
1.一种图形界面的排列显示方法，其特征在于，包括：
读取屏幕的屏幕分辨率；
根据所述屏幕分辨率对所述图形界面进行划分，生成排列网格；
获取需要显示的数据内容集合；
根据所述数据内容集合，获取与所述数据内容集合匹配的正方形等比排列模板，所述正方形等比排列模板用于表征在图形界面内，不同大小的正方形图标按预定的排列方式进行显示的排列显示方法，其中，所述排列网格用于表征所述正方形等比模板中用于计算各个正方形图标边长的基本单位；
将所述数据内容集合按照所述正方形等比排列模板对数据内容以正方形图标的形式进行排列显示。
2.根据权利要求1所述的方法，其特征在于，根据所述屏幕分辨率对所述图形界面进行划分，生成排列网格的步骤包括：
根据所述屏幕分辨率，确定用于划分所述图形界面的基本单位a；
按照所述基本单位a对所述图形界面进行划分，将所述图形界面划分为由正方形组成的所述排列网格，其中，所述正方形边长为所述基本单位a。
3.根据权利要求2所述的方法，其特征在于，所述数据内容集合至少包括：所述数据内容和与所述数据内容对应的预设图标属性，其中，根据所述数据内容集合，获取与所述数据内容集合匹配的正方形等比排列模板的步骤包括：
根据所述数据内容集合，确定所述数据内容集合包含的所述数据内容的数量；
将所述数据内容的数量与所述正方形等比排列模板定义的所述正方形图标的显示数量进行匹配，得到与所述数据内容集合匹配的正方形等比排列模板；
将所述数据内容的所述预设图标属性分别与所述正方形等比排列模板中预设的图标属性进行匹配，得到所述数据内容在所述正方形等比排列模板中的显示位置。
4.根据权利要求2所述的方法，其特征在于，在所述读取屏幕的屏幕分辨率之前，所述方法还包括：
设定所述正方形等比排列模板，所述正方形等比排列模板用于确定所述正方形图标的显示位置和所述正方形图标的图标大小。
5.根据权利要求4所述的方法，其特征在于，所述设定所述正方形等比排列模板的步骤包括：
设定所述正方形图标间的图标间距为a；
设定所述正方形图标中用于定义初始位置的初始图标的边长为a*n，其中，所述n为正整数；
设定所述正方形图标用于显示数据内容的正方形的显示图标的边长为a*n’，其中，所述n’为正整数；
根据所述初始图标的边长、所述显示图标的边长和所述图标间距，设定所述正方形图标的排列位置。
6.一种图形界面的排列显示装置，其特征在于，所述装置包括：
读取模块，用于读取屏幕的屏幕分辨率；
生成模块，用于根据所述屏幕分辨率对所述图形界面进行划分，生成排列网格；
第一获取模块，用于获取需要显示的数据内容集合；
第二获取模块，用于根据所述数据内容集合，获取与所述数据内容集合匹配的正方形等比排列模板，所述正方形等比排列模板用于表征在图形界面内，不同大小的正方形图标按预定的排列方式进行显示的排列显示方法，其中，所述排列网格用于表征所述正方形等比模板中用于计算各个正方形图标边长的基本单位；
显示模块，用于将所述数据内容集合按照所述正方形等比排列模板对数据内容以正方形图标的形式行排列显示。
7.根据权利要求6所述的装置，其特征在于，所述生成模块包括：
第一子确定模块，用于根据所述屏幕分辨率，确定用于划分所述图形界面的基本单位a；
子生成模块，用于按照所述基本单位a对所述图形界面进行划分，将所述图形界面划分为由正方形组成的所述排列网格，其中，所述正方形边长为所述基本单位a。
8.根据权利要求7所述的装置，其特征在于，所述第二获取模块包括：
第二子确定模块，用于根据所述数据内容集合，确定所述数据内容集合包含的所述数据内容的数量，其中，所述数据内容集合至少包括：所述数据内容和与所述数据内容对应的预设图标属性；
第一子匹配模块，用于将所述数据内容的数量与所述正方形等比排列模板定义的所述正方形图标的显示数量进行匹配，得到与所述数据内容集合匹配的正方形等比排列模板；
第二子匹配模块，用于将所述数据内容的所述预设图标属性分别与所述正方形等比排列模板中预设的图标属性进行匹配，得到所述数据内容在所述正方形等比排列模板中的显示位置。
9.根据权利要求7所述的装置，其特征在于，所述装置还包括：
设定模块，用于设定所述正方形等比排列模板，所述正方形等比排列模板用于确定所述正方形图标的显示位置和所述正方形图标的图标大小。
10.根据权利要求9所述的装置，其特征在于，所述设定模块包括：
第一子设定模块，用于设定所述正方形图标间的图标间距为a；
第二子设定模块，用于设定所述正方形图标中用于定义初始位置的初始图标的边长为a*n，其中，所述n为正整数；
第三子设定模块，用于设定所述正方形图标用于显示数据内容的正方形的显示图标的边长为a*n’，其中，所述n’为正整数；
第四子设定模块，用于根据所述初始图标的边长、所述显示图标的边长和所述图标间距，设定所述正方形图标的排列位置。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201410779533.4A CN104407779B (zh) | 2014-12-15 | 2014-12-15 | 图形界面的排列显示方法及装置 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201410779533.4A CN104407779B (zh) | 2014-12-15 | 2014-12-15 | 图形界面的排列显示方法及装置 |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN104407779A true CN104407779A (zh) | 2015-03-11 |
| CN104407779B CN104407779B (zh) | 2019-01-08 |
Family
ID=52645414
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201410779533.4A Active CN104407779B (zh) | 2014-12-15 | 2014-12-15 | 图形界面的排列显示方法及装置 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN104407779B (zh) |
Cited By (10)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN106507214A (zh) * | 2016-11-25 | 2017-03-15 | 山东浪潮商用系统有限公司 | 一种维护电视首页的方法、装置及机顶盒 |
| WO2018040613A1 (zh) * | 2016-08-31 | 2018-03-08 | 中兴通讯股份有限公司 | 一种终端界面的图标显示方法及装置 |
| CN109298808A (zh) * | 2018-07-02 | 2019-02-01 | 链家网（北京）科技有限公司 | 一种实现icon图标在终端合理展示的方法及服务器 |
| CN110007818A (zh) * | 2019-03-04 | 2019-07-12 | 深圳威尔视觉传媒有限公司 | 一种单机屏幕资源布局方法和相关装置 |
| CN110460887A (zh) * | 2019-08-15 | 2019-11-15 | 苏州三星电子电脑有限公司 | 多屏幕组合方法及其控制设备 |
| CN110874217A (zh) * | 2019-11-18 | 2020-03-10 | 北京小米移动软件有限公司 | 快应用的界面显示方法、装置及存储介质 |
| CN112527167A (zh) * | 2020-12-18 | 2021-03-19 | 深圳市元征科技股份有限公司 | 一种图标显示方法、装置、设备及介质 |
| CN113139371A (zh) * | 2021-04-06 | 2021-07-20 | 青岛以萨数据技术有限公司 | 一种可视化图表构建方法、装置、系统及存储介质 |
| CN113504861A (zh) * | 2021-07-29 | 2021-10-15 | 统信软件技术有限公司 | 一种桌面管理方法、装置及计算设备 |
| CN115221452A (zh) * | 2022-09-19 | 2022-10-21 | 广东省信息工程有限公司 | 基于可视化配置的门户构建方法、系统、电子设备及介质 |
Citations (7)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102420968A (zh) * | 2011-12-15 | 2012-04-18 | 广东威创视讯科技股份有限公司 | 视频会议中显示视频窗口的方法及系统 |
| CN102945144A (zh) * | 2012-10-08 | 2013-02-27 | 广东威创视讯科技股份有限公司 | 窗口布局的方法及装置 |
| CN103064583A (zh) * | 2012-12-20 | 2013-04-24 | 北京小米科技有限责任公司 | 显示块排列方法、显示块切换方法及移动终端 |
| CN103530052A (zh) * | 2013-09-27 | 2014-01-22 | 华为技术有限公司 | 一种界面内容的显示方法和用户设备 |
| CN103941958A (zh) * | 2013-01-23 | 2014-07-23 | 腾讯科技（深圳）有限公司 | 一种桌面管理的方法及终端设备 |
| CN104007991A (zh) * | 2014-06-06 | 2014-08-27 | 百度在线网络技术（北京）有限公司 | 应用程序界面布局调整方法和装置 |
| US20140304632A1 (en) * | 2013-04-04 | 2014-10-09 | Pantech Co., Ltd. | Smart device for convenient graphic object arrangement and method of graphic object arrangement |
-
2014
- 2014-12-15 CN CN201410779533.4A patent/CN104407779B/zh active Active
Patent Citations (7)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102420968A (zh) * | 2011-12-15 | 2012-04-18 | 广东威创视讯科技股份有限公司 | 视频会议中显示视频窗口的方法及系统 |
| CN102945144A (zh) * | 2012-10-08 | 2013-02-27 | 广东威创视讯科技股份有限公司 | 窗口布局的方法及装置 |
| CN103064583A (zh) * | 2012-12-20 | 2013-04-24 | 北京小米科技有限责任公司 | 显示块排列方法、显示块切换方法及移动终端 |
| CN103941958A (zh) * | 2013-01-23 | 2014-07-23 | 腾讯科技（深圳）有限公司 | 一种桌面管理的方法及终端设备 |
| US20140304632A1 (en) * | 2013-04-04 | 2014-10-09 | Pantech Co., Ltd. | Smart device for convenient graphic object arrangement and method of graphic object arrangement |
| CN103530052A (zh) * | 2013-09-27 | 2014-01-22 | 华为技术有限公司 | 一种界面内容的显示方法和用户设备 |
| CN104007991A (zh) * | 2014-06-06 | 2014-08-27 | 百度在线网络技术（北京）有限公司 | 应用程序界面布局调整方法和装置 |
Cited By (14)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| WO2018040613A1 (zh) * | 2016-08-31 | 2018-03-08 | 中兴通讯股份有限公司 | 一种终端界面的图标显示方法及装置 |
| CN107797799A (zh) * | 2016-08-31 | 2018-03-13 | 中兴通讯股份有限公司 | 一种终端界面的图标显示方法及装置 |
| CN106507214A (zh) * | 2016-11-25 | 2017-03-15 | 山东浪潮商用系统有限公司 | 一种维护电视首页的方法、装置及机顶盒 |
| CN109298808A (zh) * | 2018-07-02 | 2019-02-01 | 链家网（北京）科技有限公司 | 一种实现icon图标在终端合理展示的方法及服务器 |
| CN110007818B (zh) * | 2019-03-04 | 2022-08-12 | 深圳威尔视觉科技有限公司 | 一种单机屏幕资源布局方法和相关装置 |
| CN110007818A (zh) * | 2019-03-04 | 2019-07-12 | 深圳威尔视觉传媒有限公司 | 一种单机屏幕资源布局方法和相关装置 |
| CN110460887A (zh) * | 2019-08-15 | 2019-11-15 | 苏州三星电子电脑有限公司 | 多屏幕组合方法及其控制设备 |
| CN110874217A (zh) * | 2019-11-18 | 2020-03-10 | 北京小米移动软件有限公司 | 快应用的界面显示方法、装置及存储介质 |
| CN110874217B (zh) * | 2019-11-18 | 2023-08-15 | 北京小米移动软件有限公司 | 快应用的界面显示方法、装置及存储介质 |
| CN112527167A (zh) * | 2020-12-18 | 2021-03-19 | 深圳市元征科技股份有限公司 | 一种图标显示方法、装置、设备及介质 |
| CN113139371A (zh) * | 2021-04-06 | 2021-07-20 | 青岛以萨数据技术有限公司 | 一种可视化图表构建方法、装置、系统及存储介质 |
| CN113504861A (zh) * | 2021-07-29 | 2021-10-15 | 统信软件技术有限公司 | 一种桌面管理方法、装置及计算设备 |
| CN113504861B (zh) * | 2021-07-29 | 2024-07-12 | 统信软件技术有限公司 | 一种桌面管理方法、装置及计算设备 |
| CN115221452A (zh) * | 2022-09-19 | 2022-10-21 | 广东省信息工程有限公司 | 基于可视化配置的门户构建方法、系统、电子设备及介质 |
Also Published As
| Publication number | Publication date |
|---|---|
| CN104407779B (zh) | 2019-01-08 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN104407779A (zh) | 图形界面的排列显示方法及装置 | |
| Walny et al. | Data changes everything: Challenges and opportunities in data visualization design handoff | |
| CN106557314A (zh) | 应用软件开发方法及装置 | |
| Karasneh et al. | Extracting UML models from images | |
| CN108170425B (zh) | 一种程序代码的修改方法、修改装置及终端设备 | |
| Silva et al. | A Goal Oriented Approach to Identify and Configure Feature Models for Software Product Lines. | |
| Tehrani et al. | Heuristic evaluation for Virtual Museum on smartphone | |
| CN104484093A (zh) | 图形界面的排列显示方法及装置 | |
| CN104461547A (zh) | 图形界面的排列显示方法及装置 | |
| Conversy | Unifying textual and visual: A theoretical account of the visual perception of programming languages | |
| CN115495069A (zh) | 基于模型驱动的煤炭工业软件流程实现方法、装置及设备 | |
| CN105653441B (zh) | 一种ui遍历测试方法与系统 | |
| CN108446262A (zh) | 一种表单生成、分析方法及装置 | |
| Baulé et al. | Automatic code generation from sketches of mobile applications in end-user development using Deep Learning | |
| Ledermann et al. | Mapmap. js: a data-driven web mapping API for thematic cartography | |
| CN106528115A (zh) | 界面的可视化开发方法及装置 | |
| Gabillon et al. | Designing an adaptive user interface according to software product line engineering | |
| CN104461249A (zh) | 图形界面的排列显示方法及装置 | |
| CN104461549A (zh) | 图形界面的排列显示方法及装置 | |
| US10846061B2 (en) | Development environment for real-time application development | |
| Leal et al. | Eshu: An extensible web editor for diagrammatic languages | |
| Wimmer et al. | SketchingInterfaces: a tool for automatically generating high-fidelity user interface mockups from hand-drawn sketches | |
| US20190266265A1 (en) | Integrated computing environment for managing and presenting design iterations | |
| US9372844B2 (en) | Automatically generating a business process flow GUI using a symbolic annotation language | |
| CN114691116A (zh) | 实现3d饼图的方法、系统、设备及可读存储介质 |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| C06 | Publication | ||
| PB01 | Publication | ||
| C10 | Entry into substantive examination | ||
| 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 |
Denomination of invention: Graphical interface arrangement display method and graphical interface arrangement display device Effective date of registration: 20190531 Granted publication date: 20190108 Pledgee: Shenzhen Black Horse World Investment Consulting Co.,Ltd. Pledgor: BEIJING GRIDSUM TECHNOLOGY Co.,Ltd. Registration number: 2019990000503 |
|
| PE01 | Entry into force of the registration of the contract for pledge of patent right | ||
| 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 GRIDSUM TECHNOLOGY Co.,Ltd. Address before: 100086 Beijing city Haidian District Shuangyushu Area No. 76 Zhichun Road cuigongfandian 8 layer A Patentee before: BEIJING GRIDSUM TECHNOLOGY Co.,Ltd. |
|
| CP02 | Change in the address of a patent holder | ||
| PP01 | Preservation of patent right |
Effective date of registration: 20240604 Granted publication date: 20190108 |
|
| PP01 | Preservation of patent right |