CN105955589B - 一种用户悬停框缓冲方法及*** - Google Patents

一种用户悬停框缓冲方法及*** Download PDF

Info

Publication number
CN105955589B
CN105955589B CN201610481980.0A CN201610481980A CN105955589B CN 105955589 B CN105955589 B CN 105955589B CN 201610481980 A CN201610481980 A CN 201610481980A CN 105955589 B CN105955589 B CN 105955589B
Authority
CN
China
Prior art keywords
frame
hovering
trigger
buffer area
buffer
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.)
Active
Application number
CN201610481980.0A
Other languages
English (en)
Other versions
CN105955589A (zh
Inventor
冯畅
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Wuhan Douyu Network Technology Co Ltd
Original Assignee
Wuhan Douyu Network Technology Co Ltd
Priority date (The priority date 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 date listed.)
Filing date
Publication date
Application filed by Wuhan Douyu Network Technology Co Ltd filed Critical Wuhan Douyu Network Technology Co Ltd
Priority to CN201610481980.0A priority Critical patent/CN105955589B/zh
Publication of CN105955589A publication Critical patent/CN105955589A/zh
Application granted granted Critical
Publication of CN105955589B publication Critical patent/CN105955589B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • G06F3/04817Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance using icons

Landscapes

  • Engineering & Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Human Computer Interaction (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本发明公开了一种悬停框缓冲方法及***,该方法包括如下步骤:获得触发器图标的位置;设置悬停框的展示位置;根据所述触发器图标所在的位置以及所述悬停框的展示位置设置缓冲区,触发器在所述缓冲区触发时,所述悬停框不收起;所述缓冲区的识别为:识别若干所述触发器图标的边界点位置,识别若干所述悬停框的边界点的位置,由上述边界点构成的多边形区域为缓冲区域。按照本发明实现的悬停框缓冲方法及***,将该缓冲区域与触发器进行了有效的映射,使得多个触发器被触发时,能够兼容多个触发任务的响应,优化了用户的操作体验。

Description

一种用户悬停框缓冲方法及***
技术领域
本发明属于网络技术领域,更具体地,涉及一种用户悬停框缓冲方法及***。
背景技术
在现有技术的网站操作中,通过会将鼠标悬停于触发器图标上,在这样的情况之下,会随着鼠标的触发展示一个悬停框,可以在该悬停框中展示更多的详细资料或者是进行选项卡的设置。在大部分的页面设置中,在悬停框和图标处是存在一个断开的区域的,这个常见的断开区域的范围是从1像素到3像素不等,当鼠标经过这个断开区域的时候会处于既不接触触发器图标,也不接触悬停框的状态,会导致程序判断过程中出现触发状态丢失的情况,导致悬停框被很快收起。
现有技术中对上述问题的解决方式是,在用户鼠标离开触发器图标之后添加一个程序任务,例如当鼠标移出触发器图标区域时设定一个时间,让悬停框依然显示300ms,让鼠标在极短时间内处于断开区域时能让悬停框不被隐藏。但是这个方案在用户使用较长的鼠标移动路径的时候会发生极大程度的不兼容,长距离移动过程中超过了悬停框的显示时间会导致悬停框被隐藏。
发明内容
针对现有技术的以上缺陷或改进需求,本发明提供了一种用户悬停框缓冲方法和***,由此解决现有技术中的多个触发器之间的兼容问题。
为实现上述目的,按照本发明的一个方面,提供了一种用户悬停框缓冲方法,其特征在于,该方法包括如下步骤:
获得触发器图标的位置;
设置悬停框的展示位置;
根据所述触发器图标所在的位置以及所述悬停框的展示位置设置缓冲区,触发器在所述缓冲区触发时,所述悬停框不收起,触发器离开所述缓冲区时,所述悬停框收起;
所述缓冲区的设置方法为:识别若干所述触发器图标的边界点位置,识别若干所述悬停框的边界点的位置,由上述边界点构成的多边形区域为缓冲区。
进一步地,所述悬停框的展示位置在所述触发器图标的四周。
进一步地,所述触发器图标的边界点选择为对角的两个点,所述悬停框的边界点选择为所述悬停框的靠近所述触发器图标最上端的两个点。
另一方面,本发明还提供了一种用户悬停框缓冲***,其特征在于,该***包括:
触发器图标识别模块,用于识别触发器图标的坐标;
触发点识别模块,用于识别触发点的位置坐标;
悬停框展示位置判定模块,用于接收所述触发器图标的坐标,以及用户终端上的会产生冲突显示的其它图标的坐标,来判定所述悬停框在触发器图标周围的显示位置,并实时生成悬停框显示位置的坐标;
缓冲区位置设定模块,用于接收所述触发器图标的坐标和所述悬停框显示位置的坐标,形成所述触发器图标和所述悬停框图标之间的缓冲区;
缓冲区缓冲逻辑设置模块,用于实时读取所述缓冲区位置设定模块中缓冲区的位置,进行缓冲逻辑的设定,所述缓冲逻辑为:触发器在所述缓冲区触发时,所述悬停框不收起,触发器离开所述缓冲区时,所述悬停框收起。
进一步地,所述悬停框的展示位置在所述触发器图标的四周。
总体而言,通过本发明所构思的以上技术方案与现有技术相比,能够取得下列有益效果:
针对现有技术中的300ms的时间范围之内,如果在300ms的时间范围之内多次执行触发器的触发,会导致悬浮框重叠,和多个任务的叠加的问题,导致多触发器之间移动的时候出现的不兼容,提出了一种全新的悬停框缓冲技术,即通过建立缓冲区的方式来保持触发器的触发,而触发器离开该缓冲区后,则停止触发,保证鼠标在移动过程中不丢失目标,优化用户的操作体验。
附图说明
图1为按照本发明实现的用户悬停框缓冲方法的执行示意框图;
图2为按照本发明实现的用户悬停框缓冲***的模块结构示意图;
图3为按照本发明实现的用户悬停框缓冲的其中一种实施例的应用场景;
图4为按照本发明实现的用户悬停框缓冲的其中一种实施例的悬停框的计算场景示意图;
图5为按照本发明实现的用户悬停框缓冲的其中一种实施例的缓冲区域建立的示意图。
具体实施方式
为了使本发明的目的、技术方案及优点更加清楚明白,以下结合附图及实施例,对本发明进行进一步详细说明。应当理解,此处所描述的具体实施例仅仅用以解释本发明,并不用于限定本发明。此外,下面所描述的本发明各个实施方式中所涉及到的技术特征只要彼此之间未构成冲突就可以相互组合。
如图1所示,按照本发明的一个方面,首先提出了一种用户悬停框缓冲方法,其中该方法主要包括如下步骤:
获得触发器图标的位置;
设置悬停框的展示位置;
根据触发器图标所在的位置以及悬停框的展示位置设置多个缓冲区,在触发器在该缓冲区触发时,悬停框也不被隐藏,而触发器离开该缓冲区后,悬停框则被收起;
其中悬停框的展示位置的规则设置如下:
在触发器图标的周围一段距离范围内进行悬停框的展示,为使得用户能够较为方便的从触发器图标中跳转到悬停框中来选取相应的选项操作或者是观看信息。
其中在触发器图标周围的悬停框的位置可以根据实际显示情况灵活调整,例如可以根据悬停框与其它显示内容的冲突进行调整。
其中根据触发器图标所在的位置以及悬停框的位置设置缓冲区的方法为:
该缓冲区的建立规则如下:
识别触发器图标的边界点位置,识别悬停框的边界点的位置,由上述边界点构成的多边形区域则限定为缓冲区域。
当然这种边界点位置的选择方式可以采用多种方式,具体而言,主要是根据触发器图标和悬停框的位置来选择边界节点限定缓冲区域,一般而言,该多边形区域为四个边界节点构成的区域。
总而言之,按照本发明实现的用户悬停框缓冲方法,主要是在鼠标所停放的区域和悬停框之中通过页面位置判断计算建立了一个缓冲区域,该缓冲区域的计算主要是通过计算悬停框的位置,从而通过该位置建立一个缓冲区域,使得用户的鼠标在这整个区域中的触发都不会让悬停框消失,而离开该区域后,则悬停框收起,这样就不会存在多触发的兼容性问题。
具体而言,其中触发器图标可以是社交网络中用户图像,或者是用户姓名,或者是其他可以引发选项卡引出的图标;
悬停框可以是带有选项卡内容的展示框,也可以是点击用户图像所展示的用户资料信息;
其中上述触发器图标的位置以及悬停框的位置的获取主要是用其在显示终端上的坐标来表达和进行处理;
缓冲区的缓冲逻辑设置方式为:使得鼠标在上述区域触发时,不会产生悬停框的收起。
如图2所示,另外一方面,本发明还提供了一种用户悬停框缓冲***,该***主要包括如下部分:
触发器图标识别模块,用于识别触发器图标的坐标;
鼠标触发点识别模块,用于识别鼠标触发的位置;
悬停框展示位置判定模块,用于接受触发器图标的坐标,以及终端上的会产生冲突显示的其它图标的坐标,来判定悬停框在触发器图标周围的显示位置,并实时生成悬停框显示位置的坐标;
缓冲区位置设定模块,用于接受触发器图标的坐标和悬停框显示位置的坐标,形成触发器图标和悬停框图标之间的缓冲区;
缓冲区缓冲逻辑设置模块,其实时读取缓冲区位置设定模块中缓冲区的位置,从而来进行相应的缓冲逻辑的设定。
其中建立缓冲区位置的坐标是触发器图标的坐标和悬停框显示位置的边界上的坐标点,由此形成多边型的缓冲区域。
其中缓冲区缓冲逻辑的设置可以为多种形式,可以是添加程序任务,使得识别出鼠标在上述区域的时候,悬停框也不会收起。
其中,悬停框在触发器图标周围的显示位置的安定主要按照如下的形式:
获得一个触发器图标定位起始坐标(x,y),获得触发器图标的高度和宽度信息,获得可能产生冲突显示的其它图标的高度和宽度信息,通过上述信息的运算判定来解决悬停框在触发器周围哪个位置显示。
实施例1
如图3所示,其中展示了一种用户悬停框缓冲方法的具体实施方式的实施例,在本实施例中是采用社交网络中的用户头像展示的应用环境来做说明的,其中该用户头像在浏览器界面上进行显示,悬停框主要展示的是用户的详细资料信息,其中,按照本实施例,主要执行如下的步骤:
STEP1:获得头像图片的位置信息;并且建立该头像的定位起始坐标(x,y),该坐标值可以是头像图片的中心点,也可以是边界点,在其它的实施方式中可以做更为灵活的选择;
STEP2:设置悬停框的展示位置:
如图4所示,获得如下参数:浏览器窗口高度、浏览器窗口宽度、悬停框高度、悬停框宽度、悬停框图片的大小;
并按照如下规则执行悬停框的展示位置:
当浏览器窗口宽度-头像x坐标-悬停框宽度大于零,并且浏览器窗口高度-头像x坐标-(悬停框高度-100)大于零,则悬停框的默认展示位置为{x+75,y+75};
当浏览器窗口宽度-头像x坐标-悬停框宽度小于零,则悬停框的默认展示位置为{x-悬停框宽度-25,y+75};
当浏览器窗口高度-头像y坐标-(悬停框高度-50)小于零,则悬停框的默认展示位置为{x+75,y-浏览器窗口高度-25};
当浏览器窗口宽度-头像x坐标-悬停框宽度小于零,并且浏览器窗口高度-头像x坐标-(悬停框高度-100)小于零,则悬停框的默认展示位置为{x-悬停框宽度-25,y-浏览器窗口高度-25};
当然,在本实施例中主要是展示了在头像的四周进行图像显示的判断,主要是为了满足在浏览器宽度范围内进行相应显示的要求,但是在实际的操作中,还可以根据其它会产生冲突显示的图标来进行对比判断,从而生成悬停框的选择位置;
STEP3:建立缓冲区
按照如图5所示的方式来设置的缓冲区,基于位置的悬停框展示的位置不同,缓冲区域的计算方式不同,按照如图所示的位置范围,主要是以如下方式被计算:
位置1:C-B-g-h
位置2:A-D-g-h
位置3:A-D-e-f
位置4:C-B-e-f
当然,如前所述,对该缓冲区的形式并进行严格的限定,只要能够选择相应的图标和悬停框的边界点来生成缓冲区域即可。
STEP4:为缓冲区添加逻辑
完成建立缓冲区之后,就是添加逻辑,让用户鼠标在任意时间内停留于缓存区域中时均保持悬停框的持续展示,当然,上述逻辑并不严格限定为停留任意时间,为更加灵活地调整悬停框,上述逻辑的添加,还可使得上述悬停框停留一段比较长的时间。
按照本发明实现的用户悬停框多边形缓冲技术,改变了传统意义上的悬停和隐藏的交互方式,采用的全新的自动定位的方式重新定义了头像(触发器)和悬停框(面板)的关系,让用户在使用的过程中不会出现由于鼠标触发过程中悬停框的多触发的兼容性问题,提高了用户进行鼠标操作的体验。
本领域的技术人员容易理解,以上所述仅为本发明的较佳实施例而已,并不用以限制本发明,凡在本发明的精神和原则之内所作的任何修改、等同替换和改进等,均应包含在本发明的保护范围之内。

Claims (5)

1.一种用户悬停框缓冲方法,其特征在于,该方法包括如下步骤:
获得触发器图标的位置;
设置悬停框的展示位置;
根据所述触发器图标所在的位置以及所述悬停框的展示位置设置缓冲区,触发器在所述缓冲区触发时,所述悬停框不收起,所述触发器离开所述缓冲区时,所述悬停框收起;
所述缓冲区的设置方法为:识别若干所述触发器图标的边界点位置,识别若干所述悬停框的边界点的位置,由上述边界点构成的多边形区域为缓冲区。
2.如权利要求1所述的用户悬停框缓冲方法,其特征在于,所述悬停框的展示位置在所述触发器图标的四周。
3.如权利要求2所述的用户悬停框缓冲方法,其特征在于,所述触发器图标的边界点选择为对角的两个点,所述悬停框的边界点选择为所述悬停框的靠近所述触发器图标最上端的两个点。
4.一种用户悬停框缓冲***,其特征在于,该***包括:
触发器图标识别模块,用于识别触发器图标的坐标;
触发点识别模块,用于识别触发点的位置坐标;
悬停框展示位置判定模块,用于接收所述触发器图标的坐标,以及用户终端上的会产生冲突显示的其它图标的坐标,来判定所述悬停框在触发器图标周围的显示位置,并实时生成悬停框显示位置的坐标;
缓冲区位置设定模块,用于接收所述触发器图标的坐标和所述悬停框显示位置的坐标,形成所述触发器图标和所述悬停框图标之间的缓冲区;
缓冲区缓冲逻辑设置模块,用于实时读取所述缓冲区位置设定模块中缓冲区的位置,进行缓冲逻辑的设定,所述缓冲逻辑为:触发器在所述缓冲区触发时,所述悬停框不收起,触发器离开所述缓冲区时,所述悬停框收起。
5.如权利要求4所述的用户悬停框缓冲***,其特征在于,所述悬停框的展示位置在所述触发器图标的四周。
CN201610481980.0A 2016-06-27 2016-06-27 一种用户悬停框缓冲方法及*** Active CN105955589B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201610481980.0A CN105955589B (zh) 2016-06-27 2016-06-27 一种用户悬停框缓冲方法及***

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201610481980.0A CN105955589B (zh) 2016-06-27 2016-06-27 一种用户悬停框缓冲方法及***

Publications (2)

Publication Number Publication Date
CN105955589A CN105955589A (zh) 2016-09-21
CN105955589B true CN105955589B (zh) 2019-01-29

Family

ID=56905243

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201610481980.0A Active CN105955589B (zh) 2016-06-27 2016-06-27 一种用户悬停框缓冲方法及***

Country Status (1)

Country Link
CN (1) CN105955589B (zh)

Citations (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101110025A (zh) * 2006-06-06 2008-01-23 国际商业机器公司 在交互式数据可视化工具中呈现组件的方法和***
US7516406B1 (en) * 2006-06-06 2009-04-07 Adobe Systems Incorporated Partial functionality indicator
CN102597996A (zh) * 2009-11-09 2012-07-18 微软公司 社交浏览
CN102693123A (zh) * 2011-03-24 2012-09-26 微软公司 提示信息的控制方法及控制装置
CN103793126A (zh) * 2012-10-29 2014-05-14 深圳市金蝶中间件有限公司 浮动提示框的实现方法及其***
CN103914535A (zh) * 2014-03-31 2014-07-09 百度在线网络技术(北京)有限公司 信息的获取方法及装置
CN104238911A (zh) * 2014-08-20 2014-12-24 小米科技有限责任公司 加载图标显示方法和装置
CN105138217A (zh) * 2015-07-08 2015-12-09 广州优蜜移动科技股份有限公司 一种用于智能终端的悬浮窗运行方法及***
CN105468228A (zh) * 2014-09-12 2016-04-06 广州华多网络科技有限公司 一种提示框的控制方法及客户端

Family Cites Families (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US8924883B2 (en) * 2010-09-28 2014-12-30 Lenovo Enterprise Solutions (Singapore) Pte. Ltd. Content presentation utilizing moveable fly-over on-demand user interfaces

Patent Citations (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101110025A (zh) * 2006-06-06 2008-01-23 国际商业机器公司 在交互式数据可视化工具中呈现组件的方法和***
US7516406B1 (en) * 2006-06-06 2009-04-07 Adobe Systems Incorporated Partial functionality indicator
CN102597996A (zh) * 2009-11-09 2012-07-18 微软公司 社交浏览
CN102693123A (zh) * 2011-03-24 2012-09-26 微软公司 提示信息的控制方法及控制装置
CN103793126A (zh) * 2012-10-29 2014-05-14 深圳市金蝶中间件有限公司 浮动提示框的实现方法及其***
CN103914535A (zh) * 2014-03-31 2014-07-09 百度在线网络技术(北京)有限公司 信息的获取方法及装置
CN104238911A (zh) * 2014-08-20 2014-12-24 小米科技有限责任公司 加载图标显示方法和装置
CN105468228A (zh) * 2014-09-12 2016-04-06 广州华多网络科技有限公司 一种提示框的控制方法及客户端
CN105138217A (zh) * 2015-07-08 2015-12-09 广州优蜜移动科技股份有限公司 一种用于智能终端的悬浮窗运行方法及***

Also Published As

Publication number Publication date
CN105955589A (zh) 2016-09-21

Similar Documents

Publication Publication Date Title
US11412292B2 (en) Video processing method, video processing device, and storage medium
US10430068B2 (en) Method for displaying interface content and user equipment
US9437038B1 (en) Simulating three-dimensional views using depth relationships among planes of content
CN109829981B (zh) 三维场景呈现方法、装置、设备及存储介质
EP2907020B1 (en) Multi-modal user expressions and user intensity as interactions with an application
EP2814000A1 (en) Image processing apparatus, image processing method, and program
CN106605194B (zh) 语义卡视图
CN107204044B (zh) 一种基于虚拟现实的画面显示方法及相关设备
US20140157167A1 (en) Method and Device for Controlling Icon
CN106658139B (zh) 一种焦点控制方法及装置
US11205286B2 (en) Techniques for optimizing creation of digital diagrams
US20190164347A1 (en) Method of displaying at least one virtual object in mixed reality, and an associated terminal and system
CN106354366A (zh) 桌面图标排列处理方法及装置
CN110941337A (zh) 虚拟形象的控制方法、终端设备及计算机可读存储介质
JP7140773B2 (ja) リアルタイム協働用のライブインク存在
CN115129214A (zh) 一种显示设备和颜色填充方法
CN105955589B (zh) 一种用户悬停框缓冲方法及***
CN112508127A (zh) 数据标注方法及装置、电子设备、介质和产品
CN109800039B (zh) 一种用户界面展示方法、装置、电子设备及存储介质
CN109189537B (zh) 页面信息的动态显示方法、计算设备及计算机存储介质
CN112328164B (zh) 操控方法和电子设备
CN112256185B (zh) 3d菜单的展示方法、展示装置、处理器和显示设备
CN113643320A (zh) 图像处理方法及装置、电子设备及计算机可读存储介质
CN118260014A (zh) 生成用户界面容器
JP6716409B2 (ja) 情報処理装置

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
EE01 Entry into force of recordation of patent licensing contract

Application publication date: 20160921

Assignee: Hubei Special Automobile Network Technology Co.,Ltd.

Assignor: WUHAN DOUYU NETWORK TECHNOLOGY Co.,Ltd.

Contract record no.: X2023980034618

Denomination of invention: A User Hover Box Buffering Method and System

Granted publication date: 20190129

License type: Common License

Record date: 20230413

EE01 Entry into force of recordation of patent licensing contract