一种基于锚点的界面动态布局方法、装置、电子设备及存储介质与流程

文档序号:25037394发布日期:2021-05-11 17:10阅读:来源:国知局

技术特征:

1.一种基于锚点的界面动态布局方法,其特征在于,包括:

s1,将第一界面划分为若干个第一像素,并将每个第一像素进行分类;

s2,根据每个第一像素的分类结果,计算各第一像素的宽度、高度,以及该第一像素到第一界面顶端、底端、左侧及右侧的距离;

s3,在每个第一像素的中心位置设置锚点,并以锚点为中心将各第一像素的宽度、高度以及该第一像素到第一界面顶端、底端、左侧及右侧的距离进行特定比例缩放,得到第二界面,其中,该特定比例为所述第二界面的高度与所述第一界面的高度之比。

2.根据权利要求1所述的基于锚点的界面动态布局方法,其特征在于,所述s1中将第一界面划分为若干第一像素,并将每个第一像素进行分类包括:

将第一界面划分为若干个第一像素,根据每个第一像素与所述第一界面的四边吸附特性,将各第一像素分为吸顶元素或吸底元素或吸左元素或吸右元素或按比例左右居中元素或按比例上下居中元素。

3.根据权利要求2所述的基于锚点的界面动态布局方法,其特征在于,所述吸顶元素、所述吸底元素、所述吸左元素、所述吸右元素、所述按比例左右居中元素及所述按比例上下居中元素的高度可自动变化。

4.根据权利要求3所述的基于锚点的界面动态布局方法,其特征在于,所述吸顶元素高度的一半与该吸顶元素顶部到所述第一界面顶部的距离之和不变;所述吸底元素高度的一半与该吸底元素底部到所述第一界面底部的距离之和不变;所述吸左元素宽度的一半与该吸左元素左边到所述第一界面左边的距离之和不变;所述吸右元素宽度的一半与该吸右元素右边到所述第一界面右边的距离之和不变;所述按比例左右居中元素的锚点到所述第一界面左右边的距离相等;所述按比例上下居中元素高度的一半和该元素顶部到所述第一界面顶部的距离之和与该元素高度的一半和该元素底部到所述第一界面底部的距离之和相等。

5.根据权利要求1所述的基于锚点的界面动态布局方法,其特征在于,所述s3中所述特定比例缩放包括:放大或缩小或不进行缩放。

6.根据权利要求3所述的基于锚点的界面动态布局方法,其特征在于,所述第一界面宽度与第二界面的宽度相等。

7.一种基于锚点的界面动态布局方法,其特征在于,包括:

s1,将第一界面划分为若干个第一像素,并将每个第一像素进行分类;

s2,根据每个第一像素的分类结果,分别计算各第一像素的宽度、高度,以及该第一像素到第一界面顶端、底端、左侧及右侧的距离;

s3,在每个第一像素的中心位置设置锚点,并以锚点为中心将各第一像素进行特定比例缩放,得到缩放后的第一像素;其中,该特定比例包括所述第二界面的高度与所述第一界面的高度之比和所述第二界面的宽度与所述第一界面的宽度之比;

s4,根据每个第一像素高度、宽度、特定缩放比例及第一像素到第一界面顶端、底端、左侧、右侧的距离,得到该第一像素对应的锚点偏移量;

s5,根据每个第一像素对应的锚点偏移量移动所述每个缩放后的第一像素,得到对应的第二像素,其中,每个第二像素构成第二界面。

8.根据权利要求7所述的基于锚点的界面动态布局方法,其特征在于,所述s3中该第一像素对应的锚点偏移量包括锚点竖直方向偏移量和锚点水平方向偏移量,所述锚点竖直方向偏移量offsetvertical与所述锚点水平方向偏移量offsethorizontal分别满足以下关系:

offsetvertical=realtop+height(n)×scale/2-height(n)/2

offsethorizontal=realanchorx-baseanchorx

其中,height(n)表示第n个第一像素的高度,scale为第二界面的高度与该第一界面的高度之比,realtop为第二像素顶部与第二界面顶部的距离,baseanchorx为每个第一像素的锚点横坐标,realanchorx为每个第二像素的锚点横坐标。

9.根据权利要求7所述的基于锚点的界面动态布局方法,其特征在于,所述s1中将第一界面划分为若干第一像素,并将每个第一像素进行分类包括:

将第一界面划分为若干个第一像素,根据每个第一像素与所述第一界面的四边吸附特性,将每个第一像素分为吸顶元素或吸底元素或吸左元素或吸右元素或按比例左右居中元素或按比例上下居中元素。

10.根据权利要求9所述的基于锚点的界面动态布局方法,其特征在于,所述吸顶元素、所述吸底元素、所述吸左元素、所述吸右元素、所述按比例左右居中元素及所述按比例上下居中元素的高度可自动变化。

11.一种基于锚点的界面动态布局装置,其特征在于,包括:

像素分类单元,用于将第一界面划分为若干个第一像素,并将每个第一像素进行分类;

像素距离计算模块,用于根据每个第一像素的分类分别计算各第一像素的宽度、高度,以及该第一像素到第一界面顶端、底端、左侧及右侧的距离;

像素缩放模块,用于在每个第一像素的中心位置设置锚点,并以锚点为中心将各第一像素的宽度、高度以及该第一像素到第一界面顶端、底端、左侧及右侧的距离进行特定比例缩放,得到第二界面,其中,该特定比例为所述第二界面的高度与所述第一界面的高度之比。

12.一种基于锚点的界面动态布局装置,其特征在于,包括:

像素分类单元,用于将第一界面划分为若干个第一像素,并将每个第一像素进行分类;

像素距离计算模块,用于根据每个第一像素的分类分别计算各第一像素的宽度、高度,以及该第一像素到第一界面顶端、底端、左侧及右侧的距离;

像素缩放模块,用于在每个第一像素的中心位置设置锚点,并以锚点为中心将各第一像素进行特定比例缩放,得到缩放后的第一像素;其中,该特定比例包括所述第二界面的高度与所述第一界面的高度之比和所述第二界面的宽度与所述第一界面的宽度之比;

锚点偏移量计算模块,用于根据每个第一像素高度、宽度、特定缩放比例及第一像素到第一界面顶端、底端、左侧、右侧的距离,得到该第一像素对应的锚点偏移量;

像素移动模块,用于根据每个第一像素对应的锚点偏移量移动所述每个缩放后的第一像素,得到对应的第二像素,其中,每个第二像素构成第二界面。

13.一种电子设备,包括:存储器,处理器及存储在存储器上并可在处理器上运行的计算机程序,其特征在于,所述处理器执行所述计算机程序时,实现如权利要求1至6任意一项所述的基于锚点的界面动态布局方法或如权利要求7至10任意一项所述的基于锚点的界面动态布局方法。

14.一种计算机可读存储介质,其上存储有计算机程序,其特征在于,所述计算机程序被处理器执行时,实现如权利要求1至6任意一项所述的基于锚点的界面动态布局方法或如权利要求7至10任意一项所述的基于锚点的界面动态布局方法。


技术总结
本公开提供了一种基于锚点的界面动态布局方法,包括:S1,将第一界面划分为若干个第一像素,并将每个第一像素进行分类;S2,根据每个第一像素的分类结果,计算各第一像素的宽度、高度,以及该第一像素到第一界面顶端、底端、左侧及右侧的距离;S3,在每个第一像素的中心位置设置锚点,并以锚点为中心将各第一像素的宽度、高度以及该第一像素到第一界面顶端、底端、左侧及右侧的距离进行特定比例缩放,得到第二界面,其中,该特定比例为第二界面的高度与第一界面的高度之比。本公开还提供了一种基于锚点的界面动态布局装置、电子设备及计算机可读存储介质。

技术研发人员:胡渊;白杰;王涛;辛丽娟
受保护的技术使用者:中国工商银行股份有限公司
技术研发日:2021.02.22
技术公布日:2021.05.11
当前第2页1 2 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1