CN112631582A - 一种软件界面实体设计方法、装置、终端及存储介质 - Google Patents
一种软件界面实体设计方法、装置、终端及存储介质 Download PDFInfo
- Publication number
- CN112631582A CN112631582A CN201910955939.6A CN201910955939A CN112631582A CN 112631582 A CN112631582 A CN 112631582A CN 201910955939 A CN201910955939 A CN 201910955939A CN 112631582 A CN112631582 A CN 112631582A
- Authority
- CN
- China
- Prior art keywords
- entity
- plane
- entities
- rectangular
- actual
- 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/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)
- Human Computer Interaction (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Stored Programmes (AREA)
Abstract
本发明实施例提供一种软件界面布局方法、装置、终端及存储介质,通过根据给定平面上的各实体的相对位置确定切分边,平面由预设尺寸的矩形单元组成,实体占据的区域为矩形;根据一个切分方向上的所有切分边对平面进行切分,得到各组;根据各组平面的切分边进行切分,直到组内不存在切分边;对组内的实体进行尺寸还原,还原到实际视图;在一些实施过程中,根据操作平面上的实体相对位置就可以生成出一个合理的树状分组结构,而无需其他任何配置信息,为下游对这些实体的进一步处理提供便利,通过分组后的实体还原出能够适配多种多样物理尺寸的布局,大大减少人工适配多种多样物理尺寸的重复性工作,提升效率,降低技能要求。
Description
技术领域
本发明实施例涉及但不限于软件技术领域,具体而言,涉及但不限于一种软件界面实体设计方法、装置、终端及存储介质。
背景技术
随着软件技术的不断发展,使用软件开发出一些工具来替代、辅助人工工作的场景越来越多,这些工具大多数都具有所见即所得的特点,因而这里将这类工具称为可视化开发工具,可视化开发工具可以将原需要人工参与的抽象过程转为形象的过程。此类工具形象化的手段,多数是使用一些矩形来代表被操作的实体,并将这些代表实体的矩形平铺在一个平面上,工具使用者通过这个平面可以方便的操作一个或者多个实体。
一个典型的例子是软件界面的开发过程,传统人工是通过一行行代码来描述界面,这是一个极其抽象过程,而可视化开发工具则提供了一个与实际效果几乎一致的平面,人工通过点、拖、拽等鼠标动作来完成软件界面的开发。而可视化开发工具需要将这些平铺在平面上的实体(控件)正确的归类后,才能辅助人工生成出合适的代码;
在相关技术中,传统开发软件界面的方法是通过一行行代码来描述界面,一方面这很抽象,另一方面这需要相当的专业知识与技能,一名开发人员需要通过较长时间的学习与试错之后,才能适应这样的抽象的开发过程,才能掌握相关的知识与技能,存在专业的软件界面开发所需的技能门槛过高与大多数有需要参与这些界面开发的人员不具备相关技能之间的矛盾,进而这些界面开发的人员无法完成软件界面布局。
发明内容
本发明实施例提供的一种软件界面实体设计方法、装置、终端及存储介质,主要解决的技术问题是相关技术中的存在专业的软件界面开发所需的技能门槛过高,与大多数有需要参与这些界面开发的人员不具备相关技能之间的矛盾,进而这些界面开发的人员无法完成软件界面布局。
为解决上述技术问题,本发明实施例提供一种软件界面实体设计方法,包括:
根据当前操作平面上的各实体的相对位置确定切分边,操作平面由预设尺寸的矩形单元组成,实体占据的区域为矩形;
根据一个切分方向上的所有切分边对操作平面进行切分,得到各子平面;
根据各子平面的切分边再对各子平面进行切分,直到子平面不存在切分边;对给定平面的实体进行尺寸还原,还原到实际视图。
本发明实施例还提供一种装置,包括确定模块、分组模块和还原模块;
确定模块,用于根据当前操作平面上的各实体的相对位置确定切分边,操作平面由预设尺寸的矩形单元组成,实体占据的区域为矩形;
分组模块,用于根据一个切分方向上的所有切分边对操作平面进行切分,得到各子平面;还用于根据各子平面的切分边再对各子平面进行切分,直到子平面不存在切分边;
还原模块,用于对给定平面的实体进行尺寸还原,还原到实际视图
本发明实施例还提供一种终端,终端包括处理器、存储器及通信总线;
通信总线用于实现处理器和存储器之间的连接通信;
处理器用于执行存储器中存储的一个或者多个程序,以实现如权利要求1至10任一项软件界面实体设计方法的步骤
本发明实施例还提供一种存储介质,存储介质存储有一个或者多个程序,一个或者多个程序可被一个或者多个处理器执行,以实现如上软件界面实体设计方法的步骤。
本发明的有益效果是:
本发明实施例提供一种软件界面实体设计方法、装置、终端及存储介质,通过根据给定平面上的各实体的相对位置确定切分边,平面由预设尺寸的矩形单元组成,实体占据的区域为矩形;根据一个切分方向上的所有切分边对平面进行切分,得到各组;根据各组平面的切分边进行切分,直到组内不存在切分边;对组内的实体进行尺寸还原,还原到实际视图;在一些实施过程中,根据操作平面上的实体相对位置就可以生成出一个合理的树状分组结构,而无需其他任何配置信息,为下游对这些实体的进一步处理提供便利;人工仅需要按照实际需要对各个实体完成一次排列,通过本发明的分组后的实体,就可以还原出能够适配多种多样物理尺寸的布局;这就可以大大减少人工适配多种多样物理尺寸的重复性工作,提升效率,降低技能要求。
本发明其他特征和相应的有益效果在说明书的后面部分进行阐述说明,且应当理解,至少部分有益效果从本发明说明书中的记载变的显而易见。
附图说明
图1为本发明实施例一的软件界面实体设计方法的流程示意图;
图2为本发明实施例一的操作平面的示意图;
图3为本发明实施例一的操作平面上的实体的示意图;
图4为本发明实施例一的一种操作平面上的实体分布的示意图;
图5为本发明实施例一的一种虚拟实体的示意图;
图6为本发明实施例一的另一种虚拟实体的示意图;
图7为本发明实施例一的一种平面上的实体设计的示意图;
图8为本发明实施例一的混合还原后的示意图;
图9为本发明实施例二的操作平面上的实体的示意图;
图10为本发明实施例二的操作平面分组方法的示意图;
图11为本发明实施例二的一种按实际尺寸还原后的示意图;
图12为本发明实施例二的计算格子数的示意图;
图13为本发明实施例二的混合还原后的示意图;
图14为本发明实施例二的平面上垂直方向的实体设计示意图;
图15为本发明实施例二的垂直方向上的混合还原后的示意图;
图16为本发明实施例三的软件界面实体设计方法的流程示意图;
图17为本发明实施例三的平面上的实体设计示意图;
图18为本发明实施例三的由组形成的树结构示意图;
图19为本发明实施例四的一种装置的结构示意图;
图20为本发明实施例四的一种终端的结构示意图。
具体实施方式
为了使本发明的目的、技术方案及优点更加清楚明白,下面通过具体实施方式结合附图对本发明实施例作进一步详细说明。应当理解,此处所描述的具体实施例仅仅用以解释本发明,并不用于限定本发明。
实施例一:
专业的软件界面开发所需的技能门槛过高与大多数有需要参与这些界面开发的人员不具备相关技能之间的矛盾。传统开发软件界面的方法是通过一行行代码来描述界面,一方面这很抽象,另一方面这需要相当的专业知识与技能,一名开发人员需要通过较长时间的学习与试错之后,才能适应这样的抽象的开发过程,才能掌握相关的只是与技能。本发明实施例提出来的分组与还原的方法,有效的解决了这对矛盾中的软件布局这一部分的问题。本发明实施例中提供一种软件界面实体设计方法,具体请参见图1,图1为本发明实施例提供的软件界面实体设计方法,包括:
S101、根据当前操作平面上的各实体的相对位置确定切分边,操作平面由预设尺寸的矩形单元组成,实体占据的区域为矩形。
在本发明实施例中,所提及的操作平面实际指的是一个二维数据区域(或者说是一个矩阵),在计算机实现时,通常会使用一个二维数组的结构来表示,下文提及到矩形单元实际上就是矩阵中的一个元素,但这不是唯一的可用结构;其中操作平面并非通常物理意义下的平面,而是物理平面的逻辑映射。当然,本发明实施例提及的操作平面与物理平面有许多相似之处,可以通过物理平面来辅助理解本发明的详细实现方式。
需要说明的是,操作平面由预设尺寸的矩形单元组成,例如在操作平面的水平方向上,按照预设固定尺寸,将操作平面拆分为以该预设固定尺寸为宽度的多条列,同理在垂直方向上,按照预设固定尺寸,将操作平面拆分为以该预设固定尺寸为宽度的多条行,进而操作平面形成多个矩形小格子,每个矩形小格子相同,其中矩形小格子在垂直和水平方向上的单位长度可以相等,也可以不等。在本发明实施例中,将该矩形小格子作为一个矩形单元,该矩形单元具有原子性,不可在细分,如图2所示,图2为一个操作平面示意图,其中图中的网格线仅仅是用于视觉辅助区分每个矩形单元,而非必须,其中图2中的矩形单元在垂直和水平方向上的单位长度相等。
在本发明实施例中,操作平面上包括实体,该实体占据的区域为矩形,而不能是其他形状,且该矩形有且只能包括N个格子,其中N≥1,并且N可以进行质因数分解:N=N1*N2,其中N1 N2均为≥1的整数。其中实体占据的矩形单元上包括该实体的唯一标记,该标记包括但不限于数字、图形、文字等,例如在实体占据的每个矩形单元中填入一个相同值,该值可以唯一代表这个实体,如图3所示,平面上包括实体301和实体302,实体301的唯一标识为1,实体302的唯一标识为2,实体未占据的矩形单元的标记为空。
在此,对根据操作平面上的各实体的相对位置确定切分边进行说明;其中切分边包括垂直方向的垂直切分边和水平方向的水平切分边。遍历操作平面上的每一列,当某列左侧的每个矩形单元非空标记与相邻的右侧矩形单元非空标记不一致时,将列作为垂直方向的垂直切分边。例如图3中的操作平面包括10行20列,从第1列开始遍历操作平面上的每一列,实体具有唯一数值,实体未占据的矩形单元不包括数值,如第4列左侧的每个非空值的矩形单元的数值为1,矩形单元右侧的矩形单元的数值也为1,则第4列不是垂直切分边;如第11列左侧每个非空值矩形单元的数值1与相邻的右侧矩形单元的数值2不一致,则第11列为垂直切分边。可以理解的是,当某列一侧的所有矩形单元为空标识,该列的另一侧任一矩形单元为非空标识,则该列为垂直切分边,如图3中,第3列左侧矩形单元均为空,右侧矩形单元存在数值1,则第3列为垂直切分边。图3给出当前操作平面上的所有垂直切分边(图中加粗的边);同理,遍历操作平面上的每一行,当某行上方的每个矩形单元非空标记与相邻的下方矩形单元非空标记不一致时,将行作为水平方向上的水平切分边,具体确定方式与垂直切分边相似,在此不再一一赘述。
S102、根据一个切分方向上的所有切分边对操作平面进行切分,得到各子平面。
在本发明实施例中,通过一条切分边可将操作平面分割为两个独立的子平面;其中对操作平面进行切分时,只能在一个方向上进行,且只能在一个矩形单元的边界执行切的动作,不能在一个矩形单元的中间任意部分执行,且根据切分边对操作平面进行切分时,只能沿着垂直或水平方向一刀到底完成,不能拐弯,也不能斜着切,也不能切一半,如图3所示,按照垂直切分边切分后,将得到4个独立的子平面。
值得注意的是,本发明实施例可以从任意一个方向进行切分,较优的,选择切分边数量更大的一个方向进行切分;从任意方向切分最终总是可以完成分组的过程的,选择边数多的方向作为切分方向的好处是,可以让切分的动作尽快收敛,从而让切分算法更加高效,并且可以使得分组得到的树的长度更小、复杂度更低。
具体的,确实操作平面上所有垂直切分边和水平切分边的数量;将数量大的切分边所在方向作为切分方向,例如操作平面上包括5条垂直切分边,4条水平切分边,则将垂直方向作为切分方向;当然垂直切分边数量与水平切分边数量相等且不为0时,可以选择任意一个方向进行切分。然后根据切分方向对操作平面上分布的实体进行切分,从垂直切分边一刀到底进行切分,将操作平面切分为多个子平面,完成当前层次的分组工作。
S103、根据各子平面的切分边进行切分,直到子平面不存在切分边。
在本发明实施例中,对每个子平面重复上述步骤S101和S102,即确定每个子平面的所有垂直切分边和所有水平切分边数量,选择数量更大的一个方向作为当前切分的方向,确定此方向上各个切分边的位置,执行切分动作,对每个子平面进行进一步的切分和分组,直至子平面内只剩下一个实体或者无法再切分。
其中当一个子平面的垂直切分边数量与水平切分边数量均为零,表示当前子平面无法再切分,但并不意味着当前子平面上就只有一个实体,当多个实体出现一些特定的排列方式时,可能会无法再切分,如图4所示。
值得注意的是,本发明实施例提供的软件布局方法还包括判定两个实体是否重叠,以及将所有重叠的实体融合在一起。具体的,当操作平面内的两个不同的实体同时占据至少一个相同矩形单元时,确定两个不同的实体重叠;确定操作平面上所有重叠的实体,将所有重叠的实体组合成一组虚拟实体。如图5所示,实体501和实体502同时覆盖到矩形单元503。其中将所有重叠的实体组成一组虚拟实体具体包括,确定所有重叠实体中最左上角的矩形单元、最右下角的矩形单元,将由确定出的矩形单元形成的矩形作为一组虚拟实体,如图5中,找出重叠的实体501和实体502中最左上角的矩形单元503、最右下角的矩形单元504,由这两个矩形单元形成一个矩形505,且该矩形好可以框住所有的重叠实体,则将该矩形505作为虚拟实体。当然通过最左下角和最右上角的矩形单元也可以形成一个虚拟实体。
需要说明的是,当虚拟实体覆盖周边的实体,根据所有被覆盖的实体与虚拟实体确定新的虚拟实体,直到新的虚拟实体不再覆盖实体;即一个虚拟实体可能会覆盖到其周边更多的实体,此时,原虚拟实体应该丢弃,且将所有被覆盖到的实体放在一起重新计算出一个新的虚拟实体;周而复始,直至新的虚拟实体不再覆盖任何新的实体为止。如图6所示,该操作平面上包括虚拟实体601,该虚拟实体覆盖了周边的实体602,则重新确定一个新的虚拟实体603将虚拟实体601和实体602框住。
S104、对给定平面的实体进行尺寸还原,还原到实际视图。
在本发明实施例中,对物理平面的逻辑映射、分组以及还原的重要意义在于人工仅需要按照实际需要对各个实体完成一次排列,通过本发明就可以还原出能够适配多种多样物理尺寸的布局;这就可以大大减少人工适配多种多样物理尺寸的重复性工作,提升效率,降低技能要求。
给定平面包括操作平面或子平面,子平面可以是单个子平面,也可以是多个子平面的组合,即可以对操作平面上的所有实体进行整体还原,也可以对操作平面的上的单个实体还原,还可以是对子平面上的所有实体还原,对给定平面的实体进行尺寸还原,该实体可以是未重叠的实体,也可以是由重叠实体组成的虚拟实体,具体包括三种还原方法:
按实际尺寸还原:给定平面的一个实体的水平上的实际尺寸=实体在水平方向上的矩形单元数*矩形单元水平单位长度;例如一个矩形单元在水平方向上的单位长度为8px,一个实体在水平方向上占了100个矩形单元,则实体在水平方向上的实际长度为800px;同理,一个实体的垂直方向上的实际尺寸=实体在垂直方向上的矩形单元数*矩形单元垂直单位长度。按照实际尺寸还原法虽然简单,但是其约束是非常大的:实际渲染出的尺寸必须严格与设计时相等,这点很大程度上制约了可视化工具的渲染场景。
按比例相对还原:这个方法避免了实际尺寸还原法的缺点,它允许设计时的尺寸与实际渲染的尺寸不一致,这种尺寸还原方式实际上采用了等比例缩放的方式在还原各个实体,在多数需要精细化布局的场合下并不适用。具体的,给定平面的一个实体在水平上的实际尺寸=realWidth*(entityWidth/totalWidth)(单位:px),entityWidth为实体的水平宽度(单位:矩形单元),realWidth为操作平面水平总宽度(单位:矩形单元),realWidth为还原后的实际水平尺寸(单位:px);例如一个实体在水平方向上占了100个矩形单元,该操作平面总矩形单元为200个矩形单元,还原后的实际水平尺寸为800px,则该实体在水平方向上的实际尺寸为800*(100/200)=400px。同理,给定平面的一个实体在垂直方向上的实际尺寸=realHeight*(entityHeight/totalHeight)(单位:px),entityHeight为实体在垂直高度(单位:矩形单元),totalHeight为操作平面在垂直总高度(单位:矩形单元),realHeight为还原后的实际高度尺寸(单位:px)。
按实际尺寸还原和按比例相对还原:在给定平面上的任意一行上,,可能存在这多个实体,且这些实体的预期还原尺寸的方式,有的是按照其设计时的实际尺寸还原,有的是按照比例的方式还原,称之为混合还原方法。混合还原方式可以退化为单一的实际尺寸还原方式,或者退化成单一的相对尺寸还原方式;即在本发明实施例中,单一的尺寸还原方式,也是一种混合还原方式。
在混合还原方式下,正确计算按比例还原的单个实体或者一组实体(至少两个实体组成一组实体)所占的矩形单元数是非常重要的,对单个实体计算矩形单元数是非常简单的,根据矩形单元数的定义,直接累计即可,而且得到的结果必然是一个正整数。如图7所示的给定平面(由单个实体组成的子平面、一组实体组成的子平面形成),其中按比例还原的最右侧实体701,水平矩形单元数是6;计算一组实体的矩形单元数的方法是,计算出组内所有实体的矩形单元数,最后取其最大值;比如图7中,左侧子平面702内有4个实体(该4个实体为一组),它的水平矩形单元数是:Max(11,4,0,0)=11,即按原尺寸还原的实体的矩形单元数为0。
将给定平面的各实体在水平上的矩形单元数组成数列(N1,N2,...,Nm),Ni为整数且Ni≥0,i=0,1….m,如图7中的各实体的矩形单元数(6,11,0,0),其中当Ni=0时,给定平面的实体i按实际尺寸还原,此时该实体的水平实际尺寸r=实体在水平方向上的矩形单元数*矩形单元水平单位长度,如图7中的实体703、704是按实际尺寸还原,N703,704=0,该实体703、704的水平实际尺寸=3*8=24px。
将所有Ni为0的所有实体的实际尺寸先全部计算出来,得到当前给定平面内按实际尺寸还原的总尺寸Rr=r1+r2+...+rn,图7中的Rr等于实体703、704的水平实际总尺寸48px;
当Ni>0时,给定平面的实体按比例相对还原,此时该实体的水平实际尺寸=Ni/(N1+N2+...+Nm)*(realWidth-Rr),realWidth为还原后的实际水平尺寸,例如实体701按比例还原,N701=11,实体701的水平实际尺寸=6/(11+0+0+6)*(600-48)=194.82px;组702的实体的水平实际尺寸=11/(11+0+0+6)*(600-48)=357.18px。值得注意的是,当realWidth≤Rr时,上述算式没有意义,此时取0作为实际尺寸,不难想象,此时的物理含义是:由于物理尺寸不足导致按相对尺寸还原的实体被“压扁”了。
同理,垂直方向上,将给定平面的实体在垂直上的矩形单元数组成数列(M1,M2,...,Mm),Mi为整数且Mi≥0,i=0,1….m;当Mi=0时,给定平面的实体按实际尺寸还原;实体的垂直实际尺寸h=实体在垂直方向上的矩形单元数*矩形单元垂直单位长度;当Mi>0时,给定平面的实体按比例相对还原;
实体的垂直实际尺寸=Mi/(M1+M2+...+Mm)*(realHeight—Rh);
Rh为所有Mi为0的实体的实际垂直总尺寸,Rh=h1+h2+...+hn,realHeight为还原后的实际高度尺寸;如图8所示,图8为混合还原后的示意图。
在本发明实施例中,可以根据实际需求选择哪种还原方法还原实体实际尺寸到实际视图上。
本发明实施例提供的软件界面实体设计方法,操作平面为物理平面的逻辑映射,该操作平面由多个矩形单元组成,约定每个矩形单元具有原子性,不可再细分,且操作平面上的每个实体所实际占据的空间,必须是一个矩形,基于上述两个约定计算出操作平面上一个实体在垂直或者水平方向上的切分边,然后通过这些切分边就可以将任意分布的实体做切分,每次切分都会产生出新的子平面,再对每个子平面重复上述过程,直至子平面内只剩下一个实体或者无法再切分位置;最终,会将平面上的所有实体,根据其相对位置归类到一个树状的分组结构;从而为下游对这些实体的进一步处理提供便利;
分组过程中,提供了一个可靠的方法用于判定操作平面实体是否可再切分。同时,还提供了一个可靠方法用于判定两个实体是否重叠,此外,本发明还给出了在实体发生重叠时,如何找出所有重叠的实体,以及如何将所有重叠的实体融合到一起的方法;本发明在给出实体的分组的同时,还可以给出实体是否重叠等额外的信息,以辅助下游的进一步处理。
分组完成之后,本发明还给出了三种还原实体尺寸的方法:按照实际设计还原、按照比例相对还原和混合还原尺寸,在下游处理器将实体还原到实际视图上时,可以提供更多灵活的还原方式,显著提升应用此算法的工具的易用性和用户体验,从而使得这些工具与未使用本发明的同类工具相比,拥有更显著的优势,从而在竞争中取得先机。
实施例二:
为例便于理解,本发明实施例对涉及到基本概念进行说明:
操作平面:实际指的是一个二维数据区域,是物理平面的逻辑映射,由多个矩形单元组成,本发明实施例用格子表示矩形单元,在垂直和水平方向上格子的单位长度不相等。
操作平面上包括实体,在每个格中填入一个值,这个值必须可以唯一地代表当前覆盖这一格实体,最简单的方式是给每个实体一个整数编号,如图9所示,这样这个整数就可以唯一的代表某个实体了。
值得注意的是,在一个操作平面上,在一个平面上,两个不同的实体同时覆盖到了至少同一个格子,此时,我们称这两个实体“重叠”;在多个重叠实体中,找出这些重叠实体的最左上角的格子,最右下角的格子,由这两个格子形成的一个矩形,恰好可以框住所有的重叠实体,本发明将这个矩形称为虚拟实体。参考图5,图中粗线框505中的是一个虚拟实体。根据这个定义,一个虚拟实体可能会覆盖到其周边更多的实体,此时,原虚拟实体应该丢弃,且将所有被覆盖到的实体放在一起重新计算出一个新的虚拟实体。周而复始,直至新的虚拟实体不再覆盖任何新的实体为止;即找出所有重叠的实体,将这些实体事先组合成一个虚拟实体。
边:可分为水平方向和垂直方向,在一个给定的“平面”(可以是操作平面,也可以是操作平面切分后的子平面)中,从第一列开始遍历平面上每一列c,如果该列左侧的每个非空值与相邻的右侧非空值不一致,则此时c为垂直方向上的一个“边”。如图9所示,图9给出了当前“平面”上的所有垂直“边”。水平“边”的定义方式与垂直“边”非常相似:从第一行开始遍历“平面”上每一行r,如果该行的每个非空值与相邻的下方非空值不一致,则此时r为水平方向上的一个“边”。
“切”:将一个给定“平面”分割为两个独立的子平面的过程,“切”同时能且只能在水平或者垂直方向上进行,只能在一格的边界执行“切”的动作,而不能在一格的中间任意部位执行。可以这样来理解为“切”的动作:只能沿着垂直或者水平一刀到底完成,不能拐弯,也不能斜着切,也不能切一半。由此不难得到推论,以此方式“切”出的所有子平面都是符合前文对“操作平面”的定义的。如图9所示,按照垂直线切分后,我们将得到5个子平面。
“组”:如果严格按照所有实体的“边”来“切”,在这个切分方式得到的所有子平面,我们称之为“组”。“组”的一些特性:1.“组”是有层级的,“组”内的成员可以继续再细分为子组。2.“组”内的各个成员,可能包含多个实体,也可能只包含一个实体。3.一个实体只能归属于单一的组内成员。
基于上述基本概念,本发明实施例的软件界面实体设计方法如图10所示,包括:
S1001、确实操作平面上所有垂直切分边和水平切分边的数量,将数量大的切分边所在方向作为切分方向。
找出当前操作平面所有垂直边数量,记为m;找出所有的水平边数量,记为n。取边数量更大的一个方向作为当前切分的方向。
如果m=n=0,则表示当前操作平面无法再切分,应当终止切分的动作,当一个操作平面在水平和垂直方向上的边数量都为0时,并不意味着当前平面上就只有一个实体,当多个实体出现一些特定的排列方式时,可能会无法再切分,一个可能的例子如图4,图中一共有5个实体,按照本发明对“边”的定义,图中无论垂直还是水平,都没有一个合法的边,于是,这样的排列方式的平面,是不可再切分的。反过来说,如果一组(≥2)实体组成一个平面,水平和垂直方向上都找不到一个边时,我们认为这个平面是不可再切分的。区分不可再切分的多实体平面的意义在于,本发明在后续的尺寸还原算法中,需要对这样的平面有特殊的处理方式,不可切分的多实体平面,必须将其相对尺寸还原方式回退到实际尺寸还原方式。
S1002、根据切分方向和该切分方向上的切分边对操作平面进行切分,得到各子平面。
在确定了切分方向后,取出此方向上各个边的位置,执行切分动作,这样就可以将操作平面切分为若干个子平面,此处切分得到的多个子平面恰好可以形成一个组,这就完成了当前层次的分组工作。
S1003、遍历各子平面,对每个子平面执行第一步及以后的动作,进行进一步的切分和分组。
实施例三:
基于上述实施例二,在分组完成后,可以根据实际需求对各个实体进行实际尺寸还原,包括按照设计实际尺寸还原、按照比例相对还原,以及这两种还原方法的混合等三种方法,例如对单个实体按照设计实际尺寸还原,对一组实体混合还原等,在下游处理器将实体还原到实际视图上。
按照实际尺寸还原,这个方式是最简单的还原尺寸的方式了,根据对平面映射的方法,不难看出一个实体的水平上的实际尺寸算法为:水平格子数*格子水平单位长度。比如,一个格子在水平方向上长度为8px,而一个实体在水平方向上占了100格,则此实体的在水平方向上的实际长度为800px。类似的,一个实体的垂直方向上的实际尺寸算法为:垂直格子数*格子垂直单位长度。按照实际尺寸还原法虽然简单,但是其约束是非常大的:实际渲染出的尺寸必须严格与设计时相等,这点很大程度上制约了可视化工具的渲染场景。图11展示的是图3按照实际尺寸还原后的效果,可以看到,按实际尺寸还原后的实际效果与设计时的效果是一模一样的。
按比例还原实体尺寸,这个方法避免了实际尺寸还原法的缺点,它允许设计时的尺寸与实际渲染的尺寸不一致。下面以水平方向为例,记当前实体的水平宽度为entityWidth(单位:格),操作平面总宽度为totalWidth(单位:格),还原后的实际水平尺寸为realWidth(单位:px),那么水平上的算法为:
realWidth*(entityWidth/totalWidth)(单位:px)
垂直方向上的算法与水平方向上的算法一致,为:
realHeight*(entityHeight/totalHeight)(单位:px)
其中,realHeight为还原后的实际高度(单位px),entityHeight为当前实体在垂直方向上的高度(单位:格),totalHeight为当前操作平面在垂直方向上的总高度(单位:格)。这种尺寸还原方式实际上采用了等比例缩放的方式在还原各个实体,在多数需要精细化布局的场合下并不适用。
通过前面两种还原方式的混合,可以让还原出来的实际尺寸适用于更加复杂的场景,比如可以完美的还原出现代软件界面的任何布局方式。在开始之前,需要先解释一下“混合”的概念,同样的,“混合”也分为水平和垂直两个方向。水平方向上的混合,是指在平面的任意一行上,可能存在这多个实体,且这些实体的预期还原尺寸的方式,有的是按照其设计时的实际尺寸还原,有的是按照比例的方式还原。请注意,“混合”还原方式可以退化为单一的实际尺寸还原方式,或者退化成单一的相对尺寸还原方式。即,在本发明中,单一的尺寸还原方式,也是一种“混合”还原方式。垂直方向上的“混合”的概念与水平上的概念非常相似,垂直反向上的“混合”也可以退化成单一的还原方式。
在混合还原方式下,正确计算按比例还原的单个实体或者一组实体所占的格子数是非常重要的,为描述简便,本发明实施例下文的格子数,特指的是按比例还原的单个实体或者一组实体所占的格子数。对单个实体计算格子数是非常简单的,根据格子数的定义,直接累计即可,而且得到的结果必然是一个正整数。如图12中,最右侧实体,水平格子数是11。计算一组实体的格子数的方法是,计算出组内所有实体的格子数,最后取其最大值。比如图12中,第一层分组下一共有6个实体,中间部分是一个包含4个实体的“组”,它的水平格子数是:Max(21,7,0,0)=21。
垂直方向上的算法与水平方向上的算法一致,下面以水平为例给出具体的混合还原尺寸的方法。
给定一组实体,根据组的特性我们可以知道,组内各个成员有可能包含单个实体,也可能包含多个实体,前文已经给出了单个或者多个实体的计算其按比例还原的格子数的方法了,通过计算,我们就可以得到一个格子数组成的数列:(N1,N2,...,Nm),其中Ni为整数且Ni≥0。当Ni为0时,表示组内的成员i是按照实际尺寸还原的,它的实际尺寸为:
r i=所占格子数*格子宽度;
将所有Ni为0的实际尺寸先全部计算出来,得到的一个新的数列:(r1,r2,...,rn),将这个数列的各个成员累加,可以得到当前组按实际尺寸还原的总尺寸Rh=r1+r2+...+rn。
当Ni>0时,表示组内的成员i是按照相对尺寸还原的,它的实际尺寸算法为:
Ni/(N1+N2+...+Nm)*(realWidth-Rh);
其中,realWidth为还原后的实际水平尺寸。注意到,当realWidth≤Rh时,上述算式没有意义,此时取0作为实际尺寸,不难想象,此时的物理含义是:由于物理尺寸不足导致按相对尺寸还原的实体被“压扁”了。
如图13所示,图13展示的是图12还原后的效果,可以看到,本发明可以很好的处理不同的尺寸还原方式混合的情形。在不同的目标尺寸下,按实际尺寸还原后,依然保持与设计时一致的尺寸,而按相对尺寸还原后,本发明可以根据目标尺寸计算出正确的比例,并将计算所得的真实尺寸分配给所有按相对尺寸还原的实体。图14展示的是在一个平面上设计了具有垂直方向上的按比例还原实体,图15是它对应的还原效果,图15中展示了3种不同高度的目标尺寸.
实施例三:
本发明实施例以一个具体的例子对软件界面实体设计方法进行说明,如图16所示,
S1601、根据当前操作平面上的各实体的相对位置确定切分边和切分方向。
如图17所示,当前操作平面上包括8个实体,操作平面上的矩形单元(下文称之为格子)在垂直和水平方向上格子的单位长度相等,图中实体上的文本为实体的映射值;
从第1列开始遍历操作平面上每一列,如果该列左侧的任一非空值与相邻的右侧非空值不一致,则此时该列为垂直方向上的一个“切分边”;从第一行开始遍历“平面”上每一行r,如果该行的任一非空值与相邻的下方非空值不一致,则此时r为水平方向上的一个“切分边”,图中加粗为切分边,垂直方向的切分边大于水平方向切分边,将垂直方向作为切分垂直方向。
S1602、根据切分方向上的所有切分边对操作平面进行第一层切分分组,生成组;
切分得到7个子平面,7个子平面形成一个组170a;
S1603、对组的成员重复上述过程,生成新的组,直至组内只剩下一个实体或者无切分位置。
第二层组:包括实体的子平面分别各自为一组分别170a1、170a2、170a3,第三层组:子平面17016再次切分后,得到170a4、170a5;将平面上的所有实体,根据其相对位置归类到一个树状的分组结构,如图18所示。
S1604、按实际尺寸还原和/或按比例相对还原给定平面的实体,,还原到实际视图。
在一个实际视图中,对第一层组170a的实体的按混合还原方式进行尺寸还原;在一个实际视图中,对第二层组170a1的实体的按比例还原方法进行尺寸还原;在一个实际实体中,对第二层组170a2的实体的按混合还原方式还原;在一个实际实体中,对第三层组170a4的实体的按实际尺寸还原方式还原,每一个组对应的平面为给定平面,具体的还原方式如上述实施例一和实施例二所示,再次不再一一赘述。
实施例四:
本发明实施例提供一种装置,如图19所示,包括确定模块1901、分组模块1902和还原模块1903;
确定模块1901,用于根据当前操作平面上的各实体的相对位置确定切分边,操作平面由预设尺寸的矩形单元组成,实体占据的区域为矩形;
分组模块1902,用于根据一个切分方向上的所有切分边对操作平面进行切分,得到各子平面;还用于根据各子平面的切分边再对各子平面进行切分,直到子平面不存在切分边;
还原模块1903,用于对给定平面的实体进行尺寸还原,还原到实际视图。
本发明实施例还提供一种终端,如图20所示,其包括第一处理器2001、第一存储器2002及第一通信总线2003,其中:
第一通信总线2003用于实现第一处理器2001和第一存储器2003之间的连接通信;
第一处理器2001用于执行第一存储器2003中一个或者多个第一程序,以实现如各实施例的软件界面实体设计方法的步骤。
本发明实施例还提供了一种存储介质,该存储介质包括在用于存储信息(诸如计算机可读指令、数据结构、计算机程序模块或其他数据)的任何方法或技术中实施的易失性或非易失性、可移除或不可移除的介质。存储介质包括但不限于RAM(Random AccessMemory,随机存取存储器),ROM(Read-Only Memory,只读存储器),EEPROM(ElectricallyErasable Programmable read only memory,带电可擦可编程只读存储器)、闪存或其他存储器技术、CD-ROM(Compact Disc Read-Only Memory,光盘只读存储器),数字多功能盘(DVD)或其他光盘存储、磁盒、磁带、磁盘存储或其他磁存储装置、或者可以用于存储期望的信息并且可以被计算机访问的任何其他的介质。
本发明实施例中的存储介质可用于存储一个或者多个计算机程序,其存储的一个或者多个计算机程序可被处理器执行,以实现上述各实施例中的软件界面实体设计方法的步骤。
可见,本领域的技术人员应该明白,上文中所公开方法中的全部或某些步骤、系统、装置中的功能模块/单元可以被实施为软件(可以用计算装置可执行的计算机程序代码来实现)、固件、硬件及其适当的组合。在硬件实施方式中,在以上描述中提及的功能模块/单元之间的划分不一定对应于物理组件的划分;例如,一个物理组件可以具有多个功能,或者一个功能或步骤可以由若干物理组件合作执行。某些物理组件或所有物理组件可以被实施为由处理器,如中央处理器、数字信号处理器或微处理器执行的软件,或者被实施为硬件,或者被实施为集成电路,如专用集成电路。
此外,本领域普通技术人员公知的是,通信介质通常包含计算机可读指令、数据结构、计算机程序模块或者诸如载波或其他传输机制之类的调制数据信号中的其他数据,并且可包括任何信息递送介质。所以,本发明不限制于任何特定的硬件和软件结合。
以上内容是结合具体的实施方式对本发明实施例所作的进一步详细说明,不能认定本发明的具体实施只局限于这些说明。对于本发明所属技术领域的普通技术人员来说,在不脱离本发明构思的前提下,还可以做出若干简单推演或替换,都应当视为属于本发明的保护范围。
Claims (13)
1.一种软件界面实体设计方法,包括:
根据当前操作平面上的各实体的相对位置确定切分边,所述操作平面由预设尺寸的矩形单元组成,所述实体占据的区域为矩形;
根据一个切分方向上的所有切分边对所述操作平面进行切分,得到各子平面;
根据各子平面的切分边再对各子平面进行切分,直到子平面不存在切分边;
对给定平面的实体进行尺寸还原,还原到实际视图。
2.如权利要求1所述的软件界面实体设计方法,其特征在于,所述实体占据的矩形单元上包括所述实体的唯一标记;根据当前操作平面上的各实体的相对位置确定切分边包括:
遍历所述操作平面上的每一列,当某列左侧的每个矩形单元非空标记与相邻的右侧矩形单元非空标记不一致时,将所述列作为垂直方向的垂直切分边;
遍历所述操作平面上的每一行,当某行上方的每个矩形单元非空标记与相邻的下方矩形单元非空标记不一致时,将所述行作为水平方向上的水平切分边。
3.如权利要求2所述的软件界面实体设计方法,其特征在于,所述根据一个切分方向上的所有切分边对所述操作平面进行切分,得到各子平面包括:
确实所述操作平面上所有垂直切分边和水平切分边的数量;
将数量大的切分边所在方向作为所述切分方向;
根据所述切分方向对所述操作平面上分布的实体进行切分,得到各子平面。
4.如权利要求1所述的软件界面实体设计方法,其特征在于,所述软件界面实体设计方法还包括:
当操作平面内的两个不同的实体同时占据至少一个相同矩形单元时,确定所述两个不同的实体重叠;
确定所述操作平面上所有重叠的实体,将所有重叠的实体组合成一组虚拟实体。
5.如权利要求4所述的软件界面实体设计方法,其特征在于,所述将所有重叠的实体组合成一组虚拟实体,包括:
确定所述所有重叠实体中最左上角的矩形单元、最右下角的矩形单元;
将由确定出的矩形单元形成的矩形作为一组虚拟实体。
6.如权利要求5所述的软件界面实体设计方法,其特征在于,所述将确定出的矩形单元形成的矩形作为虚拟实体之后,包括:
当所述虚拟实体覆盖周边的实体,根据所有被覆盖的实体与所述虚拟实体确定新的虚拟实体,直到所述新的虚拟实体不再覆盖实体。
7.如权利要求1-6任一项所述的软件界面实体设计方法,其特征在于,所述对给定平面的实体进行尺寸还原,包括:
按实际尺寸还原和/或按比例相对还原所述给定平面的实体,所述给定平面包括所述操作平面,或子平面。
8.如权利要求7所述的软件界面实体设计方法,其特征在于,所述按实际尺寸还原所述给定平面的实体包括:
所述给定平面的一个实体的水平上的实际尺寸=所述实体在水平方向上的矩形单元数*矩形单元水平单位长度;
一个实体的垂直方向上的实际尺寸=所述实体在垂直方向上的矩形单元数*矩形单元垂直单位长度。
9.如权利要求7所述的软件界面实体设计方法,其特征在于,所述按比例相对还原所述给定平面的实体包括:
所述给定平面的一个实体在水平上的实际尺寸=realWidth*(entityWidth/totalWidth),所述entityWidth为所述实体的水平宽度,所述realWidth为操作平面水平总宽度,所述realWidth为还原后的实际水平尺寸;
所述给定平面的一个实体在垂直方向上的实际尺寸=realHeight*(entityHeight/totalHeight),所述entityHeight为所述实体在垂直高度,totalHeight为操作平面在垂直总高度,所述realHeight为还原后的实际高度尺寸。
10.如权利要求7所述的软件界面实体设计方法,其特征在于,所述按实际尺寸还原和按比例相对还原所述给定平面的实体,包括:
将所述给定平面的实体在水平上的矩形单元数组成数列(N1,N2,...,Nm),Ni为整数且Ni≥0,i=0,1….m;
当Ni=0时,所述给定平面的实体按实际尺寸还原:
实体的水平实际尺寸r=所述实体在水平方向上的矩形单元数*矩形单元水平单位长度;
当Ni>0时,所述给定平面的实体按比例相对还原:
实体的水平实际尺寸=Ni/(N1+N2+...+Nm)*(realWidth-Rr);
所述Rr为所有Ni为0的实体的实际水平总尺寸,Rr=r1+r2+...+rn,所述realWidth为还原后的实际水平尺寸;
将所述给定平面的实体在垂直上的矩形单元数组成数列(M1,M2,...,Mm),Mi为整数且Mi≥0,i=0,1….m;
当Mi=0时,所述给定平面的实体按实际尺寸还原;
所述实体的垂直实际尺寸h=所述实体在垂直方向上的矩形单元数*矩形单元垂直单位长度;
当Mi>0时,所述给定平面的实体按比例相对还原;
所述实体的垂直实际尺寸=Mi/(M1+M2+...+Mm)*(realHeight-Rh);
所述Rh为所有Mi为0的实体的实际垂直总尺寸,Rh=h1+h2+...+hn,所述realHeight为还原后的实际高度尺寸。
11.一种装置,其特征在于,包括确定模块、分组模块和还原模块;
所述确定模块,用于根据当前操作平面上的各实体的相对位置确定切分边,所述操作平面由预设尺寸的矩形单元组成,所述实体占据的区域为矩形;
所述分组模块,用于根据一个切分方向上的所有切分边对所述操作平面进行切分,得到各子平面;还用于根据各子平面的切分边再对各子平面进行切分,直到子平面不存在切分边;
所述还原模块,用于对给定平面的实体进行尺寸还原,还原到实际视图。
12.一种终端,其特征在于,所述终端包括处理器、存储器及通信总线;
所述通信总线用于实现处理器和存储器之间的连接通信;
所述处理器用于执行存储器中存储的一个或者多个程序,以实现如权利要求1至10任一项所述软件界面实体设计方法的步骤。
13.一种存储介质,其特征在于,所述存储介质存储有一个或者多个程序,所述一个或者多个程序可被一个或者多个处理器执行,以实现如权利要求1至10中任一项所述的所述软件界面实体设计方法的步骤。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201910955939.6A CN112631582A (zh) | 2019-10-09 | 2019-10-09 | 一种软件界面实体设计方法、装置、终端及存储介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201910955939.6A CN112631582A (zh) | 2019-10-09 | 2019-10-09 | 一种软件界面实体设计方法、装置、终端及存储介质 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN112631582A true CN112631582A (zh) | 2021-04-09 |
Family
ID=75283354
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201910955939.6A Pending CN112631582A (zh) | 2019-10-09 | 2019-10-09 | 一种软件界面实体设计方法、装置、终端及存储介质 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN112631582A (zh) |
-
2019
- 2019-10-09 CN CN201910955939.6A patent/CN112631582A/zh active Pending
Similar Documents
Publication | Publication Date | Title |
---|---|---|
US10303837B2 (en) | Virtual cell model geometry compression | |
CN110533778B (zh) | 大规模图像点云并行分布式网格化重建方法、系统、装置 | |
CN112669463A (zh) | 三维点云的曲面重建方法、计算机设备和计算机可读存储介质 | |
CN111382485A (zh) | 一种基于三维打印的三维模型二维嵌套摆放方法 | |
US20150002510A1 (en) | Sketch-based generation and editing of quad meshes | |
JP2014106968A (ja) | 複数のアイテムをキャンバス内に自動配置する装置、方法およびコンピュータ読み取り可能な記録媒体 | |
CN106611401A (zh) | 一种在纹理内存中存储图像的方法及装置 | |
CN111524231B (zh) | 一种虚拟地形的处理方法及装置、电子设备、存储介质 | |
CN110853120B (zh) | 基于分割绘图法的网络布局方法、系统及介质 | |
CN115187589A (zh) | 多边形修正及生成方法、装置、设备及可读存储介质 | |
CN108744520B (zh) | 确定游戏模型摆放位置的方法、装置和电子设备 | |
CN109961516B (zh) | 表面获取方法、装置及非暂态电脑可读取记录媒体 | |
CN112631582A (zh) | 一种软件界面实体设计方法、装置、终端及存储介质 | |
CN111599015B (zh) | 一种约束条件下的空间多边形网格化填充方法和装置 | |
CN109426458B (zh) | 一种关系图的打印方法和装置 | |
CN112819108A (zh) | 一种多源异构模型的切片融合方法、系统及存储介质 | |
CN114022594B (zh) | 一种斜坡类地理信息要素图形处理方法和装置 | |
CN115578488B (zh) | 一种地图注记掩膜计算方法、系统、电子设备及存储介质 | |
CN115641430B (zh) | 一种兴趣面确定方法、装置、介质及计算机设备 | |
CN113297401B (zh) | 半边数据结构的生成方法、数据处理方法、装置及设备 | |
CN115359460B (zh) | 用于车辆的图像识别方法、装置、车辆和存储介质 | |
US20230298259A1 (en) | Voxel-based approach for design models | |
RU2342705C1 (ru) | Компьютерный способ формирования изображения частей ломаной линии, лежащих как внутри, так и вне многоугольной области, и компьютерный способ формирования изображения границ одной или нескольких областей, полученных в результате применения заданной логической операции к двум многоугольным областям | |
US20230298291A1 (en) | Voxel-based approach for design models | |
JP2005056288A (ja) | 混合格子型解適合格子法を用いた数値解析装置 |
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 |