CN117055796A - 控件显示方法和装置 - Google Patents

控件显示方法和装置 Download PDF

Info

Publication number
CN117055796A
CN117055796A CN202210491480.0A CN202210491480A CN117055796A CN 117055796 A CN117055796 A CN 117055796A CN 202210491480 A CN202210491480 A CN 202210491480A CN 117055796 A CN117055796 A CN 117055796A
Authority
CN
China
Prior art keywords
display
control
page
touch operation
determining
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.)
Pending
Application number
CN202210491480.0A
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.)
Beijing Jingdong Century Trading Co Ltd
Beijing Wodong Tianjun Information Technology Co Ltd
Original Assignee
Beijing Jingdong Century Trading Co Ltd
Beijing Wodong Tianjun Information 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 Beijing Jingdong Century Trading Co Ltd, Beijing Wodong Tianjun Information Technology Co Ltd filed Critical Beijing Jingdong Century Trading Co Ltd
Priority to CN202210491480.0A priority Critical patent/CN117055796A/zh
Publication of CN117055796A publication Critical patent/CN117055796A/zh
Pending 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/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
    • 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
    • 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/0484Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • 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/0484Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/0485Scrolling or panning

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是本公开的一个实施例可以应用于其中的示例性系统架构图;
图2是根据本公开的控件显示方法的一个实施例的流程图;
图3是根据本公开的控件显示方法的又一个实施例的流程图;
图4是根据本公开的实施例的控件显示方法的一个应用场景的示意图;
图5是根据本公开的实施例的控件显示方法的又一个应用场景的示意图;
图6是根据本公开的控件显示装置的一个实施例的结构示意图;
图7是适于用来实现本公开的实施例的电子设备的结构示意图。
具体实施方式
下面结合附图和实施例对本公开作进一步的详细说明。可以理解的是,此处所描述的具体实施例仅仅用于解释相关发明,而非对该发明的限定。另外还需要说明的是,为了便于描述,附图中仅示出了与有关发明相关的部分。
需要说明的是,在不冲突的情况下,本公开中的实施例及实施例中的特征可以相互组合。下面将参考附图并结合实施例来详细说明本公开。
图1示出了可以应用本公开的控件显示方法或控件显示装置的实施例的示例性架构100。
如图1所示,系统架构100可以包括终端设备101、102、103,网络104和服务器105。网络104用以在终端设备101、102、103和服务器105之间提供通信链路的介质。网络104可以包括各种连接类型,例如有线、无线通信链路或者光纤电缆等等。
终端设备101、102、103通过网络104与服务器105交互,以接收或发送消息等。终端设备101、102、103上可以安装有各种客户端应用。例如,浏览器类应用、购物类应用、搜索类应用、即时通信工具、社交平台、阅读类应用等等。
终端设备101、102、103可以是硬件,也可以是软件。当终端设备101、102、103为硬件时,可以是各种电子设备,包括但不限于智能手机、平板电脑、电子书阅读器、膝上型便携计算机和台式计算机等等。当终端设备101、102、103为软件时,可以安装在上述所列举的电子设备中。其可以实现成多个软件或软件模块(例如用来提供分布式服务的多个软件或软件模块),也可以实现成单个软件或软件模块。在此不做具体限定。
服务器105可以是提供各种服务的服务器,例如为终端设备101、102、103上安装的客户端应用提供支持的后端服务器。需要说明的是,服务器105可以是硬件,也可以是软件。当服务器105为硬件时,可以实现成多个服务器组成的分布式服务器集群,也可以实现成单个服务器。当服务器105为软件时,可以实现成多个软件或软件模块(例如用来提供分布式服务的多个软件或软件模块),也可以实现成单个软件或软件模块。在此不做具体限定。
需要说明的是,本公开的实施例所提供的控件显示方法一般由终端设备101、102、103执行,相应地,控件显示装置一般设置于终端设备101、102、103中。此时,根据实际的应用场景也可以不存在服务器105。
还需要指出的是,服务器105也可以获取用户对页面的触控操作的结束位置,在结束位置所在的区域中确定控件的显示位置,然后控制终端设备101、102、103在该显示位置处显示控件。此时,根据实际的应用场景也可以不存在终端设备101、102、103。
应该理解,图1中的终端设备、网络和服务器的数目仅仅是示意性的。根据实现需要,可以具有任意数目的终端设备、网络和服务器。
继续参考图2,其示出了根据本公开的控件显示方法的一个实施例的流程200。该控件显示方法包括以下步骤:
步骤201,响应于检测到用户对页面的触控操作,获取触控操作的结束位置。
在本实施例中,页面可以是支持触控操作的设备上展示的任意页面。例如,页面可以是该设备上安装的应用的页面。用户可以指浏览该页面的任意用户。触控操作可以指通过触摸设备的屏幕实现对屏幕所显示的内容的控制的各种操作。例如,触控操作可以是各种滑动操作。又例如,触控操作可以是绘制指定图案的操作。
用户对页面的触控操作可以利用各种对象完成。例如,用户可以使用自己的手指对页面进行触控操作。又例如,用户可以使用触控笔等工具对页面进行触控操作。
一般地,支持触控操作的设备可以通过对屏幕上触控信号的检测来确定用户的触控操作和触控操作的位置。在一些情况下,触控操作可以是连续的操作,如滑动操作等,此时,触控操作具有起始位置和结束位置。起始位置可以指触控操作开始时的位置。结束位置可以指触控操作结束时的位置。触控操作的位置可以指触控操作在屏幕或屏幕所呈现的页面上的位置。
控件显示方法的执行主体(如图1所示的终端设备101、102、103等)可以利用触摸检测装置等检测用户对页面的触控操作,以及获取触控操作的结束位置。
步骤202,在结束位置所在的目标区域中确定控件的显示位置。
在本实施例中,控件可以用于控制页面的显示状态。其中,控件可以是各种类型的控件,具体可以根据实际的应用场景进行设置。例如,控件包括但不限于:按钮(Button)、切换开关(Switch)等等。
页面的显示状态可以包括页面显示过程中的各种状态。页面所具有的显示状态具体可以根据实际的应用场景灵活变化。不同的应用场景下,页面所具有的显示状态可以相同,也可以不同。例如,页面的显示状态可以包括:全屏显示、窗口显示、浮窗显示、返回至页面顶部显示、放大显示、后台隐藏等等。
结束位置所在的目标区域可以是根据结束位置确定的其周围的区域,具体可以由技术人员预先根据实际应用需求和应用场景灵活设置。例如,结束位置所在的目标区域可以指以结束位置为圆心,以预设半径为半径所形成的圆形区域。又例如,结束位置所在的目标区域可以指以结束位置为顶点,以预设边长为边长所形成的正方形区域。其中,预设半径和预设边长等都可以由技术人员预先设置。
控件的显示位置可以指显示控件的位置。具体地,可以采用各种方法在结束位置所在的目标区域中确定控件的显示位置。例如,可以在结束位置所在的目标区域中随机选取位置作为控件的显示位置。又例如,可以在结束位置所在的目标区域中选取指定位置(如与结束位置之间的距离为指定距离的位置)作为控件的显示位置。
步骤203,在确定的显示位置处显示控件。
在本实施例中,执行主体可以采用现有的各种控件显示方法控制在确定的显示位置处对控件进行显示。控件的具体显示形式可以根据实际的应用需求或应用场景灵活设置。例如,可以采用悬浮按钮的形式显示控件。
通过在用户对页面的触控操作的结束位置所在的目标区域中确定用于控制页面的显示状态的控件的显示位置,并在该显示位置处显示该控件,可以使得对页面的显示状态进行控制的控件的显示位置能够根据用户的触控操作的结束位置而确定,避免在固定位置处显示该控件使得用户必须在固定位置进行操作来控制页面的显示状态,提升用户对控制页面的显示状态的控件的操作的灵活性。
在本实施例的一些可选的实现方式中,响应于确定触控操作结束,确定是否显示控件。响应于确定显示控件,获取触控操作的结束位置,在结束位置所在的目标区域中确定控件的显示位置,在确定的显示位置处显示控件。响应于确定不显示控件,隐藏控件。
在确定触控操作结束时,可以先确定当前是否需要显示控件,或者当前是否满足显示控件的条件。若确定显示控件,则可以执行上述步骤201-203以根据触控操作的结束位置确定控件的显示位置并对控件进行显示。若确定不显示控件,则当前可以对控件进行隐藏。其中,控件的隐藏可以利用现有的各种控件方法进行实现。
具体地,可以根据实际的应用场景设置是否显示控件的判断条件,从而可以根据该判断条件确定是否显示控件。例如,可以预先设置需要显示控件的页面的显示状态,此时,可以根据页面当前的显示状态确定当前是否需要显示控件。又例如,可以预先设置控件的显示时间,此时,可以根据当前的时间判断是否显示控件。
在触控操作结束时,通过先判断是否需要显示控件,并在不需要显示控件时对控件进行隐藏,在需要显示控件时再确定控件的显示位置并显示,可以避免对控件的不必要显示,从而也可以避免控件的一直显示可能造成的对页面内容的遮挡。
在本实施例的一些可选的实现方式中,在检测到用户的触控操作之后,可以先确定触控操作的触控类型,其中,触控类型包括单点触控和多点触控。响应于确定触控操作的触控类型为多点触控,可以分别获取各个触控点的结束位置,然后根据各个点的结束位置,确定触控操作的结束位置。
单点触控可以指对一个点的触控进行识别并响应。对应地,多点触控可以指对两个以上的点的触控进行识别并响应。例如,只需要一个手指的触控操作可以视为单点触控操作,而需要两个以上的手指实现的触控操作可以视为多点触控操作。
对于多点触控,由于触控点有多个,因此每个触控点通常都对应于一个结束位置。此时,可以先分别获取各个触控点的结束位置,然后再采用各种方法确定触控操作的结束位置,具体可以根据实际的应用需求进行确定。
例如,可以计算各个触控点的结束位置的平均值作为触控操作的结束位置。又例如,可以从各个触控点中选择任意触控点或者选择指定触控点的结束位置作为触控操作的结束位置。
通过对单点触控和多点触控操作的区分,在多点触控操作下,根据各个触控点的结束位置确定该多点触控操作的结束位置,并在该结束位置所在的目标区域中确定并显示控件,可以实现对多点触控操作的支持,使得在多点触控操作下,也能够提升用户对控制页面的显示状态的控件的操作的灵活性。
在本实施例的一些可选的实现方式中,控件可以用于控制将页面从当前状态切换为预设显示状态。其中,预设显示状态可以根据实际的应用场景灵活设置。例如预设显示状态可以为浮窗显示,此时,在页面为全屏显示的情况下,可以利用控件将页面的显示状态切换为浮窗显示。
可选地,预设显示状态可以包括以下至少一项:呈现页面顶部、页面尺寸为默认尺寸。其中,呈现页面顶部可以指返回页面顶部。例如,用户在浏览一些长页面时,通常需要不断滑动页面才能浏览完页面的内容。此时,可以通过控件来控制直接返回到页面顶部,避免用户在浏览到靠近页面尾部的内容时需要长时间不断地滑动操作才能返回页面顶部的情况。
页面尺寸为默认尺寸可以指将当前页面尺寸调整为默认尺寸。其中,默认尺寸可以根据实际的应用场景确定。例如,默认尺寸可以为显示屏幕的尺寸。例如,用户在浏览页面时,可以根据实际需求可能会对页面进行放大或缩小,此时,可以通过控件来控制将页面恢复到默认尺寸,避免用户需要长时间不断地放大或缩小操作来恢复页面的默认尺寸。
一般的用于控制呈现页面顶部或控制页面尺寸为默认尺寸的控件都设计显示在屏幕的右下角位置,这样就会导致在一些情况下,用户可能不便于使用该控件。例如,用户在左手单手进行操作时,由于左手的手指距离屏幕右下角较远,用户就需要使用右手来控制屏幕右下角的控件,从而可能影响用户使用体验。又例如,用户在使用右手单手进行操作时,若用户右手比较靠近屏幕下侧,就可能会出出现右下角的控件被右手遮挡的情况,也不便于用户使用该控件。再例如,用户手指在比较靠近屏幕上侧时,需要用户手指移动较远的距离才能使用屏幕右下角的控件,一些情况下可能不便于用户使用。
针对这些问题,通过对用户的触控操作的结束位置的获取,并根据用户的触控操作的结束位置,在该位置所在的一定区域内显示用于控制呈现页面顶部或控制页面尺寸为默认尺寸的控件,可以使得这些控件永远都显示在用户触控操作的触控点(如手指位置)的周围区域,从而有助于提升用户使用这些控件的便捷性,避免上述可能需要用户从当前结束位置移动较远距离才能使用控件或控件被遮挡等情况。
本公开的上述实施例提供的方法通过获取用户的触控操作的结束位置,并在该结束位置所在的目标区域内确定用于控制页面的显示状态的控件的显示位置,以在确定的显示位置处显示控件,可以使得用于控制页面的显示状态的控件能够一直显示在用户的触控操作的结束位置的周围一定区域内,有助于提升用户使用该控件的灵便捷性和,也有助于提升该控件显示位置的灵活性。
进一步参考图3,其示出了控件显示方法的又一个实施例的流程300。该控件显示方法的流程300,包括以下步骤:
步骤301,响应于检测到用户对页面的触控操作,获取触控操作的结束位置。
步骤302,确定结束位置所在的显示子区域。
在本实施例中,显示子区域可以包括在第一方向上对页面的显示区域进行二等分得到的两个子区域。其中,页面的显示区域可以指用于显示页面内容的区域。举例来说,在页面全屏显示时,页面的显示区域即可以指显示屏幕对应的区域。在页面以窗口显示时,页面的显示区域即可以指显示窗口对应的区域。
第一方向可以指用户对页面的触控操作针对页面的操作方向的垂直方向。例如,触控操作为上下滑动操作,则触控操作的操作方向可以指页面的高度方向,第一方向可以指页面的宽度方向。又例如,触控操作为左右滑动操作,则触控操作的操作方向可以指页面的宽度方向,第一方向可以指页面的高度方向。
需要说明的是,在触控操作的运动轨迹为弧线等情况时,触控操作的操作方向可以根据实际的应用需求灵活确定。例如,在触控操作的运动轨迹为弧线时,对应的操作方向可以指触控操作的结束位置的切线方向。
在第一方向上对页面的显示区域进行二等分可以得到两个面积相同的子区域。例如,在第一方向为页面的宽度方向时,在第一方向上对显示区域进行二等分可以得到左右两个子区域,且每个子区域的高度与显示区域的高度相同,每个子区域的宽度等于显示区域的宽度的一半。
具体地,执行主体可以灵活采用各种方法确定结束位置所在的显示子区域。例如,可以获取触控操作的结束位置的坐标,以及分别获取各个子区域的顶点坐标,从而通过比较结束位置的坐标与每个子区域的顶点坐标来判断结束位置所在的子区域,即为结束位置所在的显示子区域。
需要说明的是,若触控操作的结束位置位于各个子区域相交的边界上,那么可以随机指定或预先指定子区域作为结束位置所在的显示子区域。
步骤303,在确定的显示子区域中确定控件的显示位置。
在本实施例中,在确定触控操作的结束位置所在的显示子区域后,可以采用各种方法在该显示子区域中确定控件的显示位置。例如,可以在结束位置所在的显示子区域中随机选取位置作为控件的显示位置。又例如,可以在结束位置所在的显示子区域中选取指定位置(如与结束位置之间的距离为指定距离的位置)作为控件的显示位置。
步骤304,在确定的显示位置处显示控件。
本实施例中上述各步骤未具体说明的执行过程可参考图2对应实施例中的相关说明,在此不再赘述。
通过对页面显示区域的二等分,并判断用户的触控操作的结束位置所在的显示子区域,可以了解用户触控操作的结束位置与显示区域的边界的位置关系,从而可以控制在用户触控操作的结束位置所在的显示子区域中确定控件的显示位置,并对控件进行显示,可以进一步保证控件的显示位置位于用户触控操作的结束位置的附近,从而便于用户对该控件的使用。
在本实施例的一些可选的实现方式中,在确定触控操作的结束位置所在的显示子区域后,可以将确定的显示子区域的目标顶点的第一坐标在第一方向上偏移第一距离,得到偏移后的第一坐标,然后确定偏移后的第一坐标作为控件的显示位置的第一坐标。
其中,目标顶点可以指显示子区域具有的且属于显示区域的顶点。需要说明的是,在显示子区域具有的且属于显示区域的顶点为两个以上时,可以从中随机选取或预先指定顶点作为目标顶点。
第一坐标可以指在第一方向上的坐标。具体地,可以构建坐标系,以使第一方向为坐标系中的一个坐标轴方向。第一距离可以由技术人员根据实际的应用场景预先设置。具体的偏移方向也可以由技术人员根据实际的应用场景预先设置。例如,偏移方向具体可以预设为第一方向所对应的坐标轴的正向,也可以为坐标轴的负向。
通过对结束位置所在的显示子区域中属于显示区域的顶点在用户的触控操作的垂直方向上的坐标在该方向上进行一定偏移,并将偏移后的坐标确定为控件的显示位置在该方向上的坐标,可以使得在该方向上,控件的显示位置能够比较靠近于所在的显示子区域的边界,避免控件显示在显示子区域的中心等位置导致对页面内容的遮挡等情况。
在本实施例的一些可选的实现方式中,在确定触控操作的结束位置所在的显示子区域后,可以将结束位置的第二坐标在第二方向上偏移第二距离,得到偏移后的第二坐标,然后确定偏移后的第二坐标作为显示位置的第二坐标。
其中,第二坐标可以指在第二方向上的坐标。第二方向可以指触控操作针对页面的操作方向。具体地,可以构建坐标系,以使第一方向和第二方向分别为坐标系中的坐标轴。第二距离可以由技术人员根据实际的应用场景预先设置。具体的偏移方向也可以由技术人员根据实际的应用场景预先设置。例如,偏移方向具体可以预设为第二方向所对应的坐标轴的正向,也可以为坐标轴的负向。
通过对结束位置在用户的触控操作的操作方向上的坐标进行一定偏移,并将偏移后的坐标确定为控件在该方向上的显示位置的坐标,可以使得控件在该方向上的显示位置能够比较靠近于用户的触控操作的结束位置处,避免用户需要从当前结束位置移动较远距离才能使用到控件的情况。
作为示例,在触控操作为上下滑动操作时,第一方向可以为页面的宽度方向,第二方向可以为页面的高度方向,此时,可以使用页面的宽度方向作为横轴,使用页面的高度方向作为纵轴,且使用页面的左上角作为原点构建平面直角坐标系。此时,第一坐标即为横坐标,第二坐标即为纵坐标。
假设页面全屏显示,且滑动操作的结束位置为“P(PX,PY)”,可以先判断“PX”的值是否小于屏幕宽度的一半。若小于,则可以说明滑动操作的结束位置比较靠近屏幕的左侧,即位于屏幕的左半边区域,若大于,则可以说明滑动操作的结束位置比较靠近屏幕的右侧,即位于屏幕的右半边区域。
在滑动操作的结束位置位于屏幕的左半边区域时,目标顶点为页面左上角顶点和左下角顶点,此时,目标顶点的横坐标为“0”。若预设的第一距离为“offsetX”,可以通过向右平移第一距离得到显示位置的横坐标,具体可以表示为:
SX=0+offsetX
其中,“SX”表示显示位置的横坐标。
在滑动操作的结束位置位于屏幕的右半边区域时,目标顶点为页面的右上角顶点和右下角顶点,此时,目标顶点的横坐标为屏幕宽度“ScreenWidth”,可以通过向左平移第一距离得到显示位置的横坐标,具体可以表示为:
SX=ScreenWidth-offsetX
同时,若第二距离为“offsetY”,可以通过对“PY”向上或向下平移第二距离得到显示位置的纵坐标。向上平移时,具体可以表示为:
SY=PY-offsetY
其中,“SY”表示显示位置的纵坐标。
向下平移时,具体可以表示为:
SY=PY+offsetY
继续参见图4,图4是根据本实施例的控件显示方法的一个示意性的应用场景400。在图4的应用场景中,用户可以利用终端401通过上下滑动操作来浏览长页面的内容。在用户每次滑动操作结束时,终端401可以确定长页面顶部距离页面当前显示位置是否大于预设阈值(如图中标号402所示),若不大于,则可以认为页面顶部距离页面当前显示位置较近,用户可以通过简单的滑动操作就可以返回页面顶部,此时可以不显示返回页面顶部按钮404。若大于,则可以进一步判断用户手指滑动的结束位置是靠近屏幕左侧还是靠近屏幕右侧(如图中标号403所示)。如图中所示,若用户手指滑动的结束位置比较靠近屏幕右侧,则可以在屏幕右侧且靠近用户手指附近的位置显示返回页面顶部按钮404,以便于用户在想返回页面顶部时,可以直接通过手指附近的返回页面顶部按钮404返回页面顶部。
继续参见图5,图5是根据本实施例的控件显示方法的又一个示意性的应用场景500。在图5的应用场景中,用户在使用终端501上的浏览器页面查阅地图时,可以通过双指进行放大或缩小地图的操作。在用户每次放大或缩小操作之后,终端401可以判断页面放大比例是否大于预设阈值(如图中标号502所示),若不大于,则可以认为页面放大或缩小比例较小,用户可以通过简单的操作就可以使页面恢复到以默认比例显示地图,此时可以不显示页面比例复原的按钮504。若大于,则可以进一步判断用户手指结束位置靠近屏幕左侧还是靠近屏幕右侧(图图中标号503所示),具体地,可以计算用户两个手指的坐标的平均值作为结束位置。如图中所示,若结束位置比较靠近屏幕右侧,则可以在屏幕右侧且靠近用户手指附近的位置显示页面比例复原的按钮504,以使用户可以通过手指附近的页面比例复原的按钮504使页面呈现的地图恢复到默认尺寸显示。
本公开的上述实施例提供的方法通过判断用户的触控操作的结束位置所在的显示子区域,并在该显示子区域中对控件的显示位置分别在用户的触控操作的操作方向和对应垂直方向上的坐标进行确定,可以进一步精确控制控件的显示位置位于用户的触控操作的附近且能够避免对页面内容的遮挡等,有助于进一步提升用户使用对页面的显示状态进行控制的控件的便捷性。
进一步参考图6,作为对上述各图所示方法的实现,本公开提供了控件显示装置的一个实施例,该装置实施例与图2所示的方法实施例相对应,该装置具体可以应用于各种电子设备中。
如图6所示,本实施例提供的控件显示装置600包括获取单元601、确定单元602和显示单元603。其中,获取单元601被配置成响应于检测到用户对页面的触控操作,获取触控操作的结束位置;确定单元602被配置成在结束位置所在的目标区域中确定控件的显示位置,其中,控件用于控制页面的显示状态;显示单元603被配置成在确定的显示位置处显示控件。
在本实施例中,控件显示装置600中:获取单元601、确定单元602和显示单元603的具体处理及其所带来的技术效果可分别参考图2对应实施例中的步骤201、步骤202和步骤203的相关说明,在此不再赘述。
在本实施例的一些可选的实现方式中,上述确定单元602进一步被配置成:确定结束位置所在的显示子区域,其中,显示子区域包括在第一方向上对页面的显示区域进行二等分得到的两个子区域,其中,第一方向为触控操作针对页面的操作方向的垂直方向;在确定的显示子区域中确定控件的显示位置。
在本实施例的一些可选的实现方式中,上述确定单元602进一步被配置成:将确定的显示子区域的目标顶点的第一坐标在第一方向上偏移第一距离,得到偏移后的第一坐标,其中,目标顶点为所述显示区域的顶点,第一坐标表示在第一方向上的坐标;确定偏移后的第一坐标作为显示位置的第一坐标。
在本实施例的一些可选的实现方式中,上述确定单元602进一步被配置成:将结束位置的第二坐标在第二方向上偏移第二距离,得到偏移后的第二坐标,其中,第二坐标表示在第二方向上的坐标,第二方向为触控操作针对页面的操作方向;确定偏移后的第二坐标作为显示位置的第二坐标。
在本实施例的一些可选的实现方式中,上述获取单元601进一步被配置成:确定触控操作的触控类型,其中,触控类型包括单点触控和多点触控;响应于确定触控操作的触控类型为多点触控,分别获取各个触控点的结束位置;根据各个点的结束位置,确定触控操作的结束位置。
在本实施例的一些可选的实现方式中,上述确定单元602进一步被配置成:响应于确定触控操作结束,确定是否显示控件;上述显示单元603进一步被配置成:响应于确定显示控件,获取触控操作的结束位置;在结束位置所在的目标区域中确定控件的显示位置;在确定的显示位置处显示控件。
在本实施例的一些可选的实现方式中,上述显示单元603进一步被配置成:响应于确定不显示控件,隐藏控件。
在本实施例的一些可选的实现方式中,上述控件用于控制将页面从当前状态切换为预设显示状态,其中,预设显示状态包括以下至少一项:呈现页面顶部、页面尺寸为默认尺寸。
本公开的上述实施例提供的装置,通过获取单元响应于检测到用户对页面的触控操作,获取触控操作的结束位置;确定单元在结束位置所在的目标区域中确定控件的显示位置,其中,控件用于控制页面的显示状态;显示单元在确定的显示位置处显示控件,可以使得对页面的显示状态进行控制的控件的显示位置能够根据用户的触控操作的结束位置而确定,避免在固定位置处显示该控件使得用户必须在固定位置进行操作来控制页面的显示状态,提升用户对控制页面的显示状态的控件的操作的灵活性。
下面参考图7,其示出了适于用来实现本公开的实施例的电子设备(例如图1中的终端设备)700的结构示意图。本公开的实施例中的终端设备可以包括但不限于诸如移动电话、笔记本电脑、数字广播接收器、PDA(个人数字助理)、PAD(平板电脑)、PMP(便携式多媒体播放器)、车载终端(例如车载导航终端)等等的移动终端以及诸如数字TV、台式计算机等等的固定终端。图7示出的终端设备仅仅是一个示例,不应对本公开的实施例的功能和使用范围带来任何限制。
如图7所示,电子设备700可以包括处理装置(例如中央处理器、图形处理器等)701,其可以根据存储在只读存储器(ROM)702中的程序或者从存储装置708加载到随机访问存储器(RAM)703中的程序而执行各种适当的动作和处理。在RAM 703中,还存储有电子设备700操作所需的各种程序和数据。处理装置701、ROM 702以及RAM703通过总线704彼此相连。输入/输出(I/O)接口705也连接至总线704。
通常,以下装置可以连接至I/O接口705:包括例如触摸屏、触摸板、键盘、鼠标、摄像头、麦克风、加速度计、陀螺仪等的输入装置706;包括例如液晶显示器(LCD)、扬声器、振动器等的输出装置707;包括例如磁带、硬盘等的存储装置708;以及通信装置709。通信装置709可以允许电子设备700与其他设备进行无线或有线通信以交换数据。虽然图7示出了具有各种装置的电子设备700,但是应理解的是,并不要求实施或具备所有示出的装置。可以替代地实施或具备更多或更少的装置。图7中示出的每个方框可以代表一个装置,也可以根据需要代表多个装置。
特别地,根据本公开的实施例,上文参考流程图描述的过程可以被实现为计算机软件程序。例如,本公开的实施例包括一种计算机程序产品,其包括承载在计算机可读介质上的计算机程序,该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中,该计算机程序可以通过通信装置709从网络上被下载和安装,或者从存储装置708被安装,或者从ROM 702被安装。在该计算机程序被处理装置701执行时,执行本公开的实施例的方法中限定的上述功能。
需要说明的是,本公开的实施例所述的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件,或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于:具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本公开的实施例中,计算机可读存储介质可以是任何包含或存储程序的有形介质,该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本公开的实施例中,计算机可读信号介质可以包括在基带中或者作为载波一部分传播的数据信号,其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式,包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读信号介质还可以是计算机可读存储介质以外的任何计算机可读介质,该计算机可读信号介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输,包括但不限于:电线、光缆、RF(射频)等等,或者上述的任意合适的组合。
上述计算机可读介质可以是上述电子设备中所包含的;也可以是单独存在,而未装配入该电子设备中。上述计算机可读介质承载有一个或者多个程序,当上述一个或者多个程序被该电子设备执行时,使得该电子设备:响应于检测到用户对页面的触控操作,获取触控操作的结束位置;在结束位置所在的目标区域中确定控件的显示位置,其中,控件用于控制页面的显示状态;在确定的显示位置处显示控件。
可以以一种或多种程序设计语言或其组合来编写用于执行本公开的实施例的操作的计算机程序代码,所述程序设计语言包括面向对象的程序设计语言—诸如Java、Smalltalk、C++,还包括常规的过程式程序设计语言—诸如“C”语言或类似的程序设计语言。程序代码可以完全地在用户计算机上执行、部分地在用户计算机上执行、作为一个独立的软件包执行、部分在用户计算机上部分在远程计算机上执行、或者完全在远程计算机或服务器上执行。在涉及远程计算机的情形中,远程计算机可以通过任意种类的网络——包括局域网(LAN)或广域网(WAN)——连接到用户计算机,或者,可以连接到外部计算机(例如利用因特网服务提供商来通过因特网连接)。
附图中的流程图和框图,图示了按照本公开各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上,流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分,该模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意,在有些作为替换的实现中,方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如,两个接连地表示的方框实际上可以基本并行地执行,它们有时也可以按相反的顺序执行,这依所涉及的功能而定。也要注意的是,框图和/或流程图中的每个方框、以及框图和/或流程图中的方框的组合,可以用执行规定的功能或操作的专用的基于硬件的系统来实现,或者可以用专用硬件与计算机指令的组合来实现。
描述于本公开的实施例中所涉及到的单元可以通过软件的方式实现,也可以通过硬件的方式来实现。所描述的单元也可以设置在处理器中,例如,可以描述为:一种处理器包括获取单元、确定单元和显示单元。其中,这些单元的名称在某种情况下并不构成对该单元本身的限定,例如,获取单元还可以被描述为“响应于检测到用户对页面的触控操作,获取触控操作的结束位置的单元”。
以上描述仅为本公开的较佳实施例以及对所运用技术原理的说明。本领域技术人员应当理解,本公开的实施例中所涉及的公开发明范围,并不限于上述技术特征的特定组合而成的技术方案,同时也应涵盖在不脱离本公开的上述发明构思的情况下,由上述技术特征或其等同特征进行任意组合而形成的其它技术方案。例如上述特征与本公开的实施例中公开的(但不限于)具有类似功能的技术特征进行互相替换而形成的技术方案。

Claims (11)

1.一种控件显示方法,包括:
响应于检测到用户对页面的触控操作,获取所述触控操作的结束位置;
在所述结束位置所在的目标区域中确定控件的显示位置,其中,所述控件用于控制所述页面的显示状态;
在确定的显示位置处显示所述控件。
2.根据权利要求1所述的方法,其中,所述在所述结束位置所在的目标区域中确定控件的显示位置,包括:
确定所述结束位置所在的显示子区域,其中,显示子区域包括在第一方向上对所述页面的显示区域进行二等分得到的两个子区域,其中,所述第一方向为所述触控操作针对所述页面的操作方向的垂直方向;
在确定的显示子区域中确定控件的显示位置。
3.根据权利要求2所述的方法,其中,所述在确定的显示子区域中确定控件的显示位置,包括:
将所述确定的显示子区域的目标顶点的第一坐标在第一方向上偏移第一距离,得到偏移后的第一坐标,其中,目标顶点为所述显示区域的顶点,第一坐标表示在第一方向上的坐标;
确定所述偏移后的第一坐标作为所述显示位置的第一坐标。
4.根据权利要求3所述的方法,其中,所述在确定的显示子区域中确定控件的显示位置,包括:
将所述结束位置的第二坐标在第二方向上偏移第二距离,得到偏移后的第二坐标,其中,第二坐标表示在第二方向上的坐标,第二方向为所述触控操作针对所述页面的操作方向;
确定所述偏移后的第二坐标作为所述显示位置的第二坐标。
5.根据权利要求1-4所述的方法,其中,所述响应于检测到用户对页面的触控操作,获取所述触控操作的结束位置,包括:
确定所述触控操作的触控类型,其中,触控类型包括单点触控和多点触控;
响应于确定所述触控操作的触控类型为多点触控,分别获取各个触控点的结束位置;
根据所述各个点的结束位置,确定所述触控操作的结束位置。
6.根据权利要求1-4之一所述的方法,其中,所述方法还包括:
响应于确定所述触控操作结束,确定是否显示所述控件;
响应于确定显示所述控件,获取所述触控操作的结束位置;在所述结束位置所在的目标区域中确定控件的显示位置;在确定的显示位置处显示所述控件。
7.根据权利要求6所述的方法,其中,所述方法还包括:
响应于确定不显示所述控件,隐藏所述控件。
8.根据权利要求1-4之一所述的方法,其中,所述控件用于控制将所述页面从当前状态切换为预设显示状态,其中,预设显示状态包括以下至少一项:呈现页面顶部、页面尺寸为默认尺寸。
9.一种控件显示装置,包括:
获取单元,被配置成响应于检测到用户对页面的触控操作,获取所述触控操作的结束位置;
确定单元,被配置成在所述结束位置所在的目标区域中确定控件的显示位置,其中,所述控件用于控制所述页面的显示状态;
显示单元,被配置成在确定的显示位置处显示所述控件。
10.一种电子设备,包括:
一个或多个处理器;
存储装置,其上存储有一个或多个程序;
当所述一个或多个程序被所述一个或多个处理器执行,使得所述一个或多个处理器实现如权利要求1-8中任一所述的方法。
11.一种计算机可读介质,其上存储有计算机程序,其中,该程序被处理器执行时实现如权利要求1-8中任一所述的方法。
CN202210491480.0A 2022-05-07 2022-05-07 控件显示方法和装置 Pending CN117055796A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202210491480.0A CN117055796A (zh) 2022-05-07 2022-05-07 控件显示方法和装置

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202210491480.0A CN117055796A (zh) 2022-05-07 2022-05-07 控件显示方法和装置

Publications (1)

Publication Number Publication Date
CN117055796A true CN117055796A (zh) 2023-11-14

Family

ID=88667975

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202210491480.0A Pending CN117055796A (zh) 2022-05-07 2022-05-07 控件显示方法和装置

Country Status (1)

Country Link
CN (1) CN117055796A (zh)

Similar Documents

Publication Publication Date Title
US11175726B2 (en) Gesture actions for interface elements
US10401964B2 (en) Mobile terminal and method for controlling haptic feedback
EP3091426B1 (en) User terminal device providing user interaction and method therefor
US9563341B2 (en) Data sharing
JP6215534B2 (ja) 情報処理装置及び情報処理方法、並びにコンピューター・プログラム
US20140267130A1 (en) Hover gestures for touch-enabled devices
EP3211515B1 (en) Display device and method for controlling display device
KR20160069286A (ko) 이동 단말기 및 그 제어 방법
EP2560086B1 (en) Method and apparatus for navigating content on screen using pointing device
AU2013223015A1 (en) Method and apparatus for moving contents in terminal
EP2747057A1 (en) Text-enlargement display method
US9513795B2 (en) System and method for graphic object management in a large-display area computing device
KR20150095541A (ko) 사용자 단말 장치 및 이의 디스플레이 방법
US20130132889A1 (en) Information processing apparatus and information processing method to achieve efficient screen scrolling
US20100333016A1 (en) Scrollbar
KR101231513B1 (ko) 터치를 이용한 컨텐츠 제어방법, 장치, 이를 위한 기록매체 및 이를 포함하는 사용자 단말
EP4328725A1 (en) Display method and apparatus, electronic device, and storage medium
US9817566B1 (en) Approaches to managing device functionality
CN117055796A (zh) 控件显示方法和装置
CN109558051B (zh) 多功能页面的切换处理方法、设备及计算机可读存储介质
KR20150053398A (ko) 모바일에서 스크롤 이동 제어장치 및 그 방법
CN117648048A (zh) 电子白板擦除方法、装置、电子设备以及存储介质
CN103902187A (zh) 一种控制电子设备的方法及电子设备
CN118092766A (zh) 对象选择方法、装置、设备、存储介质和程序产品
KR20120078816A (ko) 가상 터치 포인터 운용 방법 및 이를 지원하는 휴대 단말기

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