CN110308805A - 适用于移动终端的hover显示方法 - Google Patents

适用于移动终端的hover显示方法 Download PDF

Info

Publication number
CN110308805A
CN110308805A CN201910487876.6A CN201910487876A CN110308805A CN 110308805 A CN110308805 A CN 110308805A CN 201910487876 A CN201910487876 A CN 201910487876A CN 110308805 A CN110308805 A CN 110308805A
Authority
CN
China
Prior art keywords
touch
event
mobile terminal
display methods
mouse
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.)
Withdrawn
Application number
CN201910487876.6A
Other languages
English (en)
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.)
Shanghai Yidianshikong Network Co Ltd
Original Assignee
Shanghai Yidianshikong Network 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 Shanghai Yidianshikong Network Co Ltd filed Critical Shanghai Yidianshikong Network Co Ltd
Priority to CN201910487876.6A priority Critical patent/CN110308805A/zh
Publication of CN110308805A publication Critical patent/CN110308805A/zh
Withdrawn legal-status Critical Current

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/03Arrangements for converting the position or the displacement of a member into a coded form
    • G06F3/033Pointing devices displaced or positioned by the user, e.g. mice, trackballs, pens or joysticks; Accessories therefor
    • G06F3/0354Pointing devices displaced or positioned by the user, e.g. mice, trackballs, pens or joysticks; Accessories therefor with detection of 2D relative movements between the device, or an operating part thereof, and a plane or surface, e.g. 2D mice, trackballs, pens or pucks
    • G06F3/03543Mice or pucks
    • 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/03Arrangements for converting the position or the displacement of a member into a coded form
    • G06F3/033Pointing devices displaced or positioned by the user, e.g. mice, trackballs, pens or joysticks; Accessories therefor
    • G06F3/038Control and interface arrangements therefor, e.g. drivers or device-embedded control circuitry
    • G06F3/0383Signal control means within the pointing device
    • 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/0487Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser
    • G06F3/0488Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures
    • G06F3/04883Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures for inputting data by handwriting, e.g. gesture or text
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/451Execution arrangements for user interfaces

Abstract

本发明公开一种适用于移动终端的hover显示方法,包括以下几个步骤:S1:用户数据采集模块;S2:视频节目鉴别能力计算和排序模块;S3:VideoBag打包模块;S4:权重计算模块;S5:用户特征表生成模块;S6:广告投放模块。本发明通过海量的基础用户数据,结合大数据和机器学习技术,提高了汽车营销领域的转化率和精准率,同时提高了用户体验,降低了用户反感度。

Description

适用于移动终端的hover显示方法
技术领域
本发明涉及多媒体显示应用技术领域,特别涉及一种适用于移动终端的hover显示方法。
背景技术
CSS伪类的hover在移动端一直是个难题,PC端鼠标光标永远会停留在屏幕上,而移动端手指离开屏幕无法被检测到,这导致在移动端应用了hover伪类的元素无法实现跟PC端一样的“点击-弹起”效果,造成用户体验的缺失。目前有一些主流库采用active模拟,但是active除了有ios和android的兼容问题,对于嵌套的元素active也带来了“穿透现象”,如果父元素和子元素同时设置了active或hover,在点击子元素时父元素也会出现被点击的视觉效果。本专利提出一种通用的解决移动端的hover交互效果缺失的问题。
发明内容
本发明要解决的技术问题是提供一种适用于移动终端的hover显示方法,能够移动端的hover交互效果缺失的问题。
为了解决上述技术问题,本发明的技术方案为:
一种适用于移动终端的hover显示方法,包括以下几个步骤:
S1:基于组件技术构建一种通用组件,在组件底层通过JavaScript判断当前环境是属于可触摸环境还是不可触摸环境;
S2:对于可触摸环境:利用标准的Touch事件模型,实现模拟算法完整模拟移动端的表达hover效果;
S3:对于不可触摸环境:利用标准的Mouse事件模型,实现模拟算法完整模拟鼠标来表达hover效果;
S4:对于穿透现象,通过阻止流程传播的方式解决。
优选的,所述用特定字符对html模板所需渲染部分对应的数据进行标识,并将该html模板及标识所需渲染部分对应的数据均以变量的形式传入引擎解析模块中。
优选的,所述引擎解析模块使用JavaScript语言的正则表达式对传入的html模板及标识所需渲染部分对应的数据进行匹配,匹配出传入html模板变量及所需渲染部分对应的数据变量,并将其组装成html代码形式返回前端。
优选的,所述对于不同的业务类型,需要的HTML模板是不同的,针对不同的业务类型,在HTML模板中添加不同的数据类型的属性。
优选的,所述Touch事件模型的建立为了简化对单个和多个触摸事件的识别,特定窗口内的每一个视图都可以被配置成多点触摸视图或是单点触摸视图,每一个视图都可以被配置成独占或是非独占视图,根据视图的配置,可以忽略或是识别该视图以及其他视图中的触摸事件。
优选的,所述经过处理的触摸输入数据可以被称为一个或多个触摸事件,并且可以采用由多点触摸面板产生的原始触摸数据更易于处理的格式,每一个触摸事件都可以包括当前正发生触摸处的一组坐标。
优选的,所述获取来自触摸敏感设备的一个或多个触摸输入信号,基于触摸输入信号确定两个或多个触摸事件,其中该触摸事件和在触摸敏感设备上显示的web页面中的两个或更多个区域相关联的触摸输入信号相关联,以及通过编程接口提供对至少一个触摸事件的访问。
优选的,所述存储触摸手势模型和鼠标事件之间映射模型的映射存储单元,用于获取触摸手势的手势输入单元和触摸手势从映射模型获取对应鼠标事件的控制单元和用于发送鼠标事件的鼠标事件发送单元,所述控制单元分别与映射存储单元、手势输入单元和鼠标事件发送单元相连。
优选的,所述在触摸点数查找映射模型数据从而得到鼠标事件中的按键事件,通过设置阈值时间,实时判断触摸手势中的触摸点数信息,当触摸点数信息包含一个触摸点时,如果所述阈值时间内的触摸点未发生移动则查找所述映射模型得到鼠标事件中的左键按键事件,如果阈值时间内该触摸点发生移动则查找映射模型得到鼠标事件中的中键按键事件,当触摸点数信息包含两个触摸点时,如果阈值时间内两个触摸点均未发生移动则查找映射模型得到鼠标事件中的右键按键事件。
优选的,所述取触摸手势中的触摸点数信息,根据触摸点数信息查找映射模型得到鼠标事件中的按键事件,然后在获得按键事件的基础上获取触摸手势中的移动轨迹,根据移动轨迹查找所述映射模型得到鼠标事件中对应的按键事件。
本发明有益效果:1:本发明解决了移动端的hover伪类效果原生缺失的问题和移动端和pc端的hover效果兼容的问题以及“穿透现象”带来的体验问题。
2:本发明基于鼠标事件的多点触摸手势交互中间件独立于应用程序之外,采用鼠标事件映射方法,在操作系统和应用程序之间加入一层映射,将基于多点触摸的交互手势与系统鼠标事件进行对应,以鼠标事件作为中转,间接实现手势操作与应用程序响应的映射,能够在不对应用程序进行任何修改的前提下,使其支持基于多点触摸的手势操作。
附图说明
图1为本发明所述的系统流程图;
图2为本发明所述的触摸点数信息流程图。
具体实施方式
下面结合附图对本发明的具体实施方式作进一步说明。在此需要说明的是,对于这些实施方式的说明用于帮助理解本发明,但并不构成对本发明的限定。此外,下面所描述的本发明各个实施方式中所涉及的技术特征只要彼此之间未构成冲突就可以相互组合。
一种适用于移动终端的hover显示方法,包括以下几个步骤:
S1:基于组件技术构建一种通用组件,在组件底层通过JavaScript判断当前环境是属于可触摸环境还是不可触摸环境;
S2:对于可触摸环境:利用标准的Touch事件模型,实现模拟算法完整模拟移动端来表达hover效果;
S3:对于不可触摸环境:利用标准的Mouse事件模型,实现模拟算法完整模拟鼠标来表达hover效果;
S4:对于穿透现象,通过阻止流程传播的方式解决。
优选的,所述用特定字符对html模板所需渲染部分对应的数据进行标识,并将该html模板及标识所需渲染部分对应的数据均以变量的形式传入引擎解析模块中。
优选的,所述引擎解析模块使用JavaScript语言的正则表达式对传入的html模板及标识所需渲染部分对应的数据进行匹配,匹配出传入html模板变量及所需渲染部分对应的数据变量,并将其组装成html代码形式返回前端。
优选的,所述对于不同的业务类型,需要的HTML模板是不同的,针对不同的业务类型,在HTML模板中添加不同的数据类型的属性。
优选的,所述Touch事件模型的建立为了简化对单个和多个触摸事件的识别,特定窗口内的每一个视图都可以被配置成多点触摸视图或是单点触摸视图,每一个视图都可以被配置成独占或是非独占视图,根据视图的配置,可以忽略或是识别该视图以及其他视图中的触摸事件。
优选的,所述经过处理的触摸输入数据可以被称为一个或多个触摸事件,并且可以采用由多点触摸面板产生的原始触摸数据更易于处理的格式,每一个触摸事件都可以包括当前正发生触摸处的一组坐标。
优选的,所述获取来自触摸敏感设备的一个或多个触摸输入信号,基于触摸输入信号确定两个或多个触摸事件,其中该触摸事件和在触摸敏感设备上显示的web页面中的两个或更多个区域相关联的触摸输入信号相关联,以及通过编程接口提供对至少一个触摸事件的访问。
优选的,所述存储触摸手势模型和鼠标事件之间映射模型的映射存储单元,用于获取触摸手势的手势输入单元和触摸手势从映射模型获取对应鼠标事件的控制单元和用于发送鼠标事件的鼠标事件发送单元,所述控制单元分别与映射存储单元、手势输入单元和鼠标事件发送单元相连。
优选的,所述在触摸点数查找映射模型数据从而得到鼠标事件中的按键事件,通过设置阈值时间,实时判断触摸手势中的触摸点数信息,当触摸点数信息包含一个触摸点时,如果所述阈值时间内的触摸点未发生移动则查找所述映射模型得到鼠标事件中的左键按键事件,如果阈值时间内该触摸点发生移动则查找映射模型得到鼠标事件中的中键按键事件,当触摸点数信息包含两个触摸点时,如果阈值时间内两个触摸点均未发生移动则查找映射模型得到鼠标事件中的右键按键事件。
优选的,所述取触摸手势中的触摸点数信息,根据触摸点数信息查找映射模型得到鼠标事件中的按键事件,然后在获得按键事件的基础上获取触摸手势中的移动轨迹,根据移动轨迹查找所述映射模型得到鼠标事件中对应的按键事件。
综上可知,视图可以接收始于该视图内的触摸事件,如果用户保持将某个手指按在显示器上,那么该视图随后可以接收到表明持续性触摸的多个触摸事件;如果用户移动已按下的手指,那么该视图可以接收到表明触摸移动的多个触摸事件;如果用户将按下的手指移到视图之外,那么该视图仍旧可以接收与该移动相关联的触摸事件。
本实施例通过在操作系统和应用程序之间的一个多点触摸中间键来实现,操作系统通过硬件驱动程序获取用户输入的触摸手势信号,并将触摸手势信号发送给多点触摸中间件,然后通过中间件将触摸手势信号转换为鼠标事件信号并发送给操作系统中的应用程序。
以上结合附图对本发明的实施方式作了详细说明,但本发明不限于所描述的实施方式。对于本领域的技术人员而言,在不脱离本发明原理和精神的情况下,对这些实施方式进行多种变化、修改、替换和变型,仍落入本发明的保护范围内。

Claims (10)

1.适用于移动终端的hover显示方法,其特征在于:包括以下几个步骤:
S1:基于组件技术构建一种通用组件,在组件底层通过JavaScript判断当前环境是属于可触摸环境还是不可触摸环境;
S2:对于可触摸环境:利用标准的Touch事件模型,实现模拟算法完整模拟移动端的表达hover效果;
S3:对于不可触摸环境:利用标准的Mouse事件模型,实现模拟算法完整模拟鼠标来表达hover效果;
S4:对于穿透现象,通过阻止流程传播的方式解决。
2.根据权利要求1所述的一种适用于移动终端的hover显示方法,其特征在于:所述用特定字符对html模板所需渲染部分对应的数据进行标识,并将该html模板及标识所需渲染部分对应的数据均以变量的形式传入引擎解析模块中。
3.根据权利要求1所述的一种适用于移动终端的hover显示方法,其特征在于:所述引擎解析模块使用JavaScript语言的正则表达式对传入的html模板及标识所需渲染部分对应的数据进行匹配,匹配出传入html模板变量及所需渲染部分对应的数据变量,并将其组装成html代码形式返回前端。
4.根据权利要求1所述的一种适用于移动终端的hover显示方法,其特征在于:所述对于不同的业务类型,需要的HTML模板是不同的,针对不同的业务类型,在HTML模板中添加不同的数据类型的属性。
5.根据权利要求1所述的一种适用于移动终端的hover显示方法,其特征在于:所述Touch事件模型的建立为了简化对单个和多个触摸事件的识别,特定窗口内的每一个视图都可以被配置成多点触摸视图或是单点触摸视图,每一个视图都可以被配置成独占或是非独占视图,根据视图的配置,可以忽略或是识别该视图以及其他视图中的触摸事件。
6.根据权利要求1所述的一种适用于移动终端的hover显示方法,其特征在于:所述经过处理的触摸输入数据可以被称为一个或多个触摸事件,并且可以采用由多点触摸面板产生的原始触摸数据更易于处理的格式,每一个触摸事件都可以包括当前正发生触摸处的一组坐标。
7.根据权利要求1所述的一种适用于移动终端的hover显示方法,其特征在于:所述获取来自触摸敏感设备的一个或多个触摸输入信号,基于触摸输入信号确定两个或多个触摸事件,其中该触摸事件和在触摸敏感设备上显示的web页面中的两个或更多个区域相关联的触摸输入信号相关联,以及通过编程接口提供对至少一个触摸事件的访问。
8.根据权利要求7所述的一种适用于移动终端的hover显示方法,其特征在于:所述存储触摸手势模型和鼠标事件之间映射模型的映射存储单元,用于获取触摸手势的手势输入单元和触摸手势从映射模型获取对应鼠标事件的控制单元和用于发送鼠标事件的鼠标事件发送单元,所述控制单元分别与映射存储单元、手势输入单元和鼠标事件发送单元相连。
9.根据权利要求3所述的一种适用于移动终端的hover显示方法,其特征在于:所述在触摸点数查找映射模型数据从而得到鼠标事件中的按键事件,通过设置阈值时间,实时判断触摸手势中的触摸点数信息,当触摸点数信息包含一个触摸点时,如果所述阈值时间内的触摸点未发生移动则查找所述映射模型得到鼠标事件中的左键按键事件,如果阈值时间内该触摸点发生移动则查找映射模型得到鼠标事件中的中键按键事件,当触摸点数信息包含两个触摸点时,如果阈值时间内两个触摸点均未发生移动则查找映射模型得到鼠标事件中的右键按键事件。
10.根据权利要求1所述的一种适用于移动终端的hover显示方法,其特征在于:所述取触摸手势中的触摸点数信息,根据触摸点数信息查找映射模型得到鼠标事件中的按键事件,然后在获得按键事件的基础上获取触摸手势中的移动轨迹,根据移动轨迹查找所述映射模型得到鼠标事件中对应的按键事件。
CN201910487876.6A 2019-06-05 2019-06-05 适用于移动终端的hover显示方法 Withdrawn CN110308805A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201910487876.6A CN110308805A (zh) 2019-06-05 2019-06-05 适用于移动终端的hover显示方法

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201910487876.6A CN110308805A (zh) 2019-06-05 2019-06-05 适用于移动终端的hover显示方法

Publications (1)

Publication Number Publication Date
CN110308805A true CN110308805A (zh) 2019-10-08

Family

ID=68075691

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201910487876.6A Withdrawn CN110308805A (zh) 2019-06-05 2019-06-05 适用于移动终端的hover显示方法

Country Status (1)

Country Link
CN (1) CN110308805A (zh)

Cited By (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN110908580A (zh) * 2019-11-11 2020-03-24 广州视源电子科技股份有限公司 控制应用的方法和装置

Cited By (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN110908580A (zh) * 2019-11-11 2020-03-24 广州视源电子科技股份有限公司 控制应用的方法和装置

Similar Documents

Publication Publication Date Title
US10444961B2 (en) Hover-based interaction with rendered content
JP6400477B2 (ja) ジェスチャベースの検索
EP2821906B1 (en) Method for processing touch operation and mobile terminal
CN102819416B (zh) 一种实现组件内容显示的方法和装置
US20150193549A1 (en) History as a branching visualization
CN103634641A (zh) 通过移动终端对智能电视进行手势控制的方法和系统
CN102768595B (zh) 一种识别触摸屏上触控操作指令的方法及装置
CN102221971A (zh) 自由形式数学计算
CN102323875A (zh) 基于鼠标事件的多点触摸手势交互方法及中间件
CN106844635A (zh) 网页中的元素的编辑方法及装置
KR20140132731A (ko) 웹 페이지 애플리케이션 제어 기법
CN105302461B (zh) 一种用于在移动应用中提供目标页面的方法与设备
CN104866097A (zh) 手持信号输出装置和手持装置输出信号的方法
CN109547836A (zh) 直播交互方法及装置、电子设备、存储介质
CN103365555A (zh) 数据处理方法和系统、数据收集方法和系统
CN104020989B (zh) 基于远程应用的控制方法和系统
CN108399042A (zh) 一种触控识别方法、装置和系统
CN102541331B (zh) 触控显示器中多区域滑动点击响应方法及系统
CN110308805A (zh) 适用于移动终端的hover显示方法
CN104572997A (zh) 内容获取方法、装置及用户设备
CN103472931A (zh) 鼠标仿真触控屏幕操作的方法
CN105373329A (zh) 显示器与展台的交互方法及系统
CN102073415A (zh) 触摸系统、辅助装置及其输入方法
CN113093961B (zh) 窗口切换方法、存储介质及相关设备
CN204740560U (zh) 手持信号输出装置

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
WW01 Invention patent application withdrawn after publication

Application publication date: 20191008

WW01 Invention patent application withdrawn after publication