一种用户悬停框缓冲方法及系统的制作方法

文档序号:10593709阅读:341来源:国知局
一种用户悬停框缓冲方法及系统的制作方法
【专利摘要】本发明公开了一种悬停框缓冲方法及系统,该方法包括如下步骤:获得触发器图标的位置;设置悬停框的展示位置;根据所述触发器图标所在的位置以及所述悬停框的展示位置设置缓冲区,触发器在所述缓冲区触发时,所述悬停框不收起;所述缓冲区的识别为:识别若干所述触发器图标的边界点位置,识别若干所述悬停框的边界点的位置,由上述边界点构成的多边形区域为缓冲区域。按照本发明实现的悬停框缓冲方法及系统,将该缓冲区域与触发器进行了有效的映射,使得多个触发器被触发时,能够兼容多个触发任务的响应,优化了用户的操作体验。
【专利说明】
一种用户悬停框缓冲方法及系统
技术领域
[0001]本发明属于网络技术领域,更具体地,涉及一种用户悬停框缓冲方法及系统。
【背景技术】
[0002]在现有技术的网站操作中,通过会将鼠标悬停于触发器图标上,在这样的情况之下,会随着鼠标的触发展示一个悬停框,可以在该悬停框中展示更多的详细资料或者是进行选项卡的设置。在大部分的页面设置中,在悬停框和图标处是存在一个断开的区域的,这个常见的断开区域的范围是从I像素到3像素不等,当鼠标经过这个断开区域的时候会处于既不接触触发器图标,也不接触悬停框的状态,会导致程序判断过程中出现触发状态丢失的情况,导致悬停框被很快收起。
[0003]现有技术中对上述问题的解决方式是,在用户鼠标离开触发器图标之后添加一个程序任务,例如当鼠标移出触发器图标区域时设定一个时间,让悬停框依然显示300ms,让鼠标在极短时间内处于断开区域时能让悬停框不被隐藏。但是这个方案在用户使用较长的鼠标移动路径的时候会发生极大程度的不兼容,长距离移动过程中超过了悬停框的显示时间会导致悬停框被隐藏。

【发明内容】

[0004]针对现有技术的以上缺陷或改进需求,本发明提供了一种用户悬停框缓冲方法和系统,由此解决现有技术中的多个触发器之间的兼容问题。
[0005]为实现上述目的,按照本发明的一个方面,提供了一种用户悬停框缓冲方法,其特征在于,该方法包括如下步骤:
[0006]获得触发器图标的位置;
[0007]设置悬停框的展示位置;
[0008]根据所述触发器图标所在的位置以及所述悬停框的展示位置设置缓冲区,触发器在所述缓冲区触发时,所述悬停框不收起,触发器离开所述缓冲区时,所述悬停框收起;
[0009]所述缓冲区的识别为:识别若干所述触发器图标的边界点位置,识别若干所述悬停框的边界点的位置,由上述边界点构成的多边形区域为缓冲区域。
[0010]进一步地,所述悬停框的展示位置在所述触发器图标的四周。
[0011]进一步地,所述触发器图标的边界点选择为对角的两个点,所述触发器图标的边界点选择为所述悬停框的靠近所述触发器图标最上端的两个点。
[0012]另一方面,本发明还提供了一种用户悬停框缓冲系统,其特征在于,该系统包括:
[0013]触发器图标识别模块,用于识别触发器图标的坐标;
[0014]触发点识别模块,用于识别触发点的位置坐标;
[0015]悬停框展示位置判定模块,用于接收所述触发器图标的坐标,以及用户终端上的会产生冲突显示的其它图标的坐标,来判定所述悬停框在触发器图标周围的显示位置,并实时生成悬停框显示位置的坐标;
[0016]缓冲区位置设定模块,用于接收所述触发器图标的坐标和所述悬停框显示位置的坐标,形成所述触发器图标和所述悬停框图标之间的缓冲区;
[0017]缓冲区缓冲逻辑设置模块,用于实时读取所述缓冲区位置设定模块中缓冲区的位置,进行缓冲逻辑的设定,所述缓冲逻辑为:触发器在所述缓冲区触发时,所述悬停框不收起,触发器离开所述缓冲区时,所述悬停框收起。
[0018]进一步地,所述悬停框的展示位置在所述触发器图标的四周。
[0019]总体而言,通过本发明所构思的以上技术方案与现有技术相比,能够取得下列有益效果:
[0020 ]针对现有技术中的300ms的时间范围之内,如果在300ms的时间范围之内多次执行触发器的触发,会导致悬浮框重叠,和多个任务的叠加的问题,导致多触发器之间移动的时候出现的不兼容,提出了一种全新的悬停框缓冲技术,即通过建立缓冲区的方式来保持触发器的触发,而触发器离开该缓冲区后,则停止触发,保证鼠标在移动过程中不丢失目标,优化用户的操作体验。
【附图说明】
[0021]图1为按照本发明实现的用户悬停框缓冲方法的执行示意框图;
[0022]图2为按照本发明实现的用户悬停框缓冲系统的模块结构示意图;
[0023]图3为按照本发明实现的用户悬停框缓冲的其中一种实施例的应用场景;
[0024]图4为按照本发明实现的用户悬停框缓冲的其中一种实施例的悬停框的计算场景示意图;
[0025]图5为按照本发明实现的用户悬停框缓冲的其中一种实施例的缓冲区域建立的示意图。
【具体实施方式】
[0026]为了使本发明的目的、技术方案及优点更加清楚明白,以下结合附图及实施例,对本发明进行进一步详细说明。应当理解,此处所描述的具体实施例仅仅用以解释本发明,并不用于限定本发明。此外,下面所描述的本发明各个实施方式中所涉及到的技术特征只要彼此之间未构成冲突就可以相互组合。
[0027]如图1所示,按照本发明的一个方面,首先提出了一种用户悬停框缓冲方法,其中该方法主要包括如下步骤:
[0028]获得触发器图标的位置;
[0029]设置悬停框的展示位置;
[0030]根据触发器图标所在的位置以及悬停框的展示位置设置多个缓冲区,在触发器在该缓冲区触发时,悬停框也不被隐藏,而触发器离开该缓冲区后,悬停框则被收起;
[0031 ]其中悬停框的展示位置的规则设置如下:
[0032]在触发器图标的周围一段距离范围内进行悬停框的展示,为使得用户能够较为方便的从触发器图标中跳转到悬停框中来选取相应的选项操作或者是观看信息。
[0033]其中在触发器图标周围的悬停框的位置可以根据实际显示情况灵活调整,例如可以根据悬停框与其它显示内容的冲突进行调整。
[0034]其中根据触发器图标所在的位置以及悬停框的位置设置缓冲区的方法为:
[0035]该缓冲区的建立规则如下:
[0036]识别触发器图标的边界点位置,识别悬停框的边界点的位置,由上述边界点构成的多变形区域则限定为缓冲区域。
[0037]当然这种边界点位置的选择方式可以采用多种方式,具体而言,主要是根据触发器图标和悬停框的位置来选择边界节点限定缓冲区域,一般而言,该多边形区域为四个边界节点构成的区域。
[0038]总而言之,按照本发明实现的用户悬停框缓冲方法,主要是在鼠标所停放的区域和悬停框之中通过页面位置判断计算建立了一个缓冲区域,该缓冲区域的计算主要是通过计算悬停框的位置,从而通过该位置建立一个缓冲区域,使得用户的鼠标在这整个区域中的触发都不会让悬停框消失,而离开该区域后,则悬停框收起,这样就不会存在多触发的兼容性问题。
[0039]具体而言,其中触发器图标可以是社交网络中用户图像,或者是用户姓名,或者是其他可以引发选项卡引出的图标;
[0040]悬停框可以是带有选项卡内容的展示框,也可以是点击用户图像所展示的用户资料?目息;
[0041]其中上述触发器图标的位置以及悬停框的位置的获取主要是用其在显示终端上的坐标来表达和进行处理;
[0042]缓冲区的缓冲逻辑设置方式为:使得鼠标在上述区域触发时,不会产生悬停框的收起。
[0043]如图2所示,另外一方面,本发明还提供了一种用户悬停框缓冲系统,该系统主要包括如下部分:
[0044]触发器图标识别模块,用于识别触发器图标的坐标;
[0045]鼠标触发点识别模块,用于识别鼠标触发的位置;
[0046]悬停框展示位置判定模块,用于接受触发器图标的坐标,以及终端上的会产生冲突显示的其它图,标的坐标,来判定悬停框在触发器图标周围的显示位置,并实时生成悬停框显示位置的坐标;
[0047]缓冲区位置设定模块,用于接受触发器图标的坐标和悬停框显示位置的坐标,形成触发器图标和悬停框图标之间的缓冲区;
[0048]缓冲区缓冲逻辑设置模块,其实时读取缓冲区位置设定模块中缓冲区的位置,从而来进行相应的缓冲逻辑的设定。
[0049]其中建立缓冲区位置的坐标是触发器图标的坐标和悬停框显示位置的边界上的坐标点,由此形成多边型的缓冲区域。
[0050]其中缓冲区缓冲逻辑的设置可以为多种形式,可以是添加程序任务,使得识别出鼠标在上述区域的时候,悬停框也不会收起。
[0051]其中,悬停框在触发器图标周围的显示位置的安定主要按照如下的形式:
[0052]获得一个触发器图标定位起始坐标(x,y),获得触发器图标的高度和宽度信息,获得可能产生冲突显示的其它图标的高度和宽度信息,通过上述信息的运算判定来解决悬停框在触发器周围哪个位置显示。
[0053]实施例1
[0054]如图3所示,其中展示了一种用户悬停框缓冲方法的【具体实施方式】的实施例,在本实施例中是采用社交网络中的用户头像展示的应用环境来做说明的,其中该用户头像在浏览器界面上进行显示,悬停框主要展示的是用户的详细资料信息,其中,按照本实施例,主要执行如下的步骤:
[0055]STEPl:获得头像图片的位置信息;并且建立该头像的定位起始坐标(x,y),该坐标值可以是头像图片的中心点,也可以是边界点,在其它的实施方式中可以做更为灵活的选择;
[0056]STEP2:设置悬停框的展示位置:
[0057]如图4所示,获得如下参数:浏览器窗口高度、浏览器窗口宽度、悬停框高度、悬停框宽度、悬停框图片的大小;
[0058]并按照如下规则执行悬停框的展示位置:
[0059]当浏览器窗口宽度-头像X坐标-悬停框宽度大于零,并且浏览器窗口高度-头像X坐标_(悬停框高度-100)大于零,则悬停框的默认展示位置为{x+75,y+75};
[0060]当浏览器窗口宽度-头像X坐标-悬停框宽度小于零,则悬停框的默认展示位置为&-悬停框宽度-25,7+75};
[0061]当浏览器窗口高度-头像y坐标-(悬停框高度-50)小于零,则悬停框的默认展示位置为{x+75,y-浏览器窗口高度-25};
[0062]当浏览器窗口宽度-头像X坐标-悬停框宽度小于零,并且浏览器窗口高度-头像X坐标_(悬停框高度-100)小于零,则悬停框的默认展示位置为Ix-悬停框宽度-25,y_浏览器窗口高度-25};
[0063]当然,在本实施例中主要是展示了在头像的四周进行图像显示的判断,主要是为了满足在浏览器宽度范围内进行相应显示的要求,但是在实际的操作中,还可以根据其它会产生冲突显示的图标来进行对比判断,从而生成悬停框的选择位置;
[0064]STEP3:建立缓冲区
[0065]按照如图5所示的方式来设置的缓冲区,基于位置的悬停框展示的位置不同,缓冲区域的计算方式不同,按照如图所示的位置范围,主要是以如下方式被计算:
[0066]位置1: C-B-G-H
[0067]位置2: A-D-G-H
[0068]位置3: A-D-E-F
[0069]位置4: C-B-E-F
[0070]当然,如前所述,对该缓冲区的形式并进行严格的限定,只要能够选择相应的图标和悬停框的边界点来生成缓冲区域即可。
[0071]STEP4:为缓冲区添加逻辑
[0072]完成建立缓冲区之后,就是添加逻辑,让用户鼠标在任意时间内停留于缓存区域中时均保持悬停框的持续展示,当然,上述逻辑并不严格限定为停留任意时间,为更加灵活地调整悬停框,上述逻辑的添加,还可使得上述悬停框停留一段比较长的时间。
[0073]按照本发明实现的用户悬停框多边形缓冲技术,改变了传统意义上的悬停和隐藏的交互方式,采用的全新的自动定位的方式重新定义了头像(触发器)和悬停框(面板)的关系,让用户在使用的过程中不会出现由于鼠标触发过程中悬停框的多触发的兼容性问题,提高了用户进行鼠标操作的体验。
[0074]本领域的技术人员容易理解,以上所述仅为本发明的较佳实施例而已,并不用以限制本发明,凡在本发明的精神和原则之内所作的任何修改、等同替换和改进等,均应包含在本发明的保护范围之内。
【主权项】
1.一种用户悬停框缓冲方法,其特征在于,该方法包括如下步骤: 获得触发器图标的位置; 设置悬停框的展示位置; 根据所述触发器图标所在的位置以及所述悬停框的展示位置设置缓冲区,触发器在所述缓冲区触发时,所述悬停框不收起,触发器离开所述缓冲区时,所述悬停框收起; 所述缓冲区的识别为:识别若干所述触发器图标的边界点位置,识别若干所述悬停框的边界点的位置,由上述边界点构成的多边形区域为缓冲区域。2.如权利要求1所述的用户悬停框缓冲方法,其特征在于,所述悬停框的展示位置在所述触发器图标的四周。3.如权利要求2所述的用户悬停框缓冲方法,其特征在于,所述触发器图标的边界点选择为对角的两个点,所述触发器图标的边界点选择为所述悬停框的靠近所述触发器图标最上端的两个点。4.一种用户悬停框缓冲系统,其特征在于,该系统包括: 触发器图标识别模块,用于识别触发器图标的坐标; 触发点识别模块,用于识别触发点的位置坐标; 悬停框展示位置判定模块,用于接收所述触发器图标的坐标,以及用户终端上的会产生冲突显示的其它图标的坐标,来判定所述悬停框在触发器图标周围的显示位置,并实时生成悬停框显示位置的坐标; 缓冲区位置设定模块,用于接收所述触发器图标的坐标和所述悬停框显示位置的坐标,形成所述触发器图标和所述悬停框图标之间的缓冲区; 缓冲区缓冲逻辑设置模块,用于实时读取所述缓冲区位置设定模块中缓冲区的位置,进行缓冲逻辑的设定,所述缓冲逻辑为:触发器在所述缓冲区触发时,所述悬停框不收起,触发器离开所述缓冲区时,所述悬停框收起。5.如权利要求4所述的用户悬停框缓冲系统,其特征在于,所述悬停框的展示位置在所述触发器图标的四周。
【文档编号】G06F3/0481GK105955589SQ201610481980
【公开日】2016年9月21日
【申请日】2016年6月27日
【发明人】冯畅
【申请人】武汉斗鱼网络科技有限公司
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1