CN104915102A - 图形界面的交互方法及装置 - Google Patents
图形界面的交互方法及装置 Download PDFInfo
- Publication number
- CN104915102A CN104915102A CN201510359660.3A CN201510359660A CN104915102A CN 104915102 A CN104915102 A CN 104915102A CN 201510359660 A CN201510359660 A CN 201510359660A CN 104915102 A CN104915102 A CN 104915102A
- Authority
- CN
- China
- Prior art keywords
- distance
- switching times
- graphic element
- interface
- trigger pip
- 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.)
- Granted
Links
Landscapes
- Processing Or Creating Images (AREA)
Abstract
本发明公开了一种图形界面的交互方法及装置。其中,该方法包括:获取预先设置的第一图形元素和第二图形元素;利用第一图形元素中的预定区域和第二图形元素,对显示界面进行填充;获取触发信号;根据触发信号,将第一图形元素自预定区域向预定方向移动第一距离;根据触发信号,将第二图形元素向预定方向移动第二距离。本发明解决了现有技术中因使用利用动画软件制作的动态交互界面,导致的动态交互界面开发繁琐、通用性低的问题。
Description
技术领域
本发明涉及互联网领域,具体而言,涉及一种图形界面的交互方法及装置。
背景技术
近年来,随着移动互联网的发展,生活、学习、工作等都可以在网页上实现。而基于传统的按钮、图片组成的用户界面,已经无法满足需要了。
在功能日益同质化的今天,在做好应用功能本身的同时,其界面能否给用户带来新鲜感,也成为了越发的重要。在现有技术中,利用动画软件(例如Adobe Flash)制作的动态交互界面,因其绚丽的效果,以及良好的交互性能而深受用户欢迎。但是利用动画软件制作出的动态交互界面,其制作和修改的过程十分繁琐。并且,在运行动态交互界面时,需要调用特定的播放插件,通用性就受到了***中是否安装相应的播放插件的限制。同时,利用动画软件制作出的动态交互界面还存在***资源占用高等问题。上述问题,无论是开发人员的开发,还是终端用户的使用体验,都受到很大的影响。
针对现有技术中因使用利用动画软件制作的动态交互界面,导致的动态交互界面开发繁琐、通用性低的问题,目前尚未提出有效的解决方案。
发明内容
本发明的主要目的在于提供一种图形界面的交互方法及装置,以解决现有技术中因使用利用动画软件制作的动态交互界面,导致的动态交互界面开发繁琐、通用性低的问题。
为了实现上述目的,根据本发明实施例的一个方面,提供了一种图形界面的交互方法。该方法包括:获取预先设置的第一图形元素和第二图形元素;利用第一图形元素中的预定区域和第二图形元素,对显示界面进行填充;获取触发信号;根据触发信号,将第一图形元素自预定区域向预定方向移动第一距离;根据触发信号,将第二图形元素向预定方向移动第二距离。
进一步的,在获取预先设置的第一图形元素和第二图形元素之后,方法还包括:获取显示界面的界面分辨率和/或预先设置的切换次数,其中,切换次数为对显示界面内填充内容进行切换的次数;根据界面分辨率和/或切换次数,确定第一距离和第二距离。
进一步的,当单独获取界面分辨率时,根据界面分辨率和/或切换次数,确定第一距离和第二距离包括:根据界面分辨率和第一图形元素的第一图像分辨率,对第一图形元素进行切分,确定切换次数;根据切换次数和第一图像分辨率,确定第一距离;根据切换次数和第二图形元素的第二图像分辨率,确定第二距离。
进一步的,当单独获取切换次数时,根据界面分辨率和/或切换次数,确定第一距离和第二距离包括:根据切换次数和第一图形元素的第一图像分辨率,确定第一距离;根据切换次数和第二图形元素的第二图像分辨率,确定第二距离。
进一步的,当同时获取界面分辨率和切换次数时,根据界面分辨率和/或切换次数,确定第一距离和第二距离包括:根据界面分辨率和切换次数,对第一图形元素进行缩放得到第一图形元素的第三图像分辨率;根据切换次数和第三图像分辨率,确定第一距离;根据切换次数和第二图形元素的第二图像分辨率,确定第二距离。
进一步的,在获取触发信号之后,方法还包括:获取文字信息;根据触发信号和文字信息,切换在显示界面中显示的文字内容。
进一步的,根据触发信号和文字信息,切换在显示界面中显示的文字内容包括:根据文字信息和切换次数,确定与切换次数数量匹配的文字字段;根据所触发信号,依次切换显示界面中用于显示的文字字段。
进一步的,依次切换显示界面中用于显示的文字字段包括:根据触发信号,获取第一图形元素在切换的过程中实时的实际移动距离;根据实际移动距离和第一距离,计算得出实际移动距离和第一距离的切换比值;根据切换比值,调整文字字段的透明度属性。
为了实现上述目的,根据本发明实施例的另一方面,提供了一种图形界面的交互装置,该装置包括:第一获取模块,用于获取预先设置的第一图形元素和第二图形元素;填充模块,用于利用第一图形元素中的预定区域和第二图形元素,对显示界面进行填充;第二获取模块,用于获取触发信号;第一处理模块,用于根据触发信号,将第一图形元素自预定区域向预定方向移动第一距离;第二处理模块,用于根据触发信号,将第二图形元素向预定方向移动第二距离。
进一步的,装置还包括:第三获取模块,用于获取文字信息;第三处理模块,用于根据触发信号和文字信息,切换在显示界面中显示的文字内容。
根据发明实施例,通过获取预先设置的第一图形元素和第二图形元素;利用第一图形元素中的预定区域和第二图形元素,对显示界面进行填充;获取触发信号;根据触发信号,将第一图形元素自预定区域向预定方向移动第一距离;根据触发信号,将第二图形元素向预定方向移动第二距离,解决了现有技术中因使用利用动画软件制作的动态交互界面,导致的动态交互界面开发繁琐、通用性低的问题。达到了开发人员在不使用第三方动画软件的情况下,就可以简单快捷的开发动态交互界面的目的。通过上述实施例,可以通过两个叠加的图形元素的移动,实现动态交互的视觉效果。
附图说明
构成本申请的一部分的附图用来提供对本发明的进一步理解,本发明的示意性实施例及其说明用于解释本发明,并不构成对本发明的不当限定。在附图中:
图1是根据本发明实施例一的一种图形界面的交互方法的流程图;
图2是根据本发明实施例一可选的一种图形界面的交互方法的流程图;
图3是根据本发明实施例一可选的一种图形界面的交互方法的流程图;
图4是根据本发明实施例二的一种图形界面的交互装置的结构示意图;以及
图5是根据本发明实施例二可选的一种图形界面的交互装置的结构示意图。
具体实施方式
需要说明的是,在不冲突的情况下,本申请中的实施例及实施例中的特征可以相互组合。下面将参考附图并结合实施例来详细说明本发明。
为了使本技术领域的人员更好地理解本发明方案,下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本发明一部分的实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都应当属于本发明保护的范围。
需要说明的是,本发明的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象,而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换,以便这里描述的本发明的实施例。此外,术语“包括”和“具有”以及他们的任何变形,意图在于覆盖不排他的包含,例如,包含了一系列步骤或单元的过程、方法、***、产品或设备不必限于清楚地列出的那些步骤或单元,而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。
实施例1
本发明实施例提供了一种图形界面的交互方法,图1是根据本发明实施例的图形界面的交互方法的流程图,如图1所示,该方法包括步骤如下:
步骤S11,获取预先设置的第一图形元素和第二图形元素。
步骤S13,利用第一图形元素中的预定区域和第二图形元素,对显示界面进行填充。
步骤S15,获取触发信号。
步骤S17,根据触发信号,将第一图形元素自预定区域向预定方向移动第一距离。
步骤S19,根据触发信号,将第二图形元素向预定方向移动第二距离。
通过上述步骤S11至步骤S19,利用获取到的第一图形元素的预定区域作为背景图层,同时将第二图形元素叠加在背景图层之上。当获取到触发信号时,第一图形元素和第二图形元素分别按照预定的方向,移动不同的距,从而产生移动的效果。达到了开发人员在不使用第三方动画软件的情况下,就可以简单快捷的开发动态交互界面的目的。通过上述实施例,可以通过两个叠加的图形元素的移动,实现动态交互的视觉效果。从而解决了现有技术中因使用利用动画软件制作的动态交互界面,导致的动态交互界面开发繁琐、通用性低的问题。
作为一个可选实施例,可以将第一图形元素作为背景图层,利用第一图形元素中的预定区域对显示界面进行填充。当获取到触发信号时,可以将作为背景图层的第一图形元素向预定方向移动。其中,用于对显示界面进行填充的第一图形元素,在每一次移动时,用于填充显示界面的区域可以按照相同的方向进行移动,也可以按照不同的方向进行移动。当第一图形元素中用于填充显示界面的区域在以相同的方向进行移动的情况下,每当第一图形元素移动到一侧边缘后再获取到触发信号,则将使用第一图形元素的预定区域对显示界面进行填充。
作为一个可选实施例,在用于对显示界面进行填充的第一图形元素中的各个区域,边缘可以设置有部分重叠,使得两个区域的切换变得具有连贯性。
作为一个可选实施例,在对显示界面进行填充时,可以根据显示界面的大小对第二图形元素进行缩放,缩放至适合于显示的大小。或者,也可以结合第一图形元素的显示效果,调整第二图形元素的大小。从而使图形界面在移动时,第二图形元素和第一图形元素间产生视差,以提升第一图形元素和第二图形元素的显示效果。
作为一个可选实施例,触发信号可以是通过触敏屏幕获取到的触敏信号,也可以是通过键盘、鼠标等外界输入设备获取到的特定指令信号。其中,触敏信号又可以分为点击信号、滑动信号等。
作为一个可选实施例,当接收到的触发信号为滑动信号时,可以预先设置一个在预定方向上的预定距离。通过计算得到接收到的滑动信号在预定方向上的实际滑动距离和预定距离的移动比值。第一图形元素和/或第二图形元素根据上述移动比值,向预定方向进行移动。通过上述方法可以达到第一图形元素和/或第二图形元素随着手指滑动而滚动的效果,提高了图形界面在交互时的冲击感。
作为一个可选实施例,第二距离可以直接通过第一距离计算得出。具体的,首先将第一图形元素按照宽度等比缩放至屏幕宽度的N倍,然后,预先设置一个视差系数A。当对现实界面进行切换时,第一图形元素会向预定方形移动第一距离T,然后第二图形元素的第二移动距离可以通过T/A计算得出,这样,就实现了第一图形元素和第二图形元素以不同速率同时进行运动,以形成视差的效果。
作为一个可选实施例,如图2所示,在步骤S11获取预先设置的第一图形元素和第二图形元素之后,方法还可以包括:
步骤S121,获取显示界面的界面分辨率和/或预先设置的切换次数,其中,切换次数为对显示界面内填充内容进行切换的次数。
步骤S123,根据界面分辨率和/或切换次数,确定第一距离和第二距离。
具体的,通过步骤S121至步骤S123,既可以通过单独获取界面分辨率来确定第一距离和第二距离,也可以通过单独获取预先设置的切换次数来确定第一距离和第二距离,当然也可以同时获取界面分辨率和预先设置的切换次数来确定第一距离和第二距离。与上述三种方法对应着三种不同的算法,从而根据输入的不同条件,确定第一距离和第二距离。除此之外,当然也可以根据开发人员的需要,直接获取第一距离和第二距离。
作为一个可选实施例,当单独获取界面分辨率时,步骤S123根据界面分辨率和/或切换次数,确定第一距离和第二距离包括:
步骤S31a,根据界面分辨率和第一图形元素的第一图像分辨率,对第一图形元素进行切分,确定切换次数。
步骤S33a,根据切换次数和第一图像分辨率,确定第一距离。
步骤S35a,根据切换次数和第二图形元素的第二图像分辨率,确定第二距离。
在实际当中,同一个图形界面可能被应用于不同的设备当中。因此,可以通过步骤S31a至步骤S35a,首先获取用于显示图形界面的界面分辨率,根据界面分辨率对第一图形元素进行切分,从而确定对第一图形元素总的切换次数。然后,根据切换次数和第一图像分辨率、切换次数和第二图像分辨率,确定第一距离和第二距离。
作为一个可选实施例,当单独获取切换次数时,步骤S123根据界面分辨率和/或切换次数,确定第一距离和第二距离包括:
步骤S31b,根据切换次数和第一图形元素的第一图像分辨率,确定第一距离。
步骤S33b,根据切换次数和第二图形元素的第二图像分辨率,确定第二距离。
具体的,通过步骤S31b至步骤S33b,直接获取切换次数,从而根据切换次数和第一图像分辨率、切换次数和第二图像分辨率,确定第一距离和第二距离。
作为一个可选实施例,当同时获取界面分辨率和切换次数时,步骤S123根据界面分辨率和/或切换次数,确定第一距离和第二距离包括:
步骤S31c,根据界面分辨率和切换次数,对第一图形元素进行缩放得到第一图形元素的第三图像分辨率。
步骤S33c,根据切换次数和第三图像分辨率,确定第一距离。
步骤S35c,根据切换次数和第二图形元素的第二图像分辨率,确定第二距离。
具体的,通过步骤S31c和步骤S33c,可以根据界面分辨率和切换次数,计算得出背景图片的需求分辨率。根据需求分辨率,对第一图形元素进行等比例缩放,从而得到缩放后的第一图形元素的第三图像分辨率。最后,根据第三图像分辨率和切换次数,计算得到第一距离,根据第二图像分辨率和切换次数,计算得到第二距离。
作为一个可选实施例,如图3所示,在步骤S15获取触发信号之后,方法还包括:
步骤S161,获取文字信息。
步骤S163,根据触发信号和文字信息,切换在显示界面中显示的文字内容。
具体的,除了在显示界面当中显示第一图形元素和第二图形元素之外,还可以通过步骤S161至步骤S163,获取文字信息,使文字与图形元素配合显示,获得更好的显示效果。通过文字信息,对第一图形元素和第二图形元素所显示的内容进行解释说明,或者以图形元素和文字信息相结合的方式进行展示。
作为一个可选实施例,在步骤S163根据触发信号和文字信息,切换在显示界面中显示的文字内容中,可以包括:
步骤S1631,根据文字信息和切换次数,确定与切换次数数量匹配的文字字段。
步骤S1633,根据所触发信号,依次切换显示界面中用于显示的文字字段。
具体的,通过步骤S1631至步骤S1633,将获取到的文字信息,按照切换次数进行分段处理,得到与切换次数数量匹配的文字字段。根据触发信号,依次对文字信息中的不同文字字段进行展示。
作为一个可选实施例,文字字段可以是直接按照预先分好段落的文字信息直接确定的,也可以是根据整段文字信息中的标点符号和切换次数的数量确定得出的,在这里,不对文字信息进行具体限定。而文字信息的载体,可以是文本文件、xml文件等。
作为一个可选实施例,在步骤S1633根据所触发信号,依次切换显示界面中用于显示的文字字段中,还可以包括:
步骤S331,根据触发信号,获取第一图形元素在切换的过程中实时的实际移动距离。
步骤S333,根据实际移动距离和第一距离,计算得出实际移动距离和第一距离的切换比值。
步骤S335,根据切换比值,调整文字字段的透明度属性。
具体的,通过步骤S331至步骤S335,将文字字段的透明度与实际移动距离和第一距离的切换比值进行关联,使文字字段的透明度随着切换进程而发生变化,从而使文字字段在切换过程中,在视觉上产生过度,以达到提升切换的视觉效果的目的。
作为一个可选实施例,在实际运用当中,每对图形界面内的内容进行切换时,文字字段都会产生变化,并且文字部分都会有透明过度的变化效果。其中,文字部分的透明度的数值,是根据实际移动距离和第一距离的切换比值S确定的。例如,屏幕宽度是720,当前滑动了360,那切换比值S的值即为就是0.5。在取得切换比值S后,因为透明度的属性值是介于0-1之间的(即0是全透明,1是不透明),那么1-S就是文字部分的透明度属性值。
作为一个可选实施例,为了进一步的提升用户的使用体验,可以将文字部分透明度的更改设置为在第一图形元素在移动一段距离后再生效,那么,需要设置一个是否改变透明度数值的判断阈值C。其中,判断阈值C可以设置为0.8,如果透明度(1-S)>C,那么,将透明度设为1。
实施例2
本发明实施例还提供了一种图形界面的交互装置,如图4所示,该装置可以包括:第一获取模块21、填充模块23、第二获取模块25、第一处理模块27和第二处理模块29。
其中,第一获取模块21,用于获取预先设置的第一图形元素和第二图形元素。填充模块23,用于利用第一图形元素中的预定区域和第二图形元素,对显示界面进行填充。第二获取模块25,用于获取触发信号。第一处理模块27,用于根据触发信号,将第一图形元素自预定区域向预定方向移动第一距离。第二处理模块29,用于根据触发信号,将第二图形元素向预定方向移动第二距离。
通过上述第一获取模块21、填充模块23、第二获取模块25、第一处理模块27和第二处理模块29,利用获取到的第一图形元素的预定区域作为背景图层,同时将第二图形元素叠加在背景图层之上。当获取到触发信号时,第一图形元素和第二图形元素分别按照预定的方向,移动不同的距,从而产生移动的效果。达到了开发人员在不使用第三方动画软件的情况下,就可以简单快捷的开发动态交互界面的目的。通过上述实施例,可以通过两个叠加的图形元素的移动,实现动态交互的视觉效果。从而解决了现有技术中因使用利用动画软件制作的动态交互界面,导致的动态交互界面开发繁琐、通用性低的问题。
作为一个可选实施例,可以将第一图形元素作为背景图层,利用第一图形元素中的预定区域对显示界面进行填充。当获取到触发信号时,可以将作为背景图层的第一图形元素向预定方向移动。其中,用于对显示界面进行填充的第一图形元素,在每一次移动时,用于填充显示界面的区域可以按照相同的方向进行移动,也可以按照不同的方向进行移动。当第一图形元素中用于填充显示界面的区域在以相同的方向进行移动的情况下,每当第一图形元素移动到一侧边缘后再获取到触发信号,则将使用第一图形元素的预定区域对显示界面进行填充。
作为一个可选实施例,在用于对显示界面进行填充的第一图形元素中的各个区域,边缘可以设置有部分重叠,使得两个区域的切换变得具有连贯性。
作为一个可选实施例,在对显示界面进行填充时,可以根据显示界面的大小对第二图形元素进行缩放,缩放至适合于显示的大小。或者,也可以结合第一图形元素的显示效果,调整第二图形元素的大小。从而使图形界面在移动时,第二图形元素和第一图形元素间产生视差,以提升第一图形元素和第二图形元素的显示效果。
作为一个可选实施例,触发信号可以是通过触敏屏幕获取到的触敏信号,也可以是通过键盘、鼠标等外界输入设备获取到的特定指令信号。其中,触敏信号又可以分为点击信号、滑动信号等。
作为一个可选实施例,当接收到的触发信号为滑动信号时,可以预先设置一个在预定方向上的预定距离。通过计算得到接收到的滑动信号在预定方向上的实际滑动距离和预定距离的移动比值。第一图形元素和/或第二图形元素根据上述移动比值,向预定方向进行移动。通过上述方法可以达到第一图形元素和/或第二图形元素随着手指滑动而滚动的效果,提高了图形界面在交互时的冲击感。
作为一个可选实施例,第二距离可以直接通过第一距离计算得出。具体的,首先将第一图形元素按照宽度等比缩放至屏幕宽度的N倍,然后,预先设置一个视差系数A。当对现实界面进行切换时,第一图形元素会向预定方形移动第一距离T,然后第二图形元素的第二移动距离可以通过T/A计算得出,这样,就实现了第一图形元素和第二图形元素以不同速率同时进行运动,以形成视差的效果。
作为一个可选实施例,在上述图形界面的交互装置还可以包括:第四获取模块和第四处理模块。
其中,第四获取模块,用于获取显示界面的界面分辨率和/或预先设置的切换次数,其中,切换次数为对显示界面内填充内容进行切换的次数。第四处理模块,用于根据界面分辨率和/或切换次数,确定第一距离和第二距离。
具体的,通过上述第四获取模块和第四处理模块,既可以通过单独获取界面分辨率来确定第一距离和第二距离,也可以通过单独获取预先设置的切换次数来确定第一距离和第二距离,当然也可以同时获取界面分辨率和预先设置的切换次数来确定第一距离和第二距离。与上述三种方法对应着三种不同的算法,从而根据输入的不同条件,确定第一距离和第二距离。除此之外,当然也可以根据开发人员的需要,直接获取第一距离和第二距离。
作为一个可选实施例,如图5所示,上述装置还包括:第三获取模块261和第三处理模块263。
其中,第三获取模块261,用于获取文字信息;第三处理模块263,用于根据触发信号和文字信息,切换在显示界面中显示的文字内容。
具体的,除了在显示界面当中显示第一图形元素和第二图形元素之外,还可以通过第三获取模块261和第三处理模块263,获取文字信息,使文字与图形元素配合显示,获得更好的显示效果。通过文字信息,对第一图形元素和第二图形元素所显示的内容进行解释说明,或者以图形元素和文字信息相结合的方式进行展示。
作为一个可选实施例,在第三处理模块263中,还可以执行如下步骤:
步骤1,根据文字信息和切换次数,确定与切换次数数量匹配的文字字段。
步骤2,根据所触发信号,依次切换显示界面中用于显示的文字字段。
具体的,通过上述步骤,将获取到的文字信息,按照切换次数进行分段处理,得到与切换次数数量匹配的文字字段。根据触发信号,依次对文字信息中的不同文字字段进行展示。
作为一个可选实施例,文字字段可以是直接按照预先分好段落的文字信息直接确定的,也可以是根据整段文字信息中的标点符号和切换次数的数量确定得出的,在这里,不对文字信息进行具体限定。而文字信息的载体,可以是文本文件、xml文件等。
作为一个可选实施例,在上述步骤2根据所触发信号,依次切换显示界面中用于显示的文字字段中,还可以包括:
步骤2.1,根据触发信号,获取第一图形元素在切换的过程中实时的实际移动距离。
步骤2.2,根据实际移动距离和第一距离,计算得出实际移动距离和第一距离的切换比值。
步骤2.3,根据切换比值,调整文字字段的透明度属性。
具体的,通过上述步骤,可以将文字字段的透明度与实际移动距离和第一距离的切换比值进行关联,使文字字段的透明度随着切换进程而发生变化,从而使文字字段在切换过程中,在视觉上产生过度,以达到提升切换的视觉效果的目的。
需要说明的是,对于前述的各方法实施例,为了简单描述,故将其都表述为一系列的动作组合,但是本领域技术人员应该知悉,本发明并不受所描述的动作顺序的限制,因为依据本发明,某些步骤可以采用其他顺序或者同时进行。其次,本领域技术人员也应该知悉,说明书中所描述的实施例均属于优选实施例,所涉及的动作和模块并不一定是本发明所必须的。
在上述实施例中,对各个实施例的描述都各有侧重,某个实施例中没有详述的部分,可以参见其他实施例的相关描述。
在本申请所提供的几个实施例中,应该理解到,所揭露的装置,可通过其它的方式实现。例如,以上所描述的装置实施例仅仅是示意性的,例如所述单元的划分,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式,例如多个单元或组件可以结合或者可以集成到另一个***,或一些特征可以忽略,或不执行。另一点,所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口,装置或单元的间接耦合或通信连接,可以是电性或其它的形式。
所述作为分离部件说明的单元可以是或者也可以不是物理上分开的,作为单元显示的部件可以是或者也可以不是物理单元,即可以位于一个地方,或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。
另外,在本发明各个实施例中的各功能单元可以集成在一个处理单元中,也可以是各个单元单独物理存在,也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现,也可以采用软件功能单元的形式实现。
所述集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时,可以存储在一个计算机可读取存储介质中。基于这样的理解,本发明的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储介质中,包括若干指令用以使得一台计算机设备(可为个人计算机、移动终端、服务器或者网络设备等)执行本发明各个实施例所述方法的全部或部分步骤。而前述的存储介质包括:U盘、只读存储器(ROM,Read-Only Memory)、随机存取存储器(RAM,Random Access Memory)、移动硬盘、磁碟或者光盘等各种可以存储程序代码的介质。
以上所述仅为本发明的优选实施例而已,并不用于限制本发明,对于本领域的技术人员来说,本发明可以有各种更改和变化。凡在本发明的精神和原则之内,所作的任何修改、等同替换、改进等,均应包含在本发明的保护范围之内。
Claims (10)
1.一种图形界面的交互方法,其特征在于,包括:
获取预先设置的第一图形元素和第二图形元素;
利用所述第一图形元素中的预定区域和所述第二图形元素,对显示界面进行填充;
获取触发信号;
根据所述触发信号,将所述第一图形元素自所述预定区域向预定方向移动第一距离;
根据所述触发信号,将所述第二图形元素向所述预定方向移动第二距离。
2.根据权利要求1所述的方法,其特征在于,在获取预先设置的第一图形元素和第二图形元素之后,所述方法还包括:
获取所述显示界面的界面分辨率和/或预先设置的切换次数,其中,所述切换次数为对所述显示界面内填充内容进行切换的次数;
根据界面分辨率和/或所述切换次数,确定所述第一距离和所述第二距离。
3.根据权利要求2所述的方法,其特征在于,当单独获取所述界面分辨率时,根据界面分辨率和/或所述切换次数,确定所述第一距离和所述第二距离包括:
根据所述界面分辨率和所述第一图形元素的第一图像分辨率,对所述第一图形元素进行切分,确定所述切换次数;
根据所述切换次数和所述第一图像分辨率,确定所述第一距离;
根据所述切换次数和第二图形元素的第二图像分辨率,确定所述第二距离。
4.根据权利要求2所述的方法,其特征在于,当单独获取所述切换次数时,根据界面分辨率和/或所述切换次数,确定所述第一距离和所述第二距离包括:
根据所述切换次数和所述第一图形元素的第一图像分辨率,确定所述第一距离;
根据所述切换次数和第二图形元素的第二图像分辨率,确定所述第二距离。
5.根据权利要求2所述的方法,其特征在于,当同时获取界面分辨率和所述切换次数时,所述根据界面分辨率和/或所述切换次数,确定所述第一距离和所述第二距离包括:
根据所述界面分辨率和所述切换次数,对所述第一图形元素进行缩放得到所述第一图形元素的第三图像分辨率;
根据所述切换次数和所述第三图像分辨率,确定所述第一距离;
根据所述切换次数和第二图形元素的第二图像分辨率,确定所述第二距离。
6.根据权利要求2至5中任意一项所述的方法,其特征在于,在获取触发信号之后,所述方法还包括:
获取文字信息;
根据所述触发信号和所述文字信息,切换在所述显示界面中显示的文字内容。
7.根据权利要求6所述的方法,其特征在于,根据所述触发信号和所述文字信息,切换在所述显示界面中显示的文字内容包括:
根据所述文字信息和所述切换次数,确定与所述切换次数数量匹配的文字字段;
根据所触发信号,依次切换所述显示界面中用于显示的所述文字字段。
8.根据权利要求7所述的方法,其特征在于,根据所触发信号,依次切换所述显示界面中用于显示的所述文字字段包括:
根据所述触发信号,获取所述第一图形元素在切换的过程中实时的实际移动距离;
根据所述实际移动距离和所述第一距离,计算得出所述实际移动距离和所述第一距离的切换比值;
根据所述切换比值,调整所述文字字段的透明度属性。
9.一种图形界面的交互装置,其特征在于,包括:
第一获取模块,用于获取预先设置的第一图形元素和第二图形元素;
填充模块,用于利用所述第一图形元素中的预定区域和所述第二图形元素,对显示界面进行填充;
第二获取模块,用于获取触发信号;
第一处理模块,用于根据所述触发信号,将所述第一图形元素自所述预定区域向预定方向移动第一距离;
第二处理模块,用于根据所述触发信号,将所述第二图形元素向所述预定方向移动第二距离。
10.根据权利要求9所述的装置,其特征在于,所述装置还包括:
第三获取模块,用于获取文字信息;
第三处理模块,用于根据所述触发信号和所述文字信息,切换在所述显示界面中显示的文字内容。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201510359660.3A CN104915102B (zh) | 2015-06-25 | 2015-06-25 | 图形界面的交互方法及装置 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201510359660.3A CN104915102B (zh) | 2015-06-25 | 2015-06-25 | 图形界面的交互方法及装置 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN104915102A true CN104915102A (zh) | 2015-09-16 |
CN104915102B CN104915102B (zh) | 2018-09-07 |
Family
ID=54084211
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201510359660.3A Expired - Fee Related CN104915102B (zh) | 2015-06-25 | 2015-06-25 | 图形界面的交互方法及装置 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN104915102B (zh) |
Cited By (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN108845737A (zh) * | 2018-06-29 | 2018-11-20 | 掌阅科技股份有限公司 | 图片错层显示方法、电子设备及存储介质 |
CN109002241A (zh) * | 2018-06-29 | 2018-12-14 | 掌阅科技股份有限公司 | 视图错层显示方法、电子设备及存储介质 |
CN114205457A (zh) * | 2020-08-29 | 2022-03-18 | 华为技术有限公司 | 一种移动用户界面元素的方法及电子设备 |
Citations (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101087459A (zh) * | 2006-06-09 | 2007-12-12 | 三星电子株式会社 | 提供菜单图标的便携式装置和方法 |
CN103473799A (zh) * | 2013-09-02 | 2013-12-25 | 腾讯科技(深圳)有限公司 | 一种图片的动态处理方法及装置、终端设备 |
CN103677553A (zh) * | 2012-09-14 | 2014-03-26 | 腾讯科技(深圳)有限公司 | 一种实现动态背景的方法和装置 |
WO2015038337A1 (en) * | 2013-09-16 | 2015-03-19 | Thomson Licensing | Method and apparatus for caption parallax over image while scrolling |
-
2015
- 2015-06-25 CN CN201510359660.3A patent/CN104915102B/zh not_active Expired - Fee Related
Patent Citations (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101087459A (zh) * | 2006-06-09 | 2007-12-12 | 三星电子株式会社 | 提供菜单图标的便携式装置和方法 |
CN103677553A (zh) * | 2012-09-14 | 2014-03-26 | 腾讯科技(深圳)有限公司 | 一种实现动态背景的方法和装置 |
CN103473799A (zh) * | 2013-09-02 | 2013-12-25 | 腾讯科技(深圳)有限公司 | 一种图片的动态处理方法及装置、终端设备 |
WO2015038337A1 (en) * | 2013-09-16 | 2015-03-19 | Thomson Licensing | Method and apparatus for caption parallax over image while scrolling |
Cited By (7)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN108845737A (zh) * | 2018-06-29 | 2018-11-20 | 掌阅科技股份有限公司 | 图片错层显示方法、电子设备及存储介质 |
CN109002241A (zh) * | 2018-06-29 | 2018-12-14 | 掌阅科技股份有限公司 | 视图错层显示方法、电子设备及存储介质 |
CN109002241B (zh) * | 2018-06-29 | 2019-06-18 | 掌阅科技股份有限公司 | 视图错层显示方法、电子设备及存储介质 |
WO2020001024A1 (zh) * | 2018-06-29 | 2020-01-02 | 掌阅科技股份有限公司 | 视图错层显示方法、电子设备及存储介质 |
WO2020001028A1 (zh) * | 2018-06-29 | 2020-01-02 | 掌阅科技股份有限公司 | 图片错层显示方法、电子设备及存储介质 |
CN114205457A (zh) * | 2020-08-29 | 2022-03-18 | 华为技术有限公司 | 一种移动用户界面元素的方法及电子设备 |
CN114205457B (zh) * | 2020-08-29 | 2023-05-16 | 华为技术有限公司 | 一种移动用户界面元素的方法、电子设备及存储介质 |
Also Published As
Publication number | Publication date |
---|---|
CN104915102B (zh) | 2018-09-07 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN104756060B (zh) | 基于手势的光标控制 | |
Ens et al. | Ivy: Exploring spatially situated visual programming for authoring and understanding intelligent environments | |
US8127246B2 (en) | Varying user interface element based on movement | |
CN103914260B (zh) | 基于触摸屏的操作对象的控制方法及装置 | |
US20120249542A1 (en) | Electronic apparatus to display a guide with 3d view and method thereof | |
CN106658139B (zh) | 一种焦点控制方法及装置 | |
CN104571877A (zh) | 一种页面的显示处理方法及装置 | |
CN105488833A (zh) | 一种对2d控件实现3d转场动画的方法和装置 | |
CN103605461A (zh) | 一种应用界面显示方法及终端 | |
CN104615418A (zh) | 一种可滑动播放窗口的实现方法和装置 | |
CN102385475A (zh) | 电子设备及其交互方法 | |
CN104090701A (zh) | 信息处理方法及电子设备 | |
CN104571842A (zh) | 一种信息处理方法及电子设备 | |
CN104020935A (zh) | 用于控制显示屏上的显示对象的方法和装置 | |
CN106548504B (zh) | 网页动画生成方法及装置 | |
CN104598121A (zh) | 一种图片缩放方法和装置 | |
CN108491140B (zh) | 互动内容的展示方法及装置 | |
CN104915102A (zh) | 图形界面的交互方法及装置 | |
CN104571904A (zh) | 一种信息处理方法及电子设备 | |
CN103488424A (zh) | 一种信息展示的方法及装置 | |
US20140215383A1 (en) | Parallax scrolling user interface | |
EP2965289A1 (en) | Generating screen data | |
CN104808949A (zh) | 一种页面调整方法及移动终端 | |
CN105094503A (zh) | 一种信息处理方法以及可形变的电子设备 | |
CN109753198A (zh) | 界面访问方法、显示方法、设备、介质 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
C06 | Publication | ||
PB01 | Publication | ||
C10 | Entry into substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant | ||
CF01 | Termination of patent right due to non-payment of annual fee |
Granted publication date: 20180907 Termination date: 20210625 |
|
CF01 | Termination of patent right due to non-payment of annual fee |