CN114816186B - 基于移动端的报表设置方法、装置、电子设备及存储介质 - Google Patents

基于移动端的报表设置方法、装置、电子设备及存储介质 Download PDF

Info

Publication number
CN114816186B
CN114816186B CN202210500826.9A CN202210500826A CN114816186B CN 114816186 B CN114816186 B CN 114816186B CN 202210500826 A CN202210500826 A CN 202210500826A CN 114816186 B CN114816186 B CN 114816186B
Authority
CN
China
Prior art keywords
container
sub
stretching
size
box
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
CN202210500826.9A
Other languages
English (en)
Other versions
CN114816186A (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.)
Guangzhou Yigong Technology Co ltd
Original Assignee
Guangzhou Yigong 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 Guangzhou Yigong Technology Co ltd filed Critical Guangzhou Yigong Technology Co ltd
Priority to CN202210500826.9A priority Critical patent/CN114816186B/zh
Publication of CN114816186A publication Critical patent/CN114816186A/zh
Application granted granted Critical
Publication of CN114816186B publication Critical patent/CN114816186B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input 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/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input 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/14Digital output to display device ; Cooperation and interconnection of the display device with other functional units
    • YGENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
    • Y02TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
    • Y02EREDUCTION OF GREENHOUSE GAS [GHG] EMISSIONS, RELATED TO ENERGY GENERATION, TRANSMISSION OR DISTRIBUTION
    • Y02E30/00Energy generation of nuclear origin
    • Y02E30/30Nuclear fission reactors

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)
  • User Interface Of Digital Computer (AREA)

Abstract

本发明实施例涉及报表技术领域,公开了一种基于移动端的报表设置方法、装置、电子设备及存储介质。该方法包括:确定盒子在移动端的位置和大小,根据盒子的位置和大小以及预设关系确定基础容器的位置和大小;响应于第一裂变指令,对基础容器进行裂变操作,以生成多个子容器;响应于第二裂变指令,对目标子容器进行裂变操作,以对目标子容器进行均分;响应于第一拉伸指令,对盒子进行大小和位置调整,基础容器以及子容器随盒子的位置和大小而调整;响应于第二拉伸指令,对目标子容器进行大小调整。实施本发明实施例,可以自适应移动端显示屏幕,根据盒子大小自动调整基础容器和各个子容器的位置和大小,从而提高报表布局的效率。

Description

基于移动端的报表设置方法、装置、电子设备及存储介质
技术领域
本发明涉及报表技术领域,具体涉及一种基于移动端的报表设置方法、装置、电子设备及存储介质。
背景技术
随着技术的不断发展,在移动端可呈现多个报表的布局形式,以适应需求方不同角度来表达观点。现有在移动端的报表的布局一般是使用一个画布作为一个容器,然后在容器中放置多个报表,根据报表大小再去调整各个报表的位置,从而最终呈现给需求方的结果显得杂乱无章,无法满足其正常需求,或者使用固定的分割方式对画布进行分割,而布局方(也可能是需求方自己)则在每个分割容器中放置相应的报表,为了适应分割容器的大小,来调整各个报表的尺寸,其也不能很好的呈现,即使不使用固定的分割方式,即使各个分割容器的大小可调节,但是仍会出现以下问题:
第一、对各个分割容器的调节过程繁琐,不能很好适配报表;
第二、当需求方的移动端显示屏幕的大小发生变化时,容器不能很好的适应显示屏幕,如果调整整个画布尺寸,则容器不能随之发生变化,就需要再重新调整容器位置和大小,效率极低。
发明内容
针对所述缺陷,本发明实施例公开了一种基于移动端的报表设置方法、装置、电子设备及存储介质,其可以自适应移动端显示屏幕,根据盒子大小自动调整基础容器和各个子容器的位置和大小,从而提高报表布局的效率。
本发明实施例第一方面公开一种基于移动端的报表设置方法,所述方法包括:
确定盒子在移动端的位置和大小,根据所述盒子的位置和大小以及预设关系确定基础容器的位置和大小;
响应于第一裂变指令,基于所述第一裂变指令对所述基础容器进行裂变操作,以生成多个子容器,所述多个子容器均分所述基础容器;
响应于第二裂变指令,基于所述第二裂变指令对目标子容器进行裂变操作,以对所述目标子容器进行均分;
响应于第一拉伸指令,基于所述第一拉伸指令对所述盒子进行大小和位置调整,所述基础容器以及子容器随所述盒子的位置和大小而调整;
响应于第二拉伸指令,基于所述第二拉伸指令对所述目标子容器进行大小调整。
作为较佳的实施例,在本发明实施例的第一方面中,确定盒子在移动端的位置和大小,根据所述盒子的位置和大小以及预设关系确定基础容器的位置和大小,包括:
设置盒子在移动端的大小,根据所述盒子的大小以及移动端显示屏幕的尺寸确定盒子在移动端的位置;
根据所述预设关系中的自动生成基础容器,所述预设关系为基础容器和盒子的横向边缘比例和纵向边缘比例;或者所述预设关系为基础容器和盒子的纵向间距尺寸和横向间距尺寸。
作为较佳的实施例,在本发明实施例的第一方面中,响应于第一拉伸指令,基于所述第一拉伸指令对所述盒子进行大小和位置调整,所述基础容器以及子容器随所述盒子的位置和大小而调整,包括:
响应于第一拉伸指令,对所述盒子进行长度或/宽度的调整,确定所述移动端的显示屏幕的中心,将调整后的盒子的中心与所述显示屏幕的中心重合;
根据所述预设关系确定基础容器的位置和大小;
根据调整后的基础容器和子容器的对应关系调整各个子容器的位置和大小。
作为较佳的实施例,在本发明实施例的第一方面中,响应于第二拉伸指令,基于所述第二拉伸指令对所述目标子容器进行大小调整,包括:
确定对所述目标子容器进行伸缩的边线,记为拉伸边线;
确定所述边线是否有对应相邻子容器;
根据所述拉伸方向调整所述目标子容器以及所述相邻子容器的大小,所述目标子容器与所述相邻子容器在第二拉伸指令执行前后的大小之和不变。
作为较佳的实施例,在本发明实施例的第一方面中,根据所述拉伸方向调整所述目标子容器以及所述相邻子容器的大小,包括:
确定相邻子容器与所述目标子容器进行伸缩的边线对应的边线,记为关联边线;
如果所述关联边线与所述拉伸边线完全重合,则沿所述拉伸方向调整所述拉伸边线的位置,以调整所述目标子容器和相邻子容器的大小;
如果所述关联边线为拉伸边线的一部分,或者所述拉伸边线为关联边线的一部分,则不执行第二拉伸指令。
作为较佳的实施例,在本发明实施例的第一方面中,根据所述拉伸方向调整所述目标子容器以及所述相邻子容器的大小,包括:
确定相邻子容器与所述目标子容器进行伸缩的边线对应的边线,记为关联边线;
如果所述关联边线与所述拉伸边线完全重合,则沿所述拉伸方向调整所述拉伸边线的位置,以调整所述目标子容器和相邻子容器的大小;
如果所述关联边线为所述拉伸边线的一部分,则确定是否存在多个相邻子容器的集合所形成的关联边线是否与所述拉伸边线完全重合,如果存在,则沿所述拉伸方向调整所述拉伸边线的位置,以调整所述目标子容器和多个相邻子容器的集合的大小;
如果所述拉伸边线为关联边线的一部分,则不执行第二拉伸指令。
作为较佳的实施例,在本发明实施例的第一方面中,所述目标子容器为基础容器中的最小子容器;
确定所述目标子容器的方法为:
确定所述点击位置对应的最小子容器,将所述最小子容器作为目标子容器;
所述方法还包括:
在目标子容器中放置目标报表。
本发明实施例第二方面公开了基于移动端的报表设置装置,其包括:确定单元,用于确定盒子在移动端的位置和大小,根据所述盒子的位置和大小以及预设关系确定基础容器的位置和大小;
第一响应单元,用于响应于第一裂变指令,基于所述第一裂变指令对所述基础容器进行裂变操作,以生成多个子容器,所述多个子容器均分所述基础容器;
第二响应单元,用于响应于第二裂变指令,基于所述第二裂变指令对目标子容器进行裂变操作,以对所述目标子容器进行均分;
第三响应单元,用于响应于第一拉伸指令,基于所述第一拉伸指令对所述盒子进行大小和位置调整,所述基础容器以及子容器随所述盒子的位置和大小而调整;
第四响应单元,用于响应于第二拉伸指令,基于所述第二拉伸指令对所述目标子容器进行大小调整。
本发明实施例第三方面公开一种电子设备,包括:存储有可执行程序代码的存储器;与所述存储器耦合的处理器;所述处理器调用所述存储器中存储的所述可执行程序代码,用于执行本发明实施例第一方面公开的一种基于移动端的报表设置方法。
本发明实施例第四方面公开一种计算机可读存储介质,其存储计算机程序,其中,所述计算机程序使得计算机执行本发明实施例第一方面公开的一种基于移动端的报表设置方法。
本发明实施例第五方面公开一种计算机程序产品,当所述计算机程序产品在计算机上运行时,使得所述计算机执行本发明实施例第一方面公开的一种基于移动端的报表设置方法。
本发明实施例第六方面公开一种应用发布平台,所述应用发布平台用于发布计算机程序产品,其中,当所述计算机程序产品在计算机上运行时,使得所述计算机执行本发明实施例第一方面公开的一种基于移动端的报表设置方法。
与现有技术相比,本发明实施例具有以下有益效果:
本发明在设计阶段时,可以根据报表数量对基础容器进行裂变生成多个子容器,每个子容器也可以裂变生成更小级别的子容器,每个最小级别的子容器均可放置报表,还可以根据目标报表尺寸通过拉伸操作对目标子容器的大小进行调整,也可以根据移动端屏幕对盒子进行拉伸操作,从而带动基础容器和各个子容器的大小和位置的自动调整,提供布局效率。
本发明还可以在呈现阶段,以设计时的盒子和移动端的显示屏幕尺寸之间的宽高比在新的显示屏上以相应的宽高比对盒子进行自动拉伸操作,从而带动基础容器、各个子容器以及报表进行相应的位置和大小的自动调整,提升用户体验。
附图说明
为了更清楚地说明本发明实施例中的技术方案,下面将对实施例中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本发明的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
图1是本发明实施例公开的一种基于移动端的报表设置方法的流程示意图;
图2是本发明实施例公开的显示屏幕、盒子、基础容器以及子容器的嵌套关系结构示意图;
图3是本发明实施例公开的裂变和删除按钮的结构示意图;
图4是本发明实施例公开的删除操作后的结构示意图;
图5是本发明实施例公开的一种基于移动端的报表显示方法的流程示意图;
图6是本发明实施例公开的一种基于移动端的报表设置装置的结构示意图;
图7是本发明实施例公开的一种电子设备的结构示意图。
具体实施方式
下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅是本发明一部分实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都属于本发明保护的范围。
需要说明的是,本发明的说明书和权利要求书中的术语“第一”、“第二”、“第三”、“第四”等是用于区别不同的对象,而不是用于描述特定顺序。本发明实施例的术语“包括”和“具有”以及他们的任何变形,意图在于覆盖不排他的包含,示例性地,包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元,而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。
本发明实施例公开了一种基于移动端的报表设置方法、装置、电子设备及存储介质,可以根据报表数量对基础容器进行裂变生成多个子容器,每个子容器也可以裂变生成更小级别的子容器,每个最小级别的子容器均可放置报表,还可以根据目标报表尺寸通过拉伸操作对目标子容器的大小进行调整,也可以根据移动端屏幕对盒子进行拉伸操作,从而带动基础容器和各个子容器的大小和位置的自动调整,提供布局效率,以下结合附图进行详细描述。
实施例一
请参阅图1,图1是本发明实施例公开的一种基于移动端的报表设置方法的流程示意图。如图1所示,该基于移动端的报表设置方法包括以下步骤:
S110、确定盒子在移动端的位置和大小,根据所述盒子的位置和大小以及预设关系确定基础容器的位置和大小。
在本发明较佳的实施例中,对设计阶段的各种嵌套关系进行说明,其中,显示屏幕中嵌套盒子(嵌套可以理解为盒子属于显示屏幕的下一层级,盒子尺寸不能大过显示屏幕,以下提及的嵌套与其类似),盒子嵌套基础容器,基础容器中嵌套子容器,子容器中又可以嵌套更小级别的子容器,直至最小级别的子容器,其中,最小级别的子容器并非一个,而是可以为多个,该最小级别的子容器又称为最小子容器,为没有进行裂变过的子容器,也即是不再嵌套下一级别的子容器的子容器。
在本发明中,显示屏幕、盒子、基础容器以及子容器均为矩形,其他形状的设置方式与之类似,这里不再对其进行说明。
例如,图2所示中,假设顶点A1、A2、A3、A4构成的矩形为显示屏幕,则顶点B1、B2、B3、B4构成的矩形为盒子,顶点C1、C2、C3、C4构成的矩形为基础容器,顶点C1、D4、O、D3构成的矩形为基础容器的子容器(记为第一子容器),顶点C1、D1、D2、D3构成的矩形为第一子容器的子容器,其并未继续嵌套子容器,因此,称其为最小子容器,同样地,顶点D1、D4、O、D2构成的矩形以及顶点D4、C2、E1、O构成的矩形等均未再嵌套下一级别的子容器,则它们也均为最小子容器。
确定盒子在移动端的位置和大小,具体是:设置盒子在移动端的大小,根据所述盒子的大小以及移动端显示屏幕的尺寸确定盒子在移动端的位置。
布局者,即报表设置的设计人员,可以根据自己的需要和喜好设置盒子的大小,即可以根据具体情形设置盒子的高度和宽度,设置完成后,盒子的位置会自动使用移动端显示屏幕的尺寸,具体是将盒子的中心移动至显示屏幕的中心,确定盒子的初始中心以及显示屏幕的中心的方法可以是通过像素点计算得到,然后将盒子的初始中心移动到显示屏幕的中心,使盒子的四条边随盒子中心的移动做相同的平移。
根据所述盒子的位置和大小以及预设关系确定基础容器的位置和大小,具体包括:
根据所述预设关系中的自动生成基础容器,所述预设关系为基础容器和盒子的横向边缘比例和纵向边缘比例;或者所述预设关系为基础容器和盒子的纵向间距尺寸和横向间距尺寸。
预设关系优选采用宽高比,即包括基础容器和盒子的宽度之比(即基础容器和盒子的横向边缘比例),记为第一比例,以及基础容器和盒子的高度之比(即基础容器和盒子的纵向边缘比例),记为第二比例,该第一比例和第二比例均为预设比例,可以根据需要自行调节,在设定完成后,根据该第一比例和第二比例自动生成基础容器的尺寸,基础容器的位置仍以基础容器的中心与显示屏幕也即是盒子的中心重合进行确定。
从而在盒子的大小确定后,其位置以及基础容器的大小和位置也均自动确定。
S120、响应于第一裂变指令,基于所述第一裂变指令对所述基础容器进行裂变操作,以生成多个子容器,所述多个子容器均分所述基础容器。
由于基础容器相当于一个画布,如果仅在其上布局报表,则会显得杂乱,因此,可以根据需要对基础容器进行裂变。
触发第一裂变指令的方式有多种,示例性地,当选中基础容器时(由于此时并未生成子容器,即未产生嵌套,因此,此时的基础容器可以视为最小子容器),可以通过一侧出现的裂变按钮触发。
对基础容器的裂变方式包括纵向裂变和横向裂变两种,点击纵向裂变时,则基础容器被分割成两个大小相同的子容器,这两个子容器呈左右分布,同样地,点击横向裂变时,基础容器被分割成两个大小相同的子容器,这两个子容器呈上下分布。
当然,在其他的一些实施例中,还可以在裂变时输入裂变数量,例如点击纵向裂变时,跳出对话框,输入3,则裂变数量为3,自动生成3个大小相同的子容器,这3个子容器呈左、中、右分布,依此类推。
S130、响应于第二裂变指令,基于所述第二裂变指令对目标子容器进行裂变操作,以对所述目标子容器进行均分。
当基础容器的纵向或横向裂变无法满足需求时,则可以通过对基础容器裂变后的子容器(称为第一层级子容器)进行再次裂变,形成第二层级子容器,还可以对第二层级子容器进行裂变产生第三层级子容器,等等。
需要说明的是,裂变也不能无限的操作,当目标子容器的宽与盒子(或者基础容器)的宽之比或者目标子容器的高与盒子(或者基础容器)的高之比小于预设比例例如5%时,则不能继续对目标子容器进行裂变。
这里的目标子容器是指最小层级或级别的子容器,也即是最小子容器,其内未嵌套下一层级的子容器。当布局者点击显示屏幕上某一点时,则确定该点位于哪个最小子容器中,该点位于的最小子容器记为目标子容器,例如图3所示的右上矩形框即为目标子容器。
对目标子容器的裂变方式与基础容器的裂变方式相同,这里不再具体展开。
S140、响应于第一拉伸指令,基于所述第一拉伸指令对所述盒子进行大小和位置调整,所述基础容器以及子容器随所述盒子的位置和大小而调整。
第一拉伸指令,是选中盒子的某一边进行伸缩操作,从而改变盒子的宽度或高度,调整完成后,盒子的大小发生变化,盒子调整时的初始中心的位置也随着调整偏离显示屏幕的中心,调整完成后,盒子的初始中心自动向显示屏幕的中心移动,从而调整整个盒子的位置。
基于第一拉伸指令和预设关系,基础容器也随着盒子的变化而自动调整大小和位置,其自动调整过程与步骤S110中的自动生成过程基本相同,对于各个子容器的自动调整,是根据子容器和基础容器的宽高比,以基础容器自动调整后的中心为中心,进行相应的大小和位置调整。
S150、响应于第二拉伸指令,基于所述第二拉伸指令对所述目标子容器进行大小调整。
由于需要在目标子容器中添加目标报表,因此,需要根据目标报表的尺寸来调整目标子容器的尺寸。
第二拉伸指令可以是在目标报表放置于目标子容器后进行,也可以是在对目标子容器进行伸缩操作之后再向目标子容器中放置目标报表。
当通过点击选择目标子容器后,除在一侧显示裂变按钮外,还可以在可以拉伸的边线上显示拉伸图标,拖动该拉伸图标即可改变目标子容器的尺寸。
是否显示拉伸图标的方法是确定目标子容器的各条边线是否有相邻子容器(这里的相邻子容器也是最小层级子容器),如果有相邻子容器,则出现该拉伸图标,即可根据伸缩方向来调整所述目标子容器以及所述相邻子容器的大小,调整的策略是所述目标子容器与所述相邻子容器在第二拉伸指令执行前后的大小之和不变,例如图3中,如果将目标子容器左侧边线向右侧的子容器方向拉伸,则目标子容器的宽度增加,右侧子容器的宽度减小,二者的宽度之和不变,二者的高度不变。
确定目标子容器的各条边线是否有相邻子容器方法有多种,首先通过是否有相邻子容器筛选掉目标子容器一部分的边线,例如图3中,目标子容器的上边线和左边线均不存在相邻子容器,则直接不考虑二者上的拉伸图表,然后再确定相邻子容器与所述目标子容器进行伸缩的边线对应的边线,记为关联边线;
如果所述关联边线与目标子容器对应的边线(记为拉伸边线)完全重合,则在该拉伸边线上设置拉伸图标,可以拖动拉伸图标沿所述拉伸方向调整所述拉伸边线的位置,从而调整所述目标子容器和相邻子容器的大小。
如果所述关联边线为拉伸边线的一部分,例如图2中,假设顶点D3、O、E4、C4构成的矩形为目标子容器,则其拉伸边线D3-O对应的相邻子容器有两个,分别是顶点C1、D1、D2、D3构成的矩形,记为第一相邻子容器,顶点D1、D4、O、D2构成的矩形,记为第二相邻子容器,第一相邻子容器的关联边线D3-D2以及第二相邻子容器的关联边线D2-O均为拉伸边线的一部分,这种情形下,拉伸边线D3-O上不显示拉伸按钮,无法执行第二拉伸指令。
相反,假设顶点D1、D4、O、D2构成的矩形为目标子容器时,其拉伸边线D3-D2对应的由顶点D3、O、E4、C4构成相邻子容器,拉伸边线D3-D2为关联边线D3-O的一部分,这种情况下,拉伸边线D3-D2上也不显示拉伸按钮,也无法执行第二拉伸指令。
作为另外一种实现方式,针对关联边线为拉伸边线的一部分的情形,如果所述关联边线为所述拉伸边线的一部分,则确定是否存在多个相邻子容器的集合所形成的关联边线是否与所述拉伸边线完全重合,如果存在,则沿所述拉伸方向调整所述拉伸边线的位置,以调整所述目标子容器和多个相邻子容器的集合的大小。
仍以假设顶点D3、O、E4、C4构成的矩形为目标子容器,则其拉伸边线D3-O对应的相邻子容器有两个,分别是顶点C1、D1、D2、D3构成的矩形,记为第一相邻子容器,顶点D1、D4、O、D2构成的矩形,记为第二相邻子容器,第一相邻子容器的关联边线D3-D2以及第二相邻子容器的关联边线D2-O均为拉伸边线的一部分,但是第一相邻子容器和第二相邻子容器构成的相邻子容器的集合形成的关联边线D3-O与拉伸边线D3-O完成重合,则可以在拉伸边线D3-O设置拉伸图标,从而在拖动该拉伸图标时,第一相邻子容器和第二相邻子容器的宽度均随拉伸边线D3-O的位置而发生变化。
在本发明其他的实施例中,还可以设置删除按钮,如图3所示,其操作方式与第二拉伸指令类似,如果目标子容器存在相邻子容器,则可以显示删除按钮,该相邻子容器覆盖目标子容器所在位置,类似于将拉伸边线拉伸到拉伸边线相对一侧的边线上。
因为删除后相邻子容器需要覆盖目标子容器的空间,因此,当存在多个相邻子容器与目标子容器对应时,则需要确定删除后由哪个相邻子容器来覆盖该目标子容器,其实现方式有多种,假设有四个相邻子容器均可以覆盖该目标子容器,第一种方式可以在目标子容器的四个顶点处均设置一个删除按钮,布局者点击相应的删除按钮时,则相应的相邻子容器来覆盖该目标子容器,例如左上角的删除按钮代表目标子容器左侧相邻子容器来覆盖目标子容器,右上角的删除按钮代表目标子容器上侧相邻子容器来覆盖目标子容器,左下角的删除按钮代表目标子容器下侧相邻子容器来覆盖目标子容器,右下角的删除按钮代表目标子容器右侧相邻子容器来覆盖目标子容器等。另外,还可以设置优先级,例如优先级依次为上、下、左、右。
与第二拉伸操作指令类似,如果关联边线和删除边线(等同于拉伸边线)不是完全重合关系,则不显示删除按钮,无法进行删除操作,例如图2中,无法对右上角的目标子容器进行删除操作。
当然,也可以是多个相邻子容器集合的关联边线如果和删除边线重合,则也可以通过该多个相邻子容器集合来覆盖该目标子容器,例如图2中,假设右上角为目标子容器,删除优先级有上、下、左、右,则对目标子容器进行删除操作时,其下侧的两个子容器构成的相邻子容器集合瓜分目标子容器空间,形成图4的结构。
综上所述,本发明可以根据报表数量对基础容器进行裂变生成多个子容器,每个子容器也可以裂变生成更小级别的子容器,每个最小级别的子容器均可放置报表,还可以根据目标报表尺寸通过拉伸操作对目标子容器的大小进行调整,也可以根据移动端屏幕对盒子进行拉伸操作,从而带动基础容器和各个子容器的大小和位置的自动调整,提供布局效率。
实施例二
请参阅图5,图5是本发明实施例公开的一种基于移动端的报表显示方法的流程示意图。如图5所示,该基于移动端的报表显示方法包括以下步骤:
S210、确定布局端显示屏幕和盒子的宽高比,基础容器和各个子容器的宽高比,以及目标子容器和目标报表的宽高比。
在布局者布局报表时,其使用的移动端显示屏幕和盒子的宽高比在布局完成后即可确定。
S220、确定显示端的显示屏幕尺寸,根据所述显示屏幕尺寸以及布局端显示屏幕和盒子的宽高比调整盒子在显示端的大小(相当于对盒子进行拉伸操作),进而根据盒子和基础容器的预设关系调整基础容器的大小,然后在根据基础容器和各个子容器的宽高比,调整各个子容器的大小,最后根据目标子容器和目标报表的宽高比调整目标报表的大小,从而实现显示端各部分的自动调整。
综上所述,本发明以设计时的盒子和移动端的显示屏幕尺寸之间的宽高比在新的显示屏上以相应的宽高比对盒子进行自动拉伸操作,从而带动基础容器、各个子容器以及报表进行相应的位置和大小的自动调整,提升用户体验。
实施例三
请参阅图6,图6是本发明实施例公开的一种基于移动端的报表设置装置的结构示意图。如图6所示,该基于移动端的报表设置装置包括:
确定单元310,用于确定盒子在移动端的位置和大小,根据所述盒子的位置和大小以及预设关系确定基础容器的位置和大小;
第一响应单元320,用于响应于第一裂变指令,基于所述第一裂变指令对所述基础容器进行裂变操作,以生成多个子容器,所述多个子容器均分所述基础容器;
第二响应单元330,用于响应于第二裂变指令,基于所述第二裂变指令对目标子容器进行裂变操作,以对所述目标子容器进行均分;
第三响应单元340,用于响应于第一拉伸指令,基于所述第一拉伸指令对所述盒子进行大小和位置调整,所述基础容器以及子容器随所述盒子的位置和大小而调整;
第四响应单元350,用于响应于第二拉伸指令,基于所述第二拉伸指令对所述目标子容器进行大小调整。
实施例四
请参阅图7,图7是本发明实施例公开的一种电子设备的结构示意图。如图7所示,该电子设备可以包括:
存储有可执行程序代码的存储器410;
与存储器410耦合的处理器420;
其中,处理器420调用存储器410中存储的可执行程序代码,执行实施例一中的一种基于移动端的报表设置方法中的部分或全部步骤。
本发明实施例公开一种计算机可读存储介质,其存储计算机程序,其中,该计算机程序使得计算机执行实施例一中的一种基于移动端的报表设置方法中的部分或全部步骤。
本发明实施例还公开一种计算机程序产品,其中,当计算机程序产品在计算机上运行时,使得计算机执行实施例一中的一种基于移动端的报表设置方法中的部分或全部步骤。
本发明实施例还公开一种应用发布平台,其中,应用发布平台用于发布计算机程序产品,其中,当计算机程序产品在计算机上运行时,使得计算机执行实施例一中的一种基于移动端的报表设置方法中的部分或全部步骤。
在本发明的各种实施例中,应理解,所述各过程的序号的大小并不意味着执行顺序的必然先后,各过程的执行顺序应以其功能和内在逻辑确定,而不应对本发明实施例的实施过程构成任何限定。
所述作为分离部件说明的单元可以是或者也可以不是物理上分开的,作为单元显示的部件可以是或者也可以不是物理单元,即可位于一个地方,或者也可以分布到多个网络单元上。可根据实际的需要选择其中的部分或全部单元来实现本实施例方案的目的。
另外,在本发明各实施例中的各功能单元可以集成在一个处理单元中,也可以是各个单元单独物理存在,也可以两个或两个以上单元集成在一个单元中。所述集成的单元既可以采用硬件的形式实现,也可以采用软件功能单元的形式实现。
所述集成的单元若以软件功能单元的形式实现并作为独立的产品销售或使用时,可以存储在一个计算机可获取的存储器中。基于这样的理解,本发明的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或者部分,可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储器中,包括若干请求用以使得一台计算机设备(可以为个人计算机、服务器或者网络设备等,具体可以是计算机设备中的处理器)执行本发明的各个实施例所述方法的部分或全部步骤。
在本发明所提供的实施例中,应理解,“与A对应的B”表示B与A相关联,根据A可以确定B。但还应理解,根据A确定B并不意味着仅仅根据A确定B,还可以根据A和/或其他信息确定B。
本领域普通技术人员可以理解所述实施例的各种方法中的部分或全部步骤是可以通过程序来指令相关的硬件来完成,该程序可以存储于一计算机可读存储介质中,存储介质包括只读存储器(Read-Only Memory,ROM)、随机存储器(Random Access Memory,RAM)、可编程只读存储器(Programmable Read-only Memory,PROM)、可擦除可编程只读存储器(Erasable Programmable Read-Only Memory,EPROM)、一次可编程只读存储器(One-time Programmable Read-Only Memory,OTPROM)、电子抹除式可复写只读存储器(Electrically-Erasable Programmable Read-Only Memory,EEPROM)、只读光盘(CompactDisc Read-Only Memory,CD-ROM)或其他光盘存储器、磁盘存储器、磁带存储器、或者能够用于携带或存储数据的计算机可读的任何其他介质。
以上对本发明实施例公开的一种基于移动端的报表设置方法、装置、电子设备及存储介质进行了详细介绍,本文中应用了具体个例对本发明的原理及实施方式进行了阐述,以上实施例的说明只是用于帮助理解本发明的方法及其核心思想;同时,对于本领域的一般技术人员,依据本发明的思想,在具体实施方式及应用范围上均会有改变之处,综上所述,本说明书内容不应理解为对本发明的限制。

Claims (7)

1.一种基于移动端的报表设置方法,其特征在于,包括:
确定盒子在移动端的位置和大小,根据所述盒子的位置和大小以及预设关系确定基础容器的位置和大小;
响应于第一裂变指令,基于所述第一裂变指令对所述基础容器进行裂变操作,以生成多个子容器,所述多个子容器均分所述基础容器;
响应于第二裂变指令,基于所述第二裂变指令对目标子容器进行裂变操作,以对所述目标子容器进行均分;
响应于第一拉伸指令,基于所述第一拉伸指令对所述盒子进行大小和位置调整,所述基础容器以及子容器随所述盒子的位置和大小而调整;
响应于第二拉伸指令,基于所述第二拉伸指令对所述目标子容器进行大小调整,其包括:
确定对所述目标子容器进行伸缩的边线,记为拉伸边线;
确定所述边线是否有对应相邻子容器;
根据所述拉伸方向调整所述目标子容器以及所述相邻子容器的大小,所述目标子容器与所述相邻子容器在第二拉伸指令执行前后的大小之和不变;
根据所述拉伸方向调整所述目标子容器以及所述相邻子容器的大小,包括:
确定相邻子容器与所述目标子容器进行伸缩的边线对应的边线,记为关联边线;
如果所述关联边线与所述拉伸边线完全重合,则沿所述拉伸方向调整所述拉伸边线的位置,以调整所述目标子容器和相邻子容器的大小;
如果所述关联边线为所述拉伸边线的一部分,则确定是否存在多个相邻子容器的集合所形成的关联边线是否与所述拉伸边线完全重合,如果存在,则沿所述拉伸方向调整所述拉伸边线的位置,以调整所述目标子容器和多个相邻子容器的集合的大小;
如果所述拉伸边线为关联边线的一部分,则不执行第二拉伸指令。
2.根据权利要求1所述的基于移动端的报表设置方法,其特征在于,确定盒子在移动端的位置和大小,根据所述盒子的位置和大小以及预设关系确定基础容器的位置和大小,包括:
设置盒子在移动端的大小,根据所述盒子的大小以及移动端显示屏幕的尺寸确定盒子在移动端的位置;
根据所述预设关系中的自动生成基础容器,所述预设关系为基础容器和盒子的横向边缘比例和纵向边缘比例;或者所述预设关系为基础容器和盒子的纵向间距尺寸和横向间距尺寸。
3.根据权利要求1所述的基于移动端的报表设置方法,其特征在于,响应于第一拉伸指令,基于所述第一拉伸指令对所述盒子进行大小和位置调整,所述基础容器以及子容器随所述盒子的位置和大小而调整,包括:
响应于第一拉伸指令,对所述盒子进行长度或/宽度的调整,确定所述移动端的显示屏幕的中心,将调整后的盒子的中心与所述显示屏幕的中心重合;
根据所述预设关系确定基础容器的位置和大小;
根据调整后的基础容器和子容器的对应关系调整各个子容器的位置和大小。
4.根据权利要求1-3任一项所述的基于移动端的报表设置方法,其特征在于,所述目标子容器为基础容器中的最小子容器;
确定所述目标子容器的方法为:
确定点击位置对应的最小子容器,将所述最小子容器作为目标子容器;
所述方法还包括:
在目标子容器中放置目标报表。
5.一种基于移动端的报表设置装置,其特征在于,其包括:
确定单元,用于确定盒子在移动端的位置和大小,根据所述盒子的位置和大小以及预设关系确定基础容器的位置和大小;
第一响应单元,用于响应于第一裂变指令,基于所述第一裂变指令对所述基础容器进行裂变操作,以生成多个子容器,所述多个子容器均分所述基础容器;
第二响应单元,用于响应于第二裂变指令,基于所述第二裂变指令对目标子容器进行裂变操作,以对所述目标子容器进行均分;
第三响应单元,用于响应于第一拉伸指令,基于所述第一拉伸指令对所述盒子进行大小和位置调整,所述基础容器以及子容器随所述盒子的位置和大小而调整;
第四响应单元,用于响应于第二拉伸指令,基于所述第二拉伸指令对所述目标子容器进行大小调整;
所述第四响应单元,其包括:
确定对所述目标子容器进行伸缩的边线,记为拉伸边线;
确定所述边线是否有对应相邻子容器;
根据所述拉伸方向调整所述目标子容器以及所述相邻子容器的大小,所述目标子容器与所述相邻子容器在第二拉伸指令执行前后的大小之和不变;
根据所述拉伸方向调整所述目标子容器以及所述相邻子容器的大小,包括:
确定相邻子容器与所述目标子容器进行伸缩的边线对应的边线,记为关联边线;
如果所述关联边线与所述拉伸边线完全重合,则沿所述拉伸方向调整所述拉伸边线的位置,以调整所述目标子容器和相邻子容器的大小;
如果所述关联边线为所述拉伸边线的一部分,则确定是否存在多个相邻子容器的集合所形成的关联边线是否与所述拉伸边线完全重合,如果存在,则沿所述拉伸方向调整所述拉伸边线的位置,以调整所述目标子容器和多个相邻子容器的集合的大小;
如果所述拉伸边线为关联边线的一部分,则不执行第二拉伸指令。
6.一种电子设备,其特征在于,包括:存储有可执行程序代码的存储器;与所述存储器耦合的处理器;所述处理器调用所述存储器中存储的所述可执行程序代码,用于执行权利要求1至4任一项所述的一种基于移动端的报表设置方法。
7.一种计算机可读存储介质,其特征在于,所述计算机可读存储介质存储计算机程序,其中,所述计算机程序使得计算机执行权利要求1至4任一项所述的一种基于移动端的报表设置方法。
CN202210500826.9A 2022-05-09 2022-05-09 基于移动端的报表设置方法、装置、电子设备及存储介质 Active CN114816186B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202210500826.9A CN114816186B (zh) 2022-05-09 2022-05-09 基于移动端的报表设置方法、装置、电子设备及存储介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202210500826.9A CN114816186B (zh) 2022-05-09 2022-05-09 基于移动端的报表设置方法、装置、电子设备及存储介质

Publications (2)

Publication Number Publication Date
CN114816186A CN114816186A (zh) 2022-07-29
CN114816186B true CN114816186B (zh) 2024-05-17

Family

ID=82513336

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202210500826.9A Active CN114816186B (zh) 2022-05-09 2022-05-09 基于移动端的报表设置方法、装置、电子设备及存储介质

Country Status (1)

Country Link
CN (1) CN114816186B (zh)

Citations (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101620591A (zh) * 2009-08-12 2010-01-06 国网电力科学研究院 一种基于单元格方式的组件化报表布局设计方法
WO2019104447A1 (en) * 2017-12-03 2019-06-06 Thomas Stachura Spreadsheet-based software application development
CN110866208A (zh) * 2019-10-10 2020-03-06 东软集团股份有限公司 一种页面的响应式布局方法、装置及设备
CN111506244A (zh) * 2020-04-24 2020-08-07 东莞市精驰软件有限公司 控件拖拽显示方法、系统、智能终端及存储介质
CN112346725A (zh) * 2020-11-05 2021-02-09 南方电网数字电网研究院有限公司 页面设计方法、装置、设备及存储介质
CN112416206A (zh) * 2020-12-04 2021-02-26 安徽鸿程光电有限公司 一种显示窗口调节方法、设备、电子设备及存储介质
CN113687808A (zh) * 2020-05-18 2021-11-23 Oppo广东移动通信有限公司 桌面图标的布局方法、装置、存储介质及电子设备
CN113835806A (zh) * 2021-09-18 2021-12-24 北京天融信网络安全技术有限公司 一种页面布局方法、装置、电子设备及存储介质
CN114077429A (zh) * 2020-08-18 2022-02-22 华为技术有限公司 一种显示界面的布局方法及电子设备

Family Cites Families (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US9933922B2 (en) * 2014-03-27 2018-04-03 Sybase, Inc. Child container control of parent container of a user interface
US10290128B2 (en) * 2015-11-10 2019-05-14 Adobe Inc. Interactive scene graph manipulation for visualization authoring
US20210200790A1 (en) * 2019-12-30 2021-07-01 Microstrategy Incorporated System and method for dossier creation with free-form layout

Patent Citations (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101620591A (zh) * 2009-08-12 2010-01-06 国网电力科学研究院 一种基于单元格方式的组件化报表布局设计方法
WO2019104447A1 (en) * 2017-12-03 2019-06-06 Thomas Stachura Spreadsheet-based software application development
CN110866208A (zh) * 2019-10-10 2020-03-06 东软集团股份有限公司 一种页面的响应式布局方法、装置及设备
CN111506244A (zh) * 2020-04-24 2020-08-07 东莞市精驰软件有限公司 控件拖拽显示方法、系统、智能终端及存储介质
CN113687808A (zh) * 2020-05-18 2021-11-23 Oppo广东移动通信有限公司 桌面图标的布局方法、装置、存储介质及电子设备
CN114077429A (zh) * 2020-08-18 2022-02-22 华为技术有限公司 一种显示界面的布局方法及电子设备
CN112346725A (zh) * 2020-11-05 2021-02-09 南方电网数字电网研究院有限公司 页面设计方法、装置、设备及存储介质
CN112416206A (zh) * 2020-12-04 2021-02-26 安徽鸿程光电有限公司 一种显示窗口调节方法、设备、电子设备及存储介质
CN113835806A (zh) * 2021-09-18 2021-12-24 北京天融信网络安全技术有限公司 一种页面布局方法、装置、电子设备及存储介质

Non-Patent Citations (1)

* Cited by examiner, † Cited by third party
Title
可视化Java界面模板集成开发工具的设计与实现;张文;潘荫荣;胡幼华;;扬州职业大学学报;20060330(第01期);33-36 *

Also Published As

Publication number Publication date
CN114816186A (zh) 2022-07-29

Similar Documents

Publication Publication Date Title
CN109783181B (zh) 屏幕适配显示方法、电子设备及计算机存储介质
US20210349615A1 (en) Resizing graphical user interfaces
US10606925B2 (en) Responsive grid layouts for graphic design
US9275479B2 (en) Method, system and computer program product for creating collages that visually resemble a particular shape or group of shapes
AU2019205973B2 (en) Responsive resize
US9715501B2 (en) Dimensional conversion in presentations
US9983760B2 (en) Apparatus, method and computer readable recording medium for arranging a plurality of items automatically in a canvas
CN112639791B (zh) 用于图形设计的多视图母版
CN106296622B (zh) 一种自动布局的拼图方法及装置
US8836704B2 (en) Automatic tree restriction
AU2021225277B2 (en) Image cropping method and apparatus, and device and storage medium
US11640283B2 (en) Control bar for element activation
US20230405460A1 (en) In-game display controlling method, device and electronic equipment
CN112433795B (zh) 电子书的仿真翻页方法、电子设备及计算机存储介质
CN111857704A (zh) 一种布局关系的代码生成方法及装置
CN112579927B (zh) 显示导航栏的方法和装置
CN103473282A (zh) 一种生成热点内容页面的装置和方法
CN114816186B (zh) 基于移动端的报表设置方法、装置、电子设备及存储介质
CN111580729B (zh) 一种重叠图元选中的处理方法、系统、可读存储介质及电子设备
CN112507268A (zh) 一种网页图片热区配置方法、装置、设备及可读存储介质
CN108564637B (zh) 几何模型排布方法及装置
EP3734431A1 (en) Image panning method
CN113468452B (zh) 遥感数据可视化界面交互方法、装置及电子设备
CN115033226A (zh) 页面显示方法、装置、终端设备及计算机可读存储介质
CN111259567B (zh) 一种布局图生成方法、装置和存储介质

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
GR01 Patent grant
GR01 Patent grant