CN108021323A - 界面操作处理方法、装置、电子设备及存储介质 - Google Patents

界面操作处理方法、装置、电子设备及存储介质 Download PDF

Info

Publication number
CN108021323A
CN108021323A CN201810001180.3A CN201810001180A CN108021323A CN 108021323 A CN108021323 A CN 108021323A CN 201810001180 A CN201810001180 A CN 201810001180A CN 108021323 A CN108021323 A CN 108021323A
Authority
CN
China
Prior art keywords
display
area
content
touch
interface
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
CN201810001180.3A
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.)
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 CN201810001180.3A priority Critical patent/CN108021323A/zh
Publication of CN108021323A publication Critical patent/CN108021323A/zh
Priority to PCT/CN2018/090296 priority patent/WO2019134344A1/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/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
    • 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
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/38Creation or generation of source code for implementing user interfaces

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)
  • Software Systems (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本发明提供了一种界面操作处理方法、装置、电子设备及存储介质,涉及显示技术领域。该界面操作处理方法应用于一电子设备中,该界面操作处理方法包括:在电子设备的触控显示单元上显示第一显示界面,其中,触控显示单元包括用于显示第一显示界面上的头部区域的第一显示区域,和用于显示第一显示界面中与第一内容对应的第一内容区域的第二显示区域;获得在触控显示单元上进行的第一滑动操作;响应第一滑动操作,判断第一显示区域是否在触控显示单元上的第一预设区域;在为是时,在保持头部区域在第一预设区域中显示的过程中,在第二显示区域显示与第一内容不同的第二内容对应的第二内容区域。该界面操作处理方法可很好的处理显示界面中的滑动操作。

Description

界面操作处理方法、装置、电子设备及存储介质
技术领域
本发明涉及显示技术领域,具体而言,涉及一种界面操作处理方 法、装置、电子设备及存储介质。
背景技术
在一些软件中,其显示界面为上方显示头部区域,下方显示内容 区域的结构。用户对内容区域进行滚动时,头部区域都会同步的改变 位置,以实现头部区域随着内容区域的滚动而同时滚动。而这种实现 方式中,每次的滚动都需要多次传递参数来实现头部区域与内容区域 的同步,对于性能不佳的电子设备则可能出现掉帧,显示界面中的滚 动不协调的现象。
发明内容
有鉴于此,本发明实施例提供了一种界面操作处理方法、装置、 电子设备及存储介质。
为了实现上述目的,本发明采用的技术方案如下:
第一方面,本发明实施例提供了一种界面操作处理方法,应用于 一电子设备中,所述方法包括:在所述电子设备的触控显示单元上显 示第一显示界面,其中,所述触控显示单元包括用于显示所述第一显 示界面上的头部区域的第一显示区域,和用于显示第一显示界面中与 第一内容对应的第一内容区域的第二显示区域;获得在所述触控显示 单元上进行的第一滑动操作;响应所述第一滑动操作,判断所述第一 显示区域是否在所述触控显示单元上的第一预设区域;在为是时,在 保持所述头部区域在所述第一预设区域中显示的过程中,在所述第二 显示区域显示与所述第一内容不同的第二内容对应的第二内容区域。
第二方面,本发明实施例提供了一种界面操作处理装置,应用于 一电子设备中,所述装置包括:界面显示模块、第一操作获取模块、 第一操作响应模块以及第一执行模块,其中,所述界面显示模块用于 在所述电子设备的触控显示单元上显示第一显示界面,其中,所述触 控显示单元包括用于显示所述第一显示界面上的头部区域的第一显 示区域,和用于显示第一显示界面中与第一内容对应的第一内容区域 的第二显示区域;所述第一操作获取模块用于获得在所述触控显示单 元上进行的第一滑动操作;所述第一操作响应模块用于响应所述第一 滑动操作,判断所述第一显示区域是否在所述触控显示单元上的第一 预设区域;所述第一执行模块用于在所述第一显示区域在所述触控显 示单元上的第一预设区域时,在保持所述头部区域在所述第一预设区 域中显示的过程中,在所述第二显示区域显示与所述第一内容不同的 第二内容对应的第二内容区域。
第三方面,本发明实施例提供了一种电子设备,所述电子设备包 括存储器和处理器,所述存储器存储有计算机指令,当所述计算机指 令由所述处理器读取并执行时,使所述处理器执行上述第一方面提供 的界面操作处理方法。
第四方面,本发明实施例提供了一种存储介质,所述存储介质中 存储有计算机指令,其中,所述计算机指令在被读取并运行时执行上 述第一方面提供的界面操作处理方法。
本发明实施例提供的界面操作处理方法、装置、电子设备及存储 介质,通过在电子设备的触控显示单元上显示第一显示界面,其中, 触控显示单元包括用于显示第一显示界面上的头部区域的第一显示 区域,和用于显示第一显示界面中与第一内容对应的第一内容区域的 第二显示区域,然后获得在触控显示单元上进行的第一滑动操作,再 响应第一滑动操作,判断第一显示区域是否在触控显示单元上的第一 预设区域,最后在为是时,在保持头部区域在第一预设区域中显示的 过程中,在第二显示区域显示与第一内容不同的第二内容对应的第二 内容区域。该界面操作处理方法、装置、电子设备及存储介质通过显 示界面中的头部区域在预设区域时,将头部区域保持在预设区域中显 示,并显示与之前内容不同的内容对应的内容区域,从而避免每次内 容区域滚动时都会多次传递参数来实现头部区域与内容区域的同步, 造成性能不佳的电子设备可能出现掉帧,显示界面中的滚动不协调的 问题。
为使本发明的上述目的、特征和优点能更明显易懂,下文特举较 佳实施例,并配合所附附图,作详细说明如下。
附图说明
为使本发明实施例的目的、技术方案和优点更加清楚,下面将结 合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、 完整地描述,显然,所描述的实施例是本发明一部分实施例,而不是 全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有 做出创造性劳动前提下所获得的所有其他实施例,都属于本发明保护 的范围。
图1示出了本发明实施例提供的电子设备的方框示意图;
图2示出了本发明实施例提供的界面操作方法的流程图;
图3示出了本发明实施例提供的界面操作方法中步骤S130的流 程图;
图4示出了本发明实施例提供的界面操作装置的模块图;
图5示出了本发明实施例提供的界面操作装置中第一操作响应 模块的模块图。
具体实施方式
下面将结合本发明实施例中附图,对本发明实施例中的技术方案 进行清楚、完整地描述,显然,所描述的实施例仅仅是本发明一部分 实施例,而不是全部的实施例。通常在此处附图中描述和示出的本发 明实施例的组件可以以各种不同的配置来布置和设计。因此,以下对 在附图中提供的本发明的实施例的详细描述并非旨在限制要求保护 的本发明的范围,而是仅仅表示本发明的选定实施例。基于本发明的 实施例,本领域技术人员在没有做出创造性劳动的前提下所获得的所 有其他实施例,都属于本发明保护的范围。
应注意到:相似的标号和字母在下面的附图中表示类似项,因此, 一旦某一项在一个附图中被定义,则在随后的附图中不需要对其进行 进一步定义和解释。同时,在本发明的描述中,术语“第一”、“第二” 等仅用于区分描述,而不能理解为指示或暗示相对重要性。
图1示出了一种可应用于本发明实施例中的电子设备的结构框 图。如图1所示,电子设备100包括存储器102、存储控制器104, 一个或多个(图中仅示出一个)处理器106、外设接口108、射频模块 110、音频模块112、触控显示单元114等。这些组件通过一条或多 条通讯总线/信号线116相互通讯。
存储器102可用于存储软件程序以及模块,如本发明实施例中的 界面操作处理方法及装置对应的程序指令/模块,处理器106通过运 行存储在存储器102内的软件程序以及模块,从而执行各种功能应用 以及数据处理,如本发明实施例提供的界面操作处理方法。
存储器102可包括高速随机存储器,还可包括非易失性存储器, 如一个或者多个磁性存储装置、闪存、或者其他非易失性固态存储器。 处理器106以及其他可能的组件对存储器102的访问可在存储控制器 104的控制下进行。
外设接口108将各种输入/输出装置耦合至处理器106以及存储 器102。在一些实施例中,外设接口108,处理器106以及存储控制 器104可以在单个芯片中实现。在其他一些实例中,他们可以分别由 独立的芯片实现。
射频模块110用于接收以及发送电磁波,实现电磁波与电信号的 相互转换,从而与通讯网络或者其他设备进行通讯。
音频模块112向用户提供音频接口,其可包括一个或多个麦克 风、一个或者多个扬声器以及音频电路。
触控显示单元114在电子设备100与用户之间提供一个显示界 面。具体地,触控显示单元114向用户显示视频输出,这些视频输出 的内容可包括文字、图形、视频及其任意组合;触控显示单元114还 接收用户进行的滑动操作。
可以理解,图1所示的结构仅为示意,电子设备100还可包括比 图1中所示更多或者更少的组件,或者具有与图1所示不同的配置。 图1中所示的各组件可以采用硬件、软件或其组合实现。
在RN中只能通过一个固顶的view来当作头部header,下侧列 表中空出header高度。其中,RN(React Native)是开源的跨平台移 动应用开发框架。当列表滚动时同时上方的view来同步改变位置, 以此来达到头部随着列表同时滚动。但是这种结构框架由于头部与列 表不在同一框架,所以这样的滚动需要多次传递参数,导致同步滚动 掉帧,滚动画面不协调等。
第一实施例
如图2示出了本发明实施例提供的界面操作处理方法的流程图。 该界面操作方法应用于一电子设备中。请参见图2,该方法包括:
步骤S110:在所述电子设备的触控显示单元上显示第一显示界 面,其中,所述触控显示单元包括用于显示所述第一显示界面上的头 部区域的第一显示区域,和用于显示第一显示界面中与第一内容对应 的第一内容区域的第二显示区域。
在本发明实施例中,可以通过于RN列表中在ScrollView(父列 表)中嵌套一个ScrollableTabView(子列表)通过对手势的处理来实 现目标效果,在ScrollView中实现下拉刷新,并在ScrollView中放入 自定义的header和ScrollableTabView,在ScrollableTabView的每一 个子tab中实现上拉刷新。其中,header可以理解为头部区域,ScrollableTabView可以理解为内容区域。从而,使头部区域和内容区 域位于同一结构框架中。
具体的,搭建框架可以是使用npm插件引入ScrollableTabView, 建立如下结构:
首先,可以在电子设备的触控显示单元上显示第一显示界面。其 中,触控显示单元用于显示第一显示界面上的头部区域的第一显示区 域,和用户显示第一显示界面中与第一内容对应的第一内容区域的第 二显示区域。头部区域以及第一内容区域可以分别理解为上述的 header以及ScrollableTabView。
步骤S120:获得在所述触控显示单元上进行的第一滑动操作。
用户在对第一显示界面进行操作时,可以于触控显示单元上进行 滑动操作。从而,触控显示单元可以感应获得用户进行的第一滑动操 作。
步骤S130:响应所述第一滑动操作,判断所述第一显示区域是 否在所述触控显示单元上的第一预设区域。
在获得上述用户进行的第一滑动操作后,再判断显示头部区域的 第一显示区域是否在触控显示单元上的第一预设区域,即判断第一显 示界面中的头部区域是否在指定的第一预设区域。
在本发明实施例中,第一预设区域可以是靠近触控显示单元的顶 部的区域。
在本发明实施例中,请参见图3,步骤S130可以包括:
步骤S131:响应所述滑动操作,判断所述第一滑动操作对应的 第一滑动距离是否大于或者等于第三高度与所述第一显示界面中的 实际显示区域的第四高度的差,其中,所述第一显示区域的第一高度 与所述第二显示区域的第二高度之和为所述第三高度。
在本发明实施例中,可以定义变量offsetY,将 e.nativeEvent.contentOffset.y赋值offsetY。offsetY用于表示ScrollView 的滑动距离,即用户进行的滑动操作对应的滑动距离。
在本发明实施例中,可以定义变量showScrollViewHeight,将e.nativeEvent.layoutMeasurement.height赋值showScrollViewHeight。 contentHeight用于表示ScrollView的展示高度,即第一显示界面中的 实际显示区域的高度。
在本发明实施例中,可以定义变量ontentHeight,将e.nativeEvent.contentSize.height赋值contentHeight。contentHeight表 示整个ScrollView的高度,即第一显示区域的高度与第二显示区域的 高度的和。
在响应上述第一滑动操作时,可以获取第一滑动操作对应的第一 滑动距离,即上述变量offsetY的值;可以获取第一显示区域的第一 高度与第二显示区域的第二高度之和,即上述变量contentHeight的 值;可以获取第一显示界面中的实际显示区域的第四高度,即上述变 量showScrollViewHeight的值。
然后,再判断第一滑动操作对应的第一滑动距离是否大于或者等 于第三高度与第一显示界面中的实际显示区域的第四高度的差,即判 断offsetY是否大于或者等于contentHeight减去 showScrollViewHeight的值。
步骤S132:在为是时,表示所述第一显示区域在所述触控显示 单元上的第一预设区域;在为否时,表示所述第一显示区域未在所述 的第一预设区域。
可以理解的是,在步骤S131中的判断结果为第一滑动操作对应 的第一滑动距离大于或者等于第三高度与第四高度的差时,表示第一 显示区域在触控显示单元上的第一预设区域;在步骤S131中的判断 结果为第一滑动操作对应的第一滑动距离大于或者等于第三高度与 第四高度的差时,表示第一显示区域在触控显示单元上的第一预设区 域。从而,获得第一显示区域是否在触控显示单元上的第一预设区域 的判断结果。
步骤S140:在为是时,在保持所述头部区域在所述第一预设区 域中显示的过程中,在所述第二显示区域显示与所述第一内容不同的 第二内容对应的第二内容区域。
在本发明实施例中,当步骤S130的判断结果为上述第一显示区 域在触控显示单元的第一预设区域时,可以表示第一显示界面中头部 区域已经往上滚动达到指定的区域。因此,可以将头部区域保持在该 预设区域,并在第二显示区域显示与第一内容不同的第二内容对应的 第二内容区域,即显示ScrollableTabView往下的内容。
在本发明实施例中,在头部区域未达到第一预设区域时, ScrollView为解锁滚动的状态,ScrollableTabView为锁定滚动的状态, 此时对于滚动操作时,为整个ScrollView滚动。
在头部区域达到第一预设区域后,则锁定ScrollView的滚动,ScrollableTabView解锁滚动,以使头部区域固定在第一预设区域显 示,用户可以对内容区域进行滚动,实现对内容区域的滚动浏览。另 外,还可以在从ScrollView为解锁滚动的状态,ScrollableTabView为 锁定滚动的状态,变为ScrollView为锁定滚动的状态,ScrollableTabView为解锁滚动的状态时,将ScrollableTabView滚动 至初始显示界面中ScrollableTabView的位置,以防止手势拦截的异 常现象。
在本发明实施例中,在用户进行上滑时,但头部区域未达到第一 预设区域的过程中,可以保持ScrollView为解锁滚动的状态, ScrollableTabView为锁定滚动的状态,使整个ScrollView往上滚动, 并对第二显示区域中的内容区域进行更新。因此,该界面操作处理方 法还可以包括:
在为否时,在保持所述头部区域在第二预设区域中显示的过程 中,在所述第二显示区域显示与所述第一内容不同的第三内容对应的 第三内容区域,其中,所述第二预设区域的面积大于所述第一预设区 域的面积。
可以理解的是,使整个ScrollView往上滚动,第一显示区域的面 积会逐渐减小,但是第一显示区域未达到第一预设区域,因此第二预 设区域的面积大于第一预设区域的面积。另外,使内容区域的面积变 大,内容区域显示更多的内容。
在本发明实施例中,在第一显示区域达到第一预设区域后,向下 滚动到一定位置时,则回到ScrollView为解锁滚动的状态, ScrollableTabView为锁定滚动的状态。具体可以是,将 e.nativeEvent.contentOffset.y赋值lastOneOffsetY,代表内容区域的滚 动高度。在下滑时判断出lastOneOffsetY的值为0时,则表示内容区 域滚动到初始显示界面的位置,则ScrollView为解锁滚动的状态, ScrollableTabView为锁定滚动的状态。
在对于用户的下滑操作,并下拉到一定位置时,可以对第一显示 界面中的第二显示区域的内容区域进行刷新。因此,该截面操作处理 方法还可以包括:
在为所述第一显示区域未在所述触控显示单元上的第一预设区 域时,判断所述第二显示区域的上边缘距离所述第一显示界面的上边 缘的距离是否大于预设距离;在所述第二显示区域的上边缘距离所述 第一显示界面的上边缘的距离大于预设距离时,在所述第二显示区域 显示与所述第一内容不同的第四内容对应的第四内容区域。
可以理解的是,当下拉到第二内容区域的上边缘距离第一显示界 面的上边缘一定距离时,则调用ScrollView中的refreshControl,在 该方法中处理下拉刷新,并且,只对当前的内容区域进行刷新。
在用户在步骤S140之后,继续上滑使第二显示区域中的内容区 域滚动到底部时,则需要对内容区域的数据进行加载。因此,该界操 作处理方法还可以包括:
判断所述第二内容是否为当前存储的用于显示于所述第二显示 区域的数据源中的底部的内容;在为是时,获取加载数据并将所述加 载数据存储于所述数据源中。
可以理解的是,在ScrollView为锁定滚动的状态, ScrollableTabView为解锁滚动的状态时,如果用户下滑使第二显示区 域中的内容区域对应的数据源已经到底部,则需要对数据源的数据进 行加载。可以是调用onEndReached,来分页加载数据,以使继续向 下滚动时,能展示内容于第二显示区域。
在本发明实施例中,在第二显示区域中有多个内容区域时,可以 利用横向滚动对内容区域切换显示于第二显示区域。
在本发明实施例中,该界面操作处理方法还可以包括:获得在所 述触控显示单元上进行的第二滑动操作;响应所述第二滑动操作,判 断所述第二内容区域是否在所述触控显示单元上的第三预设区域;在 为是时,存储所述第二内容区域,并在所述第二显示区域显示与所述 第二内容不同的第五内容对应的第五内容区域。
可以理解的是,第三预设区域为靠近左右两侧的显示区域,表示 第二内容区域横向到该第三预设区域时,则实现内容区域的切换,并 且将第二内容区域存储,使用户切换回第二内容区域时,可以使用户 于之前的位置继续浏览。
本发明第一实施例提供的界面操作处理方法,通过列表的嵌套结 合对手势的处理,搭建了上述的框架,使显示界面中的滚动变为整个 显示界面的滚动或者仅内容区域的滚动,可以实现显示界面中的头部 区域在预设区域时,将头部区域保持在预设区域中显示,并显示与之 前内容不同的内容对应的内容区域,没有频繁的数据传递,不会造成 滑动不不同步等问题。从而避免每次内容区域滚动时都会多次传递参 数来实现头部区域与内容区域的同步,造成性能不佳的电子设备可能 出现掉帧,显示界面中的滚动不协调的问题。
第二实施例
本发明第二实施例提供了一种界面操作处理装置,应用于一电子 设备中。请参见图4,该界面操作处理装置200包括:界面显示模块 210、第一操作获取模块220、第一操作响应模块230以及第一执行 模块240。其中,所述界面显示模块210用于在所述电子设备的触控 显示单元上显示第一显示界面,其中,所述触控显示单元包括用于显 示所述第一显示界面上的头部区域的第一显示区域,和用于显示第一 显示界面中与第一内容对应的第一内容区域的第二显示区域;所述第 一操作获取模块220用于获得在所述触控显示单元上进行的第一滑 动操作;所述第一操作响应模块230用于响应所述第一滑动操作,判 断所述第一显示区域是否在所述触控显示单元上的第一预设区域;所 述第一执行模块240用于在所述第一显示区域在所述触控显示单元 上的第一预设区域时,在保持所述头部区域在所述第一预设区域中显 示的过程中,在所述第二显示区域显示与所述第一内容不同的第二内容对应的第二内容区域。
在本发明实施例中,请参见图5,所述第一操作响应模块230可 以包括第一判断单元231以及判定执行单元232。其中,所述第一判 断单元231用于响应所述滑动操作,判断所述第一滑动操作对应的第 一滑动距离是否大于或者等于第三高度与所述第一显示界面中的实 际显示区域的第四高度的差,其中,所述第一显示区域的第一高度与 所述第二显示区域的第二高度之和为所述第三高度;所述判定执行单 元232用于在所述第一滑动操作对应的第一滑动距离大于或者等于 第三高度与所述第一显示界面中的实际显示区域的第四高度的差时, 表示所述第一显示区域在所述触控显示单元上的第一预设区域;所述 判定执行单元232还用于在所述第一滑动操作对应的第一滑动距离 未大于或者等于第三高度与所述第一显示界面中的实际显示区域的 第四高度的差时,表示所述第一显示区域未在所述的第一预设区域。
在本发明实施例中,该截面操作处理装置200还可以包括第二执 行模块,第二执行模块用于在所述第一显示区域未在所述触控显示单 元上的第一预设区域时,在保持所述头部区域在第二预设区域中显示 的过程中,在所述第二显示区域显示与所述第一内容不同的第三内容 对应的第三内容区域,其中,所述第二预设区域的面积大于所述第一 预设区域的面积。
在本发明实施例中,该界面操作处理装置200还可以包括第三执 行模块以及第四执行模块。其中,第三执行模块用于在所述第一显示 区域未在所述触控显示单元上的预设区域时,判断所述第一内容区域 的上边缘距离所述第一显示界面的上边缘的距离是否大于预设距离; 第四执行模块用于在所述第一内容区域的上边缘距离所述第一显示 界面的上边缘的距离大于预设距离时,在所述第二显示区域显示与所 述第一内容不同的第四内容对应的第四内容区域。
在本发明实施例中,该界面操作处理装置200还可以包括第五执 行模块以及第六执行模块。其中,第五执行模块用于判断所述第二内 容是否为当前存储的用于显示于所述第二显示区域的数据源中的底 部的内容;第六执行模块用于在所述第二内容为当前存储的用于显示 于所述第二显示区域的数据源中的底部的内容时,获取加载数据并将 所述加载数据存储于所述数据源中。
在本发明实施例中,该界面操作处理装置200还可以包括第二操 作获得模块、第二操作响应模块以及第七执行模块。其中,第二操作 获得模块用于获得在所述触控显示单元上进行的第二滑动操作;第二 操作响应模块用于响应所述第二滑动操作,判断所述第二内容区域是 否在所述触控显示单元上的第三预设区域;第七执行模块用于在所述 第二内容区域在所述触控显示单元上的第三预设区域时,存储所述第 二内容区域,并在所述第二显示区域显示与所述第二内容不同的第五 内容对应的第五内容区域。
第三实施例
本发明第三实施例提供了一种电子设备100,请参见图1,所述 电子设备100包括存储器102和处理器106,所述存储器102存储有 计算机指令,当所述计算机指令由所述处理器106读取并执行时,使 所述处理器106执行本发明第一实施例提供的界面操作处理方法。
第四实施例
本发明第四实施例提供了一种存储介质,所述存储介质中存储有 计算机指令,其中,所述计算机指令在被读取并运行时执行本发明第 一实施例提供的界面操作处理方法。
综上所述,本发明实施例提供的界面操作处理方法、装置、电子 设备及存储介质,通过在电子设备的触控显示单元上显示第一显示界 面,其中,触控显示单元包括用于显示第一显示界面上的头部区域的 第一显示区域,和用于显示第一显示界面中与第一内容对应的第一内 容区域的第二显示区域,然后获得在触控显示单元上进行的第一滑动 操作,再响应第一滑动操作,判断第一显示区域是否在触控显示单元 上的第一预设区域,最后在为是时,在保持头部区域在第一预设区域 中显示的过程中,在第二显示区域显示与第一内容不同的第二内容对 应的第二内容区域。该界面操作处理方法、装置、电子设备及存储介质通过显示界面中的头部区域在预设区域时,将头部区域保持在预设 区域中显示,并显示与之前内容不同的内容对应的内容区域,从而避 免每次内容区域滚动时都会多次传递参数来实现头部区域与内容区 域的同步,造成性能不佳的电子设备可能出现掉帧,显示界面中的滚 动不协调的问题。
需要说明的是,本说明书中的各个实施例均采用递进的方式描 述,每个实施例重点说明的都是与其他实施例的不同之处,各个实施 例之间相同相似的部分互相参见即可。对于装置类实施例而言,由于 其与方法实施例基本相似,所以描述的比较简单,相关之处参见方法 实施例的部分说明即可。
本申请所提供的几个实施例中,应该理解到,所揭露的装置和方 法,也可以通过其它的方式实现。以上所描述的装置实施例仅仅是示 意性的,例如,附图中的流程图和框图显示了根据本发明的多个实施 例的装置、方法和计算机程序产品的可能实现的体系架构、功能和操 作。在这点上,流程图或框图中的每个方框可以代表一个模块、程序 段或代码的一部分,所述模块、程序段或代码的一部分包含一个或多 个用于实现规定的逻辑功能的可执行指令。也应当注意,在有些作为 替换的实现方式中,方框中所标注的功能也可以以不同于附图中所标 注的顺序发生。例如,两个连续的方框实际上可以基本并行地执行,它们有时也可以按相反的顺序执行,这依所涉及的功能而定。也要注 意的是,框图和/或流程图中的每个方框、以及框图和/或流程图中的 方框的组合,可以用执行规定的功能或动作的专用的基于硬件的系统 来实现,或者可以用专用硬件与计算机指令的组合来实现。
另外,在本发明各个实施例中的各功能模块可以集成在一起形成 一个独立的部分,也可以是各个模块单独存在,也可以两个或两个以 上模块集成形成一个独立的部分。
所述功能如果以软件功能模块的形式实现并作为独立的产品销 售或使用时,可以存储在一个计算机可读取存储介质中。基于这样的 理解,本发明的技术方案本质上或者说对现有技术做出贡献的部分或 者该技术方案的部分可以以软件产品的形式体现出来,该计算机软件 产品存储在一个存储介质中,包括若干指令用以使得一台计算机设备 (可以是个人计算机,服务器,或者网络设备等)执行本发明各个实 施例所述方法的全部或部分步骤。而前述的存储介质包括:U盘、移 动硬盘、只读存储器(ROM,Read-Only Memory)、随机存取存储器 (RAM,Random Access Memory)、磁碟或者光盘等各种可以存储程 序代码的介质。需要说明的是,在本文中,诸如第一和第二等之类的 关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开 来,而不一定要求或者暗示这些实体或操作之间存在任何这种实际的 关系或者顺序。而且,术语“包括”、“包含”或者其任何其他变体意在 涵盖非排他性的包含,从而使得包括一系列要素的过程、方法、物品 或者设备不仅包括那些要素,而且还包括没有明确列出的其他要素, 或者是还包括为这种过程、方法、物品或者设备所固有的要素。在没 有更多限制的情况下,由语句“包括一个……”限定的要素,并不排除 在包括所述要素的过程、方法、物品或者设备中还存在另外的相同要 素。
以上所述仅为本发明的优选实施例而已,并不用于限制本发明, 对于本领域的技术人员来说,本发明可以有各种更改和变化。凡在本 发明的精神和原则之内,所作的任何修改、等同替换、改进等,均应 包含在本发明的保护范围之内。应注意到:相似的标号和字母在下面 的附图中表示类似项,因此,一旦某一项在一个附图中被定义,则在 随后的附图中不需要对其进行进一步定义和解释。
以上所述,仅为本发明的具体实施方式,但本发明的保护范围并 不局限于此,任何熟悉本技术领域的技术人员在本发明揭露的技术范 围内,可轻易想到变化或替换,都应涵盖在本发明的保护范围之内。 因此,本发明的保护范围应所述以权利要求的保护范围为准。

Claims (10)

1.一种界面操作处理方法,应用于一电子设备中,其特征在于,所述方法包括:
在所述电子设备的触控显示单元上显示第一显示界面,其中,所述触控显示单元包括用于显示所述第一显示界面上的头部区域的第一显示区域,和用于显示第一显示界面中与第一内容对应的第一内容区域的第二显示区域;
获得在所述触控显示单元上进行的第一滑动操作;
响应所述第一滑动操作,判断所述第一显示区域是否在所述触控显示单元上的第一预设区域;
在为是时,在保持所述头部区域在所述第一预设区域中显示的过程中,在所述第二显示区域显示与所述第一内容不同的第二内容对应的第二内容区域。
2.根据权利要求1所述的方法,其特征在于,响应所述第一滑动操作,判断所述第一显示区域是否在所述触控显示单元上的第一预设区域,包括:
响应所述第一滑动操作,判断所述第一滑动操作对应的第一滑动距离是否大于或者等于第三高度与所述第一显示界面中的实际显示区域的第四高度的差,其中,所述第一显示区域的第一高度与所述第二显示区域的第二高度之和为所述第三高度;
在为是时,表示所述第一显示区域在所述触控显示单元上的第一预设区域;
在为否时,表示所述第一显示区域未在所述的第一预设区域。
3.根据权利要求1所述的方法,其特征在于,响应所述第一滑动操作,判断所述第一显示区域是否在所述触控显示单元上的第一预设区域之后,所述方法还包括:
在为否时,在保持所述头部区域在第二预设区域中显示的过程中,在所述第二显示区域显示与所述第一内容不同的第三内容对应的第三内容区域,其中,所述第二预设区域的面积大于所述第一预设区域的面积。
4.根据权利要求1所述的方法,其特征在于,响应所述第一滑动操作,判断所述第一显示区域是否在所述触控显示单元上的第一预设区域之后,所述方法还包括:
在为否时,判断所述第二显示区域的上边缘距离所述第一显示界面的上边缘的距离是否大于预设距离;
在为是时,在所述第二显示区域显示与所述第一内容不同的第四内容对应的第四内容区域。
5.根据权利要求1所述的方法,其特征在于,在保持所述头部区域在所述第一预设区域中显示的过程中,在所述第二显示区域显示与所述第一内容不同的第二内容对应的第二内容区域之后,所述方法还包括:
判断所述第二内容是否为当前存储的用于显示于所述第二显示区域的数据源中的底部的内容;
在为是时,获取加载数据并将所述加载数据存储于所述数据源中。
6.根据权利要求1所述的方法,其特征在于,在保持所述头部区域在所述第一预设区域中显示的过程中,在所述第二显示区域显示与所述第一内容不同的第二内容对应的第二内容区域之后,所述方法还包括:
获得在所述触控显示单元上进行的第二滑动操作;
响应所述第二滑动操作,判断所述第二内容区域是否在所述触控显示单元上的第三预设区域;
在为是时,存储所述第二内容区域,并在所述第二显示区域显示与所述第二内容不同的第五内容对应的第五内容区域。
7.界面操作处理装置,应用于一电子设备中,其特征在于,所述装置包括:界面显示模块、第一操作获取模块、第一操作响应模块以及第一执行模块,其中,
所述界面显示模块用于在所述电子设备的触控显示单元上显示第一显示界面,其中,所述触控显示单元包括用于显示所述第一显示界面上的头部区域的第一显示区域,和用于显示第一显示界面中与第一内容对应的第一内容区域的第二显示区域;
所述第一操作获取模块用于获得在所述触控显示单元上进行的第一滑动操作;
所述第一操作响应模块用于响应所述第一滑动操作,判断所述第一显示区域是否在所述触控显示单元上的第一预设区域;
所述第一执行模块用于在所述第一显示区域在所述触控显示单元上的第一预设区域时,在保持所述头部区域在所述第一预设区域中显示的过程中,在所述第二显示区域显示与所述第一内容不同的第二内容对应的第二内容区域。
8.根据权利要求7所述的装置,其特征在于,所述第一操作响应模块包括第一判断单元以及判定执行单元,其中,
所述第一判断单元用于响应所述滑动操作,判断所述第一滑动操作对应的第一滑动距离是否大于或者等于第三高度与所述第一显示界面中的实际显示区域的第四高度的差,其中,所述第一显示区域的第一高度与所述第二显示区域的第二高度之和为所述第三高度;
所述判定执行单元用于在所述第一滑动操作对应的第一滑动距离大于或者等于第三高度与所述第一显示界面中的实际显示区域的第四高度的差时,表示所述第一显示区域在所述触控显示单元上的第一预设区域;
所述判定执行单元还用于在所述第一滑动操作对应的第一滑动距离未大于或者等于第三高度与所述第一显示界面中的实际显示区域的第四高度的差时,表示所述第一显示区域未在所述的第一预设区域。
9.一种电子设备,其特征在于,所述电子设备包括存储器和处理器,所述存储器存储有计算机指令,当所述计算机指令由所述处理器读取并执行时,使所述处理器执行如权利要求1-6中任一权项所述的方法。
10.一种存储介质,其特征在于,所述存储介质中存储有计算机指令,其中,所述计算机指令在被读取并运行时执行如权利要求1-6中任一权项所述的方法。
CN201810001180.3A 2018-01-02 2018-01-02 界面操作处理方法、装置、电子设备及存储介质 Pending CN108021323A (zh)

Priority Applications (2)

Application Number Priority Date Filing Date Title
CN201810001180.3A CN108021323A (zh) 2018-01-02 2018-01-02 界面操作处理方法、装置、电子设备及存储介质
PCT/CN2018/090296 WO2019134344A1 (zh) 2018-01-02 2018-06-07 界面操作处理方法、装置、电子设备及存储介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201810001180.3A CN108021323A (zh) 2018-01-02 2018-01-02 界面操作处理方法、装置、电子设备及存储介质

Publications (1)

Publication Number Publication Date
CN108021323A true CN108021323A (zh) 2018-05-11

Family

ID=62072421

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201810001180.3A Pending CN108021323A (zh) 2018-01-02 2018-01-02 界面操作处理方法、装置、电子设备及存储介质

Country Status (2)

Country Link
CN (1) CN108021323A (zh)
WO (1) WO2019134344A1 (zh)

Cited By (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN109656639A (zh) * 2018-12-25 2019-04-19 深圳创维数字技术有限公司 一种界面滚动方法、装置、设备及介质
WO2019134344A1 (zh) * 2018-01-02 2019-07-11 武汉斗鱼网络科技有限公司 界面操作处理方法、装置、电子设备及存储介质

Citations (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN106406712A (zh) * 2016-10-21 2017-02-15 广州酷狗计算机科技有限公司 信息显示方法及装置

Family Cites Families (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US5398310A (en) * 1992-04-13 1995-03-14 Apple Computer, Incorporated Pointing gesture based computer note pad paging and scrolling interface
CN104008115B (zh) * 2013-02-27 2018-11-13 腾讯科技(深圳)有限公司 一种wap页面标题栏显示方法及系统
CN107247536B (zh) * 2017-06-02 2019-11-12 武汉斗鱼网络科技有限公司 直播界面透明度的调整方法、存储介质、电子设备及系统
CN108021323A (zh) * 2018-01-02 2018-05-11 武汉斗鱼网络科技有限公司 界面操作处理方法、装置、电子设备及存储介质

Patent Citations (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN106406712A (zh) * 2016-10-21 2017-02-15 广州酷狗计算机科技有限公司 信息显示方法及装置

Cited By (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2019134344A1 (zh) * 2018-01-02 2019-07-11 武汉斗鱼网络科技有限公司 界面操作处理方法、装置、电子设备及存储介质
CN109656639A (zh) * 2018-12-25 2019-04-19 深圳创维数字技术有限公司 一种界面滚动方法、装置、设备及介质
CN109656639B (zh) * 2018-12-25 2022-04-15 深圳创维数字技术有限公司 一种界面滚动方法、装置、设备及介质

Also Published As

Publication number Publication date
WO2019134344A1 (zh) 2019-07-11

Similar Documents

Publication Publication Date Title
US10979760B2 (en) Moving video tags
CN105119809B (zh) 动态信息显示方法和装置
CN107066174A (zh) 浮层显示方法、装置及用户终端
CN106502602A (zh) 一种柔性屏幕的显示装置、方法及终端
CN103069458A (zh) 用于满足最小帧速率要求的图形呈现方法
CN107959965A (zh) 应用程序的降帧方法、装置、移动终端及可读存储介质
CN105988860A (zh) 执行应用程序的方法及移动装置
CN107818008A (zh) 页面加载方法及装置
CN107402962A (zh) 页面显示方法和装置
CN102201223A (zh) 图像处理设备、图像处理方法和图像处理程序
CN104346022A (zh) 用于消息处理的方法和装置
CN104093058A (zh) 平板显示屏的多窗口显示系统及一种智能电视
CN108021323A (zh) 界面操作处理方法、装置、电子设备及存储介质
CN109685539A (zh) 基于数据处理的首页展示方法、设备、存储介质及装置
EP3995954A1 (en) Method for operating widget, terminal and storage medium
CN109725960A (zh) 显示界面展示方法、装置、移动终端及存储介质
CN103955330B (zh) 一种信息显示方法及装置
WO2023045958A1 (zh) 应用图标显示方法、装置和电子设备
CN108469973A (zh) 界面内容的显示方法、显示装置以及智能显示设备
CN103941976B (zh) 一种信息处理方法及电子设备
CN107734138A (zh) 通知消息的显示方法及装置、计算机装置和存储介质
CN106201551A (zh) 一种应用程序退出方法及装置
CN105930024A (zh) 交互界面显示方法、装置及用户终端
CN104462099B (zh) 一种信息处理方法及电子设备
CN108646975A (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
RJ01 Rejection of invention patent application after publication
RJ01 Rejection of invention patent application after publication

Application publication date: 20180511