卡片布局方法及装置、电子设备、存储介质制造方法及图纸

本说明书提供一种卡片布局方法及装置、电子设备、存储介质，该方法可以包括：按照所述显示界面上的预设方向对所述显示界面上的卡片进行排序；依次针对所述显示界面上的卡片执行解决碰撞操作；其中，针对任一卡片执行的解决碰撞操作包括：确定与所述任一卡片发生碰撞的碰撞卡片；按照所述预设方向将所述碰撞卡片移动至位于所述任一卡片之后，且与所述任一卡片不发生碰撞的空余位置。

Card layout method and device, electronic equipment and storage medium

【技术实现步骤摘要】
卡片布局方法及装置、电子设备、存储介质
本说明书一个或多个实施例涉及图像处理
，尤其涉及一种卡片布局方法及装置、电子设备、存储介质。
技术介绍
区别于传统的表格式或者文本式呈现，数据可视化对于高维复杂场景有着更强的抽象能力，更易于理解。数据大盘/大屏都是数据可视化的典型应用场景，可以直观有效地表现出某一领域的趋势变化。在实际情况中，用户对于数据大盘的布局会随着关注维度重要性的变化而变化。
技术实现思路
有鉴于此，本说明书一个或多个实施例提供一种卡片布局方法及装置、电子设备、存储介质。为实现上述目的，本说明书一个或多个实施例提供技术方案如下：根据本说明书一个或多个实施例的第一方面，提出了一种卡片布局方法，应用于显示设备，所述显示设备的显示界面中包含多个卡片；所述方法包括：按照所述显示界面上的预设方向对所述显示界面上的卡片进行排序；依次针对所述显示界面上的卡片执行解决碰撞操作；其中，针对任一卡片执行的解决碰撞操作包括：确定与所述任一卡片发生碰撞的碰撞卡片；按照所述预设方向将所述碰撞卡片移动至位于所述任一卡片之后，且与所述任一卡片不发生碰撞的空余位置。可选的，所述按照所述显示界面上的预设方向对所述显示界面上的卡片进行排序，包括：当所述显示界面中的卡片被移动时，将该被移动的卡片作为第一个卡片；对在所述预设方向上位于该被移动的卡片之后的卡片进行排序。可选的，所述按照所述显示界面上的预设方向对所述显示界面上的卡片进行排序，包括：当监测到满足以下条件中至少之一时，按照所述预设方向对所述显示界面中的所有卡片进行排序：所述显示界面的尺寸规格发生变化、所述显示界面中的卡片被放大、所述显示界面中的卡片被缩小。可选的，在对所述显示界面上的卡片进行排序之前，所述方法还包括：将所述显示界面上的卡片沿所述预设方向紧缩；其中，任一卡片在发生碰撞或者边界与所述显示界面的边界重合的情况下停止紧缩。可选的，所述按照所述预设方向将所述碰撞卡片移动至位于所述任一卡片之后，且与所述任一卡片不发生碰撞的空余位置，包括：确定位于所述碰撞卡片之后且与所述碰撞卡片发生碰撞的障碍卡片；按照所述预设方向将所述障碍卡片移动至特定位置，所述特定位置为不与移动至所述空余位置后的所述碰撞卡片发生碰撞的位置；按照所述预设方向将所述碰撞卡片移动至所述空余位置。可选的，所述确定位于所述碰撞卡片之后且与所述碰撞卡片发生碰撞的障碍卡片，包括：按照所述预设方向遍历位于所述碰撞卡片之后的卡片；当遍历过程中的当前卡片未与所述碰撞卡片发生碰撞时，停止遍历操作，并将位于所述当前卡片之前的卡片作为所述障碍卡片。可选的，所述显示界面被按照预设数量的像素点为单位划分为若干栅格，所述显示界面上的卡片以所述栅格为单位进行移动。可选的，当所述预设方向包括所述显示界面上的垂直方向时，在垂直方向上相同的卡片被按照水平方向进行排序，当所述预设方向包括所述显示界面上的水平方向时，在水平方向上相同的卡片被按照垂直方向进行排序。可选的，还包括：当监测到满足以下条件中至少之一时，调整各卡片承载的可视化元素以适应变化后卡片的宽高：所述显示界面中的卡片被放大、所述显示界面中的卡片被缩小、所述显示界面的尺寸规格发生变化。根据本说明书一个或多个实施例的第二方面，提出了一种卡片布局装置，应用于显示设备，所述显示设备的显示界面中包含多个卡片；所述装置包括：排序单元，按照所述显示界面上的预设方向对所述显示界面上的卡片进行排序；布局单元，依次针对所述显示界面上的卡片执行解决碰撞操作；其中，针对任一卡片执行的解决碰撞操作包括：确定与所述任一卡片发生碰撞的碰撞卡片；按照所述预设方向将所述碰撞卡片移动至位于所述任一卡片之后，且与所述任一卡片不发生碰撞的空余位置。可选的，所述排序单元具体用于：当所述显示界面中的卡片被移动时，将该被移动的卡片作为第一个卡片；对在所述预设方向上位于该被移动的卡片之后的卡片进行排序。可选的，所述排序单元具体用于：当监测到满足以下条件中至少之一时，按照所述预设方向对所述显示界面中的所有卡片进行排序：所述显示界面的尺寸规格发生变化、所述显示界面中的卡片被放大、所述显示界面中的卡片被缩小。可选的，在对所述显示界面上的卡片进行排序之前，所述装置还包括：紧缩单元，将所述显示界面上的卡片沿所述预设方向紧缩；其中，任一卡片在发生碰撞或者边界与所述显示界面的边界重合的情况下停止紧缩。可选的，所述布局单元具体用于：确定位于所述碰撞卡片之后且与所述碰撞卡片发生碰撞的障碍卡片；按照所述预设方向将所述障碍卡片移动至特定位置，所述特定位置为不与移动至所述空余位置后的所述碰撞卡片发生碰撞的位置；按照所述预设方向将所述碰撞卡片移动至所述空余位置。可选的，所述布局单元进一步用于：按照所述预设方向遍历位于所述碰撞卡片之后的卡片；当遍历过程中的当前卡片未与所述碰撞卡片发生碰撞时，停止遍历操作，并将位于所述当前卡片之前的卡片作为所述障碍卡片。可选的，所述显示界面被按照预设数量的像素点为单位划分为若干栅格，所述显示界面上的卡片以所述栅格为单位进行移动。可选的，当所述预设方向包括所述显示界面上的垂直方向时，在垂直方向上相同的卡片被按照水平方向进行排序，当所述预设方向包括所述显示界面上的水平方向时，在水平方向上相同的卡片被按照垂直方向进行排序。可选的，还包括：调整单元，当监测到满足以下条件中至少之一时，调整各卡片承载的可视化元素以适应变化后卡片的宽高：所述显示界面中的卡片被放大、所述显示界面中的卡片被缩小、所述显示界面的尺寸规格发生变化。根据本说明书一个或多个实施例的第三方面，提出了一种电子设备，包括：处理器；用于存储处理器可执行指令的存储器；其中，所述处理器通过运行所述可执行指令以实现如上述任一实施例中所述的卡片布局方法。根据本公开实施例的第四方面，提供一种计算机可读存储介质，其上存储有计算机指令，该指令被处理器执行时实现如上述实施例中任一所述的卡片布局方法的步骤。附图说明图1是一示例性实施例提供的一种卡片布局方法的流程图。图2是一示例性实施例提供的另一种卡片布局方法的流程图。图3是一示例性实施例提供的初始化屏幕坐标系的示意图。图4-7是一示例性实施例提供的对卡片重新进行布局的示意图。图8是一示例性实施例提供的一种设备的结构示意图。图9是一示例性实施例提供的一种卡片布局装置的框图。具体实施方式这里将详细地对示例性实施例进行说明，其示例表示在附图中。下面的描述涉及附图时，除非另有表示，不同附图中的相同数字表示相同或相似的要素。以本文档来自技高网...

【技术保护点】
1.一种卡片布局方法，应用于显示设备，所述显示设备的显示界面中包含多个卡片；所述方法包括：/n按照所述显示界面上的预设方向对所述显示界面上的卡片进行排序；/n依次针对所述显示界面上的卡片执行解决碰撞操作；其中，针对任一卡片执行的解决碰撞操作包括：/n确定与所述任一卡片发生碰撞的碰撞卡片；/n按照所述预设方向将所述碰撞卡片移动至位于所述任一卡片之后，且与所述任一卡片不发生碰撞的空余位置。/n

【技术特征摘要】
1.一种卡片布局方法，应用于显示设备，所述显示设备的显示界面中包含多个卡片；所述方法包括：
按照所述显示界面上的预设方向对所述显示界面上的卡片进行排序；
依次针对所述显示界面上的卡片执行解决碰撞操作；其中，针对任一卡片执行的解决碰撞操作包括：
确定与所述任一卡片发生碰撞的碰撞卡片；
按照所述预设方向将所述碰撞卡片移动至位于所述任一卡片之后，且与所述任一卡片不发生碰撞的空余位置。


2.根据权利要求1所述的方法，所述按照所述显示界面上的预设方向对所述显示界面上的卡片进行排序，包括：
当所述显示界面中的卡片被移动时，将该被移动的卡片作为第一个卡片；
对在所述预设方向上位于该被移动的卡片之后的卡片进行排序。


3.根据权利要求1所述的方法，所述按照所述显示界面上的预设方向对所述显示界面上的卡片进行排序，包括：
当监测到满足以下条件中至少之一时，按照所述预设方向对所述显示界面中的所有卡片进行排序：
所述显示界面的尺寸规格发生变化、所述显示界面中的卡片被放大、所述显示界面中的卡片被缩小。


4.根据权利要求3所述的方法，在对所述显示界面上的卡片进行排序之前，所述方法还包括：
将所述显示界面上的卡片沿所述预设方向紧缩；
其中，任一卡片在发生碰撞或者边界与所述显示界面的边界重合的情况下停止紧缩。


5.根据权利要求1所述的方法，所述按照所述预设方向将所述碰撞卡片移动至位于所述任一卡片之后，且与所述任一卡片不发生碰撞的空余位置，包括：
确定位于所述碰撞卡片之后且与所述碰撞卡片发生碰撞的障碍卡片；
按照所述预设方向将所述障碍卡片移动至特定位置，所述特定位置为不与移动至所述空余位置后的所述碰撞卡片发生碰撞的位置；
按照所述预设方向将所述碰撞卡片移动至所述空余位置。


6.根据权利要求5所述的方法，所述确定位于所述碰撞卡片之后且与所述碰撞卡片发生碰撞的障碍卡片，包括：
按照所述预设方向遍历位于所述碰撞卡片之后的卡片；
当遍历过程中的当前卡片未与所述碰撞卡片发生碰撞时，停止遍历操作，并将位于所述当前卡片之前的卡片作为所述障碍卡片。


7.根据权利要求1所述的方法，所述显示界面被按照预设数量的像素点为单位划分为若干栅格，所述显示界面上的卡片以所述栅格为单位进行移动。


8.根据权利要求1所述的方法，当所述预设方向包括所述显示界面上的垂直方向时，在垂直方向上相同的卡片被按照水平方向进行排序，当所述预设方向包括所述显示界面上的水平方向时，在水平方向上相同的卡片被按照垂直方向进行排序。


9.根据权利要求1所述的方法，还包括：
当监测到满足以下条件中至少之一时，调整各卡片承载的可视化元素以适应变化后卡片的宽高：
所述显示界面中的卡片被放大、所述显示界面中的卡片被缩小、所述显示界面的尺寸规格发生变化。


10.一种卡片布局装置，应用于显示设备，所述显示设备的显示界面中包含多个卡片；所...

【专利技术属性】
技术研发人员：徐展，
申请(专利权)人：支付宝杭州信息技术有限公司，
类型：发明
国别省市：浙江;33