图形界面显示方法、电子设备、介质以及程序产品技术

技术编号:35281640 阅读:26 留言:0更新日期:2022-10-22 12:24
本公开涉及一种图形界面显示方法、电子设备、计算机可读存储介质以及计算机程序产品。根据在此描述的图形界面显示方法,在电子设备的屏幕上显示M个用户界面UI元素,M为大于1的正整数。检测到作用于M个UI元素中的第一UI元素处、保持一持续时间的按压。响应于按压,使屏幕上的N个UI元素中的每个UI元素缩放,N为1与M

【技术实现步骤摘要】
图形界面显示方法、电子设备、介质以及程序产品


[0001]本公开总体上涉及信息
,并且更特别地涉及一种图形界面显示方法、电子设备、计算机可读存储介质以及计算机程序产品。

技术介绍

[0002]随着信息技术的发展,各种类型的电子设备被配备有各种类型的屏幕。为此,屏幕上的用户界面(UI)的显示效果及风格成为影响用户体验的关键要素。动画已经成为UI中至关重要的一部分。随着智能电话等电子设备的性能提高,动画也随之发展。高刷新率、高渲染度、高复杂度的动画越来越多。因此,需要进一步改进动画的显示,以提高用户体验。

技术实现思路

[0003]根据本公开的一些实施例,提供了一种图形界面显示方法、电子设备、介质以及程序产品,能够加强不同UI元素的动画效果之间的联系,突出各个独立UI元素之间的关系,使得UI的动画效果更符合用户的使用习惯,从而显著提高用户体验。
[0004]在本公开的第一方面,提供了一种图形界面显示方法。根据第一方面的图形界面显示方法,在电子设备的屏幕上显示M个用户界面UI元素,M为大于1的正整数。检测到作用于M个UI元素中的第一UI元素处、保持一持续时间的按压。响应于按压,使屏幕上的N个UI元素中的每个UI元素缩放,N为1与M

1之间的正整数。使N个UI元素缩放包括:确定第一UI元素与N个UI元素中的第二UI元素之间的距离;基于距离,来确定缩放第二UI元素的幅度;以及使第二UI元素以幅度缩放,以从视觉上指示按压。以此方式,能够加强不同UI元素的动画效果之间的联系,突出各个独立UI元素之间的关系,使得UI的动画效果更符合用户的使用习惯,从而显著提高用户体验。
[0005]在一些实现方式中,为了确定距离,可以确定第一UI元素的第一基准点和第二UI元素的第二基准点;以及确定第一基准点与第二基准点之间的距离作为距离。以此方式,可以基于所确定的UI元素的基准点来确定距离,从而提高所确定的距离的准确性和距离确定方式的灵活性,由此提高用户体验。
[0006]在一些实现方式中,为了确定距离,可以确定第一UI元素的第一基准点;从以第一基准点为圆心的、具有各自半径的多个圆中,确定与第二UI元素相交并且半径最小的目标圆;以及将目标圆的半径确定为距离。以此方式,可以更简单和方便地确定UI元素之间的距离,从而提高距离确定方式的灵活性,由此提高用户体验。
[0007]在一些实现方式中,为了确定距离,可以确定第一UI元素与第二UI元素之间的横向间距;确定第一UI元素与第二UI元素之间的纵向间距;以及基于如下任一项来确定距离:横向间距和纵向间距中的至少一者,或横向间距和纵向间距中的至少一者、以及从第二UI元素的第二基准点指向第一UI元素的第一基准点的方向。以此方式,可以基于UI元素之间的间距来确定UI元素之间的距离,从而提高距离确定方式的灵活性,由此提高用户体验。
[0008]在一些实现方式中,方法还可以包括:基于第一UI元素的尺寸来确定第一UI元素
的影响区域;以及将M个UI元素中在影响区域内的UI元素确定为N个UI元素。以此方式,可以基于被按压的UI元素的尺寸来确定跟随该UI元素进行联动缩放的UI元素,使得UI的动画效果更符合用户的使用习惯,从而显著提高用户体验。
[0009]在一些实现方式中,方法还可以包括:将M个UI元素中除第一UI元素以外的M

1个UI元素确定为N个UI元素。以此方式,可以使得屏幕上除了被按压的UI元素都跟随该UI元素进行联动缩放,从而更简单和方便地确定联动缩放的UI元素,使得UI的动画效果更符合用户的使用习惯,从而显著提高用户体验。
[0010]在一些实现方式中,为了确定幅度,可以确定第一UI元素响应于按压而缩放的第一幅度;以及基于如下任一项来确定第二UI元素响应于按压而缩放的幅度:第一幅度和距离,或第二UI元素的尺寸和第一UI元素的尺寸中的至少一者、第一幅度、以及距离。以此方式,可以使得第一UI元素的动画效果被传导到第二UI元素,并且进一步使得第二UI元素的动画效果基于第一UI元素与第二UI元素之间的距离以及第二UI元素的尺寸来确定,由此可以使得UI的动画效果更符合用户的使用习惯,从而显著提高用户体验。
[0011]在一些实现方式中,第一UI元素的缩放的第一幅度可以基于与第一UI元素相关联的以下至少一项来确定:第一UI元素的尺寸,第一UI元素能够发生变化的幅度范围,持续时间,和预定按压力。以此方式,可以基于与第一UI元素相关联的各种因素,直观、合理和灵活地确定第一UI元素的缩放的第一幅度,由此可以使得UI的动画效果更符合用户的使用习惯,从而显著提高用户体验。
[0012]在一些实现方式中,使第二UI元素缩放可以包括:基于距离确定一个延迟时间;以及响应于按压发生后经过了延迟时间,使第二UI元素缩放。以此方式,可以在视觉上呈现联动缩放随距离进行传播,使得UI的动画效果更符合用户的使用习惯,从而显著提高用户体验。
[0013]在一些实现方式中,使第二UI元素缩放可以包括:基于幅度随时间变化的预定义曲线,来确定第二UI元素响应于按压而缩放的速度。以此方式,可以基于幅度随时间变化的预定义曲线来方便地控制第一UI元素的缩放,使得UI的动画效果更符合用户的使用习惯,从而显著提高用户体验。
[0014]在一些实现方式中,预定义曲线可以为贝塞尔曲线或弹性力曲线。以此方式,可以基于贝塞尔曲线或弹性力曲线来方便地控制第一UI元素的缩放,使得UI的动画效果更符合用户的使用习惯,从而显著提高用户体验。
[0015]在一些实现方式中,方法还可以包括:将经缩放的第二UI元素恢复为第二UI元素。以此方式,可以使UI元素在松手后恢复,使得UI的动画效果更符合用户的使用习惯,从而显著提高用户体验。
[0016]在一些实现方式中,方法还可以包括:基于距离、持续时间、第一UI元素的尺寸和第二UI元素的尺寸中的至少一者,来确定移动第二UI元素的位移;以及使第二UI元素在从第二UI元素的第二基准点指向第一UI元素的第一基准点的方向上移动位移。以此方式,可以进一步加强不同UI元素的动画效果之间的联系,突出各个独立UI元素之间的关系,使得UI的动画效果更符合用户的使用习惯,从而显著提高用户体验。
[0017]在一些实现方式中,方法还可以包括:将第二UI元素从移动后的位置恢复为移动前的位置。以此方式,可以使UI元素在松手后恢复,使得UI的动画效果更符合用户的使用习
惯,从而显著提高用户体验。
[0018]在一些实现方式中,方法可以通过AAR格式文件、JAR格式文件和系统接口中的至少一者来实现。以此方式,可以简单和方便地实现具有联动缩放的图形界面显示。
[0019]在本公开的第二方面,提供了一种电子设备。电子设备包括处理器以及存储有指令的存储器,其中指令在被处理器执行时使得电子设备执行根据第一方面及其实现方式的任一方法。
[0020]在本公开的第三方面,提供了一种计算机可读存储介质。计算机可读本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种图形界面显示方法,包括:在电子设备的屏幕上显示M个用户界面UI元素,M为大于1的正整数;检测到作用于所述M个UI元素中的第一UI元素处、保持一持续时间的按压;响应于所述按压,使所述屏幕上的N个UI元素中的每个UI元素缩放,N为1与M

1之间的正整数,其中使所述N个UI元素缩放包括:确定所述第一UI元素与所述N个UI元素中的第二UI元素之间的距离;基于所述距离,来确定缩放所述第二UI元素的幅度;以及使所述第二UI元素以所述幅度缩放,以从视觉上指示所述按压。2.根据权利要求1所述的方法,其中确定所述距离包括:确定所述第一UI元素的第一基准点和所述第二UI元素的第二基准点;以及确定所述第一基准点与所述第二基准点之间的距离作为所述距离。3.根据权利要求1所述的方法,其中确定所述距离包括:确定所述第一UI元素的第一基准点;从以所述第一基准点为圆心的、具有各自半径的多个圆中,确定与所述第二UI元素相交并且半径最小的目标圆;以及将所述目标圆的半径确定为所述距离。4.根据权利要求1所述的方法,其中确定所述距离包括:确定所述第一UI元素与所述第二UI元素之间的横向间距;确定所述第一UI元素与所述第二UI元素之间的纵向间距;以及基于如下任一项来确定所述距离:所述横向间距和所述纵向间距中的至少一者,或所述横向间距和所述纵向间距中的至少一者、以及从所述第二UI元素的第二基准点指向所述第一UI元素的第一基准点的方向。5.根据权利要求1至4中任一项所述的方法,还包括:基于所述第一UI元素的尺寸来确定所述第一UI元素的影响区域;以及将所述M个UI元素中在所述影响区域内的UI元素确定为所述N个UI元素。6.根据权利要求1至4中任一项所述的方法,还包括:将所述M个UI元素中除所述第一UI元素以外的M

1个UI元素确定为所述N个UI元素。7.根据权利要求1至6中任一项所述的方法,其中确定所述幅度包括:确定所述第一UI元素响应于所述按压而缩放的第一幅度;以及基于如下任一项来确定所述第二UI元素响应于所述按压而缩放的幅度:所述第一幅度和所述距离,或...

【专利技术属性】
技术研发人员:卞超
申请(专利权)人:华为技术有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1