CN112905075B - 页面显示方法、装置及介质 - Google Patents

页面显示方法、装置及介质 Download PDF

Info

Publication number
CN112905075B
CN112905075B CN202110213145.XA CN202110213145A CN112905075B CN 112905075 B CN112905075 B CN 112905075B CN 202110213145 A CN202110213145 A CN 202110213145A CN 112905075 B CN112905075 B CN 112905075B
Authority
CN
China
Prior art keywords
target
tab
display
page
sliding
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
CN202110213145.XA
Other languages
English (en)
Other versions
CN112905075A (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.)
Futuo Network Technology Shenzhen Co ltd
Original Assignee
Futuo Network Technology Shenzhen 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 Futuo Network Technology Shenzhen Co ltd filed Critical Futuo Network Technology Shenzhen Co ltd
Priority to CN202110213145.XA priority Critical patent/CN112905075B/zh
Publication of CN112905075A publication Critical patent/CN112905075A/zh
Application granted granted Critical
Publication of CN112905075B publication Critical patent/CN112905075B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input 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/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481—Interaction 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
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input 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/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484—Interaction 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/0485—Scrolling or panning
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input 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/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0487—Interaction 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/0488—Interaction 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/04883—Interaction 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
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input 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/14—Digital output to display device ; Cooperation and interconnection of the display device with other functional units
    • G06F3/147—Digital output to display device ; Cooperation and interconnection of the display device with other functional units using display panels
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06V—IMAGE OR VIDEO RECOGNITION OR UNDERSTANDING
    • G06V40/00—Recognition of biometric, human-related or animal-related patterns in image or video data
    • G06V40/10—Human or animal bodies, e.g. vehicle occupants or pedestrians; Body parts, e.g. hands
    • G06V40/12—Fingerprints or palmprints
    • G06V40/1365—Matching; Classification

Landscapes

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

Abstract

本申请涉及一种页面显示方法、装置及介质，其中方法包括：若在目标页面的内容组件上检测到滑动操作，则控制目标指示器和内容组件的内容跟随滑动操作滑动显示，目标指示器显示于目标页面的目标选项卡组件中，用于指示与内容组件中显示的内容对应的选项卡，目标页面基于目标回收者视图组件；在内容组件上检测到滑动操作结束，且滑动操作满足切换条件时，控制目标指示器显示于目标选项卡组件中与滑动操作对应的目标选项卡的对应位置上，控制内容组件中显示目标选项卡的内容。采用本申请，能够提高显示效果。

Description

页面显示方法、装置及介质
技术领域
本申请涉及计算机技术领域，主要涉及了一种页面显示方法、装置及介质。
背景技术
随着信息技术和电子技术的发展，电子设备(例如，手机、平板电脑等)的功能越来越强大，且很多业务都可以在电子设备的应用程序上进行，例如，股票、基金、期货、债券等标的物的订单业务。应用程序中显示的目标页面通常可包括多个子页面，且每一子页面对应一个选项卡。例如，如图1所示的行情页面，包括“全部”、“港股”、“美股”、“沪深”、“基金”和“a股行情”等多个选项卡，当前显示的子页面为“全部”选项卡对应的页面。
目前，可基于安卓原生的TabLayout控件实现页面滑动的效果。然而，TabLayout控件在性能上有所欠缺，当整个选项栏容器内的选项卡足够多时，加载时间会变长，严重则会导致视觉上的卡顿、拖慢其他任务的进程。
发明内容
本申请实施例提供了一种页面显示方法、装置及介质，能够基于目标回收者视图组件实现目标指示器和内容组件中的内容跟随滑动操作滑动显示，可提高滑动显示的页面流畅效果。
第一方面，本申请实施例提供一种页面显示方法，其中：
若在目标页面的内容组件上检测到滑动操作，则控制目标指示器和所述内容组件的内容跟随所述滑动操作滑动显示，所述目标指示器显示于所述目标页面的目标选项卡组件中，用于指示与所述内容组件中显示的内容对应的选项卡，所述目标页面基于目标回收者视图组件；
在所述内容组件上检测到所述滑动操作结束，且所述滑动操作满足切换条件时，控制所述目标指示器显示于所述目标选项卡组件中与所述滑动操作对应的目标选项卡的对应位置上，控制所述内容组件中显示所述目标选项卡的内容。
在一个可能的示例中，所述控制目标指示器和所述内容组件的内容跟随所述滑动操作滑动显示包括：
根据所述滑动操作的滑动距离和所述目标页面的页面宽度确定所述目标页面的滑动比例；
根据所述滑动操作的滑动速度和/或所述滑动比例确定目标指示器的显示参数；
控制所述目标指示器基于所述显示参数滑动显示，控制所述内容组件的内容基于所述滑动比例滑动显示。
在一个可能的示例中，所述目标指示器的显示长度和所述目标选项卡对应的显示长度相等。
在一个可能的示例中，所述显示参数包括所述滑动速度和伸缩长度，所述伸缩长度大于源选项卡对应的显示长度，且小于或等于所述源选项卡对应的显示长度和所述目标选项卡对应的显示长度之和，所述源选项卡为所述滑动操作之前所述内容组件的内容对应的选项卡。
在一个可能的示例中，所述方法还包括：
若在所述目标选项卡组件的指定选项卡上检测到点击操作，则控制所述目标指示器滑动显示至所述指定选项卡对应的位置，控制所述内容组件中显示所述指定选项卡的内容。
在一个可能的示例中，所述控制所述目标指示器滑动显示至所述指定选项卡对应的位置包括：
确定源选项卡的内容切换为所述指定选项卡的内容的切换时长，以及所述源选项卡和所述指定选项卡之间所有的中间选项卡对应的显示长度之和，所述源选项卡为所述点击操作之前所述内容组件的内容对应的选项卡；
根据所述切换时长和所述显示长度之和确定所述目标指示器的目标滑动速度；
控制所述目标指示器基于所述目标滑动速度滑动显示。
在一个可能的示例中，所述目标选项卡组件对应多个第一选项卡，所述多个第一选项卡包括所述目标选项卡，所述方法还包括：
接收针对所述目标页面的选项卡定制请求，所述选项卡定制请求对应多个第二选项卡；
根据所述多个第一选项卡和所述多个第二选项卡确定至少一个差别选项卡；
根据所述至少一个差别选项卡对所述目标选项卡组件进行局部更新，以使所述目标选项卡组件对应所述多个第二选项卡。
在一个可能的示例中，所述目标选项卡组件对应多个第一选项卡，所述多个第一选项卡包括所述目标选项卡，所述方法还包括：
计算所述多个第一选项卡对应的显示长度之和，得到目标显示长度；
若所述目标显示长度大于所述目标页面的页面宽度，则根据所述多个第一选项卡的显示顺序从所述多个第一选项卡中选取与所述目标选项卡的显示顺序接近的多个第三选项卡，以使所述目标选项卡对应的显示长度和所述多个第三选项卡对应的显示长度之和小于或等于所述页面宽度；
控制所述目标选项卡组件上显示所述多个第三选项卡。
在一个可能的示例中，所述方法还包括：
当所述滑动操作的滑动距离大于或等于预设距离时，确定所述滑动操作满足切换条件。
在一个可能的示例中，所述方法还包括：
根据所述滑动操作的滑动力度和滑动速度确定所述预设距离。
在一个可能的示例中，所述方法还包括：
根据所述滑动操作的参数计算切换概率；当切换概率大于第一预设阈值时，确定所述滑动操作满足切换条件。
在一个可能的示例中，所述方法还包括：
根据所述点击操作的参数计算切换概率；当切换概率大于第一预设阈值时，确定所述点击操作满足切换条件。
在一个可能的示例中，所述方法还包括：
若所述滑动操作对应的目标选项卡为预设选项卡，则确定电子设备的环境信息；
根据所述环境信息确定用户的目标安全值；
若所述目标安全值小于第二预设阈值，则获取所述滑动操作对应的指纹图像；
若所述指纹图像与预设指纹模板匹配成功，则确定所述滑动操作满足切换条件。
在一种可能的示例中，所述方法还包括：
对所述指纹图像进行划分，得到至少两个子指纹图像；
根据至少两个所述子指纹图像确定所述指纹图像的采集角度；
根据所述采集角度获取预设指纹模板；
获取各个所述子指纹图像的图像质量；
根据所述子指纹图像的图像质量，从所述子指纹图像中选取至少两个目标子指纹图像；
获取各个所述目标子指纹图像和所述预设指纹模板之间的子匹配值；
根据所述子匹配值获取目标匹配值；
若所述目标匹配值大于或等于第三预设阈值，则确定所述指纹图像与所述预设指纹模板匹配成功。
在一个可能的示例中，所述目标回收者视图组件包括标签回收者视图控件、与所述标签回收者视图控件关联的页面容器、标签插值器和默认标签布局类，所述页面容器用于承载用户的滑动操作以及点击操作；所述标签插值器用于计算选项卡的位移量；所述默认标签布局类用于对所述标签回收者视图控件进行封装，基于所述滑动操作或点击操作进行显示。
在一个可能的示例中，所述默认标签布局类包括继承自RecyclerView.Adapter的适配器和继承自RecyclerView.ViewHolder的视图承载器。
第二方面，本申请实施例提供一种页面显示装置，包括用于执行第一方面中任一项所述的方法的单元。
第三方面，本申请实施例提供另一种页面显示装置，包括处理器、存储器、通信接口以及一个或至少一个程序，其中，上述一个或至少一个程序被存储在上述存储器中，并且被配置由上述处理器执行，所述程序包括用于如第一方面中所描述的部分或全部步骤的指令。
第四方面，本申请实施例提供了一种计算机可读存储介质，其中，所述计算机可读存储介质存储计算机程序，其中，所述计算机程序使得计算机执行以实现如第一方面中所描述的部分或全部步骤。
实施本申请实施例，将具有如下有益效果：
采用了上述的页面显示方法、装置及介质之后，目标页面基于目标回收者视图组件，若在目标页面的内容组件上检测到滑动操作，则目标指示器和内容组件的内容可跟随滑动操作滑动显示。在内容组件上检测到滑动操作结束，且滑动操作满足切换条件时，控制目标指示器显示于目标选项卡组件中与滑动操作对应的目标选项卡的对应位置上，以及控制内容组件显示目标选项卡的内容。如此，在用户手指滑动目标页面的过程中，相当于目标页面的子页面的内容(内容组件中显示的内容)和指示该内容的目标指示器跟随用户的滑动操作进行滑动显示，且在滑动操作结束之后显示于对应的位置，提高了滑动显示的页面流畅效果。
附图说明
为了更清楚地说明本申请实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，其中：
图1为本申请实施例提供的一种页面显示的示意图；
图2为本申请实施例提供的另一种页面显示的示意图；
图3为本申请实施例提供的另一种页面显示的示意图；
图4为本申请实施例提供的一种目标回收者视图组件的结构示意图；
图5为本申请实施例提供的一种页面显示方法的流程示意图；
图6为本申请实施例提供的另一种页面显示方法的流程示意图；
图7为本申请实施例提供的另一种页面显示方法的流程示意图；
图8为本申请实施例提供的一种页面显示装置的逻辑结构示意图；
图9为本申请实施例提供的一种页面显示装置的实体结构示意图。
具体实施方式
下面结合本申请实施例中的附图对本申请的实施例进行描述。
本申请实施例所涉及的网络架构包括客户端和与客户端连接的服务器。本申请实施例对于服务器和客户端的数量不做限定。其中，客户端可以包括个人计算机(personalcomputer，PC)、笔记本电脑、手机、一体机、掌上电脑、平板电脑(pad)、智能电视播放终端、车载终端或便捷式设备等电子设备，在此不做限定。
客户端可以包括显示设备、处理器以及存储器。其中，存储器可用于存储软件程序以及数据，处理器可以通过运行存储在存储器的软件程序以及数据，从而执行客户端的各种功能应用以及数据处理。
显示设备包括显示器驱动电路、显示屏和触控屏。其中，显示器驱动电路用于控制所述显示屏根据画面的显示数据和显示参数(例如，亮度，颜色，饱和度等)进行内容显示。显示屏可以包括液晶显示屏，有机发光二极管显示屏，电子墨水显示屏，等离子显示屏，使用其它显示技术的显示屏中一种或者几种的组合。触控屏用于检测触控操作。该触控屏可以是由透明的触摸传感器电极(例如氧化铟锡(ITO)电极)阵列形成的电容式触摸传感器，或者可以是使用其它触摸技术形成的触摸传感器，例如音波触控，压敏触摸，电阻触摸，光学触摸等，本申请实施例不作限制。
服务器具体用于为客户端提供业务服务。该业务服务可以是订单业务，该订单业务可以包括股票、基金、期货、债券、衍生品等标的物的交易类型。该业务服务还可以是与订单业务相关的查询业务、浏览业务、客服业务、分享业务等，本申请对于服务器提供的业务服务和订单业务对应的交易类型均不做限定。客户端中与服务器对应的应用程序的载体可以是集成的应用软件，或者小程序，或者功能模块，或者网页等类型，在此不做限定。
在本申请实施例中，目标页面包括至少一个选项卡组件和内容组件。如图1、图2和图3所示，目标页面包括选项卡组件101、选项卡组件105、选项卡组件106和内容组件102。其中，选项卡组件101、选项卡组件105、选项卡组件106中每一选项卡组件可包括至少两个选项卡以及指示器。该指示器用于指示选项卡组件中与当前页面对应的选项卡。
选项卡组件106中指示器所指示的选项卡，用于指示目标页面的一级标签，可以理解为目标页面的类型。选项卡组件105中指示器所指示的选项卡，用于指示目标页面的二级标签，可以理解为目标页面的分类。选项卡组件101中指示器所指示的选项卡用于指示目标页面的三级标签，该三级标签可以理解为内容组件中显示的内容的标签，或目标页面中待显示的子页面的标签，因此，该三级标签也可以理解为目标页面的底层标签。
在本申请实施例中，可以将包括目标页面的底层标签的选项卡组件称为目标选项卡组件，可以将目标选项卡组件中的指示器称为目标指示器。该目标指示器显示于目标页面的目标选项卡组件中，且用于指示与内容组件中显示的内容对应的选项卡。也就是说，内容组件跟随目标选项卡组件中的目标指示器对应的选项卡进行显示。
本申请实施例中目标选项卡组件中的目标指示器可支持的切换方式可由滑动操作或点击操作触发，而其它的指示器(例如，图1、图2和图3中选项卡组件105和选项卡组件106的指示器)可支持的切换方式由点击操作触发。当然，其它的指示器也可支持滑动操作触发的切换方式，但该滑动操作需预先定义滑动位置、滑动手势、滑动速度、滑动力度等信息，以区别目标指示器的滑动操作。例如，在选项卡组件105上检测的滑动操作，用于切换该选项卡组件105中的选项卡。又例如，滑动操作的滑动力度大于目标指示器对应的预设力度，或，滑动速度大于目标指示器对应的预设速度等，在此不做限定。可以理解，由于其他的选项卡组件也是目标页面的标签信息，当切换该选项卡组件中的选项卡时，内容组件上的内容也会随着滑动操作对应的选项卡进行切换。
在如图1、图2和图3中，该选项卡组件106包括“行情”、“交易”、“咨询”、“牛牛圈”、“我的”五个选项卡，且选项卡组件106中的指示器以高亮的方式进行指示，该指示器所指示的选项卡为“行情”，可确定目标页面的一级标签为行情，则目标页面为行情页面。选项卡组件105包括“自选”、“基金”和“市场”三个选项卡，且选项卡组件105中的指示器以不同颜色的方式进行突出指示，该指示器所指示的选项卡为“自选”，可确定目标页面的二级标签为自选，则目标页面具体为行情页面中的自选页面。
选项卡组件101为目标选项卡组件，包括“全部”、“港股”、“美股”、“沪深”、“基金”和“a股行情”六个选项卡，且目标选项卡组件101中的目标指示器103以滑动条的方式和/或不同颜色的方式进行指示。图1中的目标指示器103所指示的选项卡为“全部”，可确定目标页面的三级标签为全部，则目标页面具体为行情页面中自选页面下的全部信息，或者说内容组件102中显示的内容为“全部”选项卡对应的信息。图2中的目标指示器103所指示的选项卡为“港股”，则目标页面具体为行情页面中自选页面下港股的信息，或者说内容组件102中显示的内容为“港股”选项卡对应的信息。
本申请对于指示器的指示方式不做限定，选项卡组件105和选项卡106中的指示器可以如图1、图2和图3所示的，采用不同颜色或高亮的方式进行指示，还可包括放大字体等方式。在切换之前或切换之后，目标选项卡组件101中的目标指示器103如图1所示可以位于“全部”选项卡的位置之下，也可以以箭头或其他的形状的方式指示，或者采用不同颜色或高亮显示的方式指示内容组件对应的选项卡等。可选的，目标指示器的显示长度和目标选项卡对应的显示长度相等。可以理解，目标选项卡对应的显示长度可以为固定的，也可以根据目标选项卡对应的标签进行变化。当目标指示器的显示长度和目标选项卡对应的显示长度相等时，可以理解为指示器对应的滑动条与目标选项卡对应的方框的宽度相等。在目标选项卡对应的显示长度根据目标选项卡对应的标签进行变化，可提高选项卡的多样性。
本申请实施例对于切换选项卡，或者说切换内容组件的内容的方法不做限定，可以由用户在选项卡组件中对指定选项卡的点击操作，以使切换至指定选项卡；也可以由用户在内容组件上向左或向右执行滑动操作，以使切换至左侧或右侧的选项卡等。其中，指定选项卡为点击操作对应的选项卡。
在切换选项卡，或者说切换内容组件的内容时，目标指示器可以指示切换前后的选项卡，或切换前后的选项卡之间的中间选项卡。若切换操作是用户在内容组件上执行的滑动操作，则目标指示器可以指示源选项卡和目标选项卡，或者源选项卡和目标选项卡之间的中间选项卡。其中，源选项卡为滑动操作之前的内容组件的内容对应的选项卡，目标选项卡为滑动操作之后的内容组件的内容对应的选项卡。若图1为滑动操作之前的目标页面，则源选项卡为“全部”选项卡。若图2为滑动操作之后的目标页面，则目标选项卡为“港股”选项卡。
若切换操作是用户在选项卡组件中针对指定选项卡的点击操作，则待切换的选项卡可以包括源选项卡和指定选项卡，或者源选项卡和指定选项卡之间的中间选项卡。其中，源选项卡为点击操作之前的内容组件的内容对应的选项卡，指定选项卡为点击操作对应的选项卡，也就是点击操作之后的内容组件的内容对应的选项卡。若图1为点击操作之前的目标页面，则源选项卡为“全部”选项卡。若图2为点击操作之后的指定页面，则指定选项卡为“港股”选项卡。
中间选项卡为选项卡组件中位于源选项卡和目标选项卡(或指定选项卡)之间的选项卡。需要说明的是，中间选项卡可以存在，也可以不存在。当滑动操作限定为滑动一个选项卡时，中间选项卡不存在。当滑动操作不限定滑动的选项卡的数量时，中间选项卡可以存在。当源选项卡和指定选项卡为不相邻的选项卡时，中间选项卡可以存在。当源选项卡和指定选项卡为相邻的选项卡时，中间选项卡不存在。
在本申请实施例中，点击操作是指用户在客户端上单击触控屏的操作。若用户在触控屏上的点击位置为指定选项卡对应的显示位置时，则确定在指定选项卡上检测到点击操作。点击操作携带的参数可包括点击力度、点击时长和\或点击手势等。其中，点击力度用于描述用户执行点击操作时触碰显示设备的力度。点击时长用于描述用户执行点击操作时触碰显示设备的时间。点击手势用于描述用户执行点击操作时的点击动作。可以理解，当点击时长较短，或点击力度较小，或点击手势不是预设切换手势时，可表示误触，可取消切换操作。相反，表示切换操作非误触，可执行切换操作。
滑动操作是指用户在客户端上点击触控屏之后，不离开触控屏，而是在触控屏上滑动的操作。若用户在触控屏上的点击位置为内容组件，且点击之后在触控屏上进行滑动操作时，可确定在目标页面的内容组件上检测到滑动操作。若用户的手指离开触控屏时，可确定在内容组件上检测到滑动操作结束。
滑动操作携带的参数可包括滑动力度、滑动速度、滑动方向、滑动轨迹等。其中，滑动力度用于描述用户执行滑动操作时手指触碰显示设备的力度。滑动速度可包括滑动操作的加速度、平均速度或初速度等，用于描述用户执行滑动操作时的动作快慢。滑动轨迹用于描述用户执行滑动操作时手指在显示设备上的滑动手势，该滑动轨迹可以为一个方向的轨迹，也可以为回旋的轨迹等，在此不做限定。当滑动轨迹包括反向的轨迹时，可以理解为回旋的轨迹，或者说为撤回滑动操作。
滑动方向用于描述用户在显示设备上滑动操作的方向，可以理解为预切换的目标选项卡的方向。由于目标选项卡组件中的选项卡横向显示，该滑动方向可包括左方向或右方向。本申请对于左方向和右方向不做限定，当滑动轨迹的趋势靠近目标页面的左侧时，确定为左方向。当滑动轨迹的趋势靠近目标页面的右侧时，确定为右方向。当滑动方向为左方向时，目标选项卡的显示位置位于源选项卡的左侧。当滑动方向为右方向时，目标选项卡的显示位置位于源选项卡的右侧。默认情况下，目标选项卡和源选项卡为相邻的选项卡。当然，可通过设置不同的滑动操作的参数，去确定滑动操作对应的目标选项卡和源选项卡之间的关系。例如，根据滑动速度和/或滑动力度等参数确定目标选项卡和源选项卡之间是否存在中间选项卡，以及中间选项卡的数量，或者根据滑动速度和/或滑动力度等参数确定目标选项卡和源选项卡之间的距离，再根据距离和各个选项卡对应的显示长度确定目标选项卡。
滑动轨迹还可用于指示切换的选项卡信息。示例性的，预先设置不同的滑动轨迹，例如，直线或曲线表示向左或向右切换，折线表示间隔的中间选项卡的数量等，从而可根据滑动轨迹确定目标选项卡。点击操作和滑动操作还可携带用户的指纹信息，用于识别用户的身份信息，避免非法使用客户端。本申请对于点击操作和滑动操作携带的参数不做限定。
可以理解，当滑动力度较小、滑动距离较小、滑动速度较小、点击时长较短时，可能表示为误触，可取消切换操作。相反，表示切换操作非误触，可执行切换操作。
在本申请实施例中，目标选项卡组件101除了至少两个选项卡和目标指示器103之外，还可包括展开组件104，用于展示各个选项卡对应的数量，或者展示可添加至目标选项卡组件101的选项卡，或者目标选项卡组件101中选项卡的位置或形式的编辑选项等，在此不做限定。
本申请对于目标页面的类型不做限定，可以是如图1、图2和图3所示的行情页面，包括“全部”、“港股”、“美股”、“沪深”、“基金”和“a股行情”等多个选项卡。该目标页面还可以是分享页面，例如，牛牛圈，包括“关注”、“推荐”、“专栏”、“课堂”、“通知”、“更多”等多个选项卡，或者可以是资讯页面，例如，“要闻”、“快讯”、“自选”、“日历”、“专栏”、“新股”、“基金”、“推送”等多个选项卡。
目标页面中可以包括默认选项卡，该默认选项卡为进入目标页面时，指示器所指示的选项卡，可以理解为默认的内容组件的内容对应的选项卡。例如，当目标页面为行情页面时，默认选项卡为“全部”选项卡；当目标页面为资讯页面时，默认选项卡为“自选”选项卡；当目标页面为分享页面时，默认选项卡为“推荐”选项卡。该默认选项卡的设置可以是服务器对应的开发人员设置的，也可以是客户端对应的用户设置的，还可以根据用户访问的偏好修改得到的等，在此不做限定。
需要说明的是，选项卡组件对应的选项卡的数量可能不止目标页面100中显示的选项卡，例如，如图1、图2和图3中目标选项卡组件101除了显示的选项卡，还可包括“自选股票”、“自选基金”、“沪深港通”、“期货”、“外汇”、“环球”等选项卡。可以通过切换选项卡，或者说切换内容组件的内容之后，内容组件可展示如图1、图2和图3中未显示的选项卡的内容。
在本申请实施例中，目标指示器可以根据点击操作滑动至点击操作对应的指定选项卡对应的位置，内容组件可将源选项卡的内容切换为指定选项卡的内容。本申请对于点击操作时目标指示器的滑动显示方法不做限定，在一种可能的示例中，确定源选项卡的内容切换为指定选项卡的内容的切换时长，以及源选项卡和指定选项卡之间所有的中间选项卡对应的显示长度之和；根据切换时长和所有的中间选项卡的显示长度确定目标指示器的目标滑动速度；控制所述目标指示器基于目标滑动速度滑动显示。
其中，所有的中间选项卡对应的显示长度之和，可以理解为目标指示器的滑动距离，切换时长用于描述页面切换所需的时长，可以理解为指定页面刷新显示的时长。在该示例中，根据切换时长和所有的中间选项卡对应的显示长度之和确定目标滑动速度，可达到切换页面和指示选项卡同步的效果。且目标指示器从源选项卡滑动显示至指定选项卡，能够让用户在滑动操作时感受到页面的滑动效果，可提高用户体验。
本申请对于目标滑动速度不做限定，可以为平均速度，也可以为加速度等。可以理解，在滑动初期加速度较大，滑动结束时加速度较小时，可实现向“橡皮筋”一样的滑动效果，开始拉伸，最后回弹，相比于平滑的滑动显示效果，能够让用户在滑动操作时感受到页面的滑动效果，可进一步提高用户体验。
在本申请实施例中，目标指示器和内容组件可以跟随滑动操作滑动显示，从而在滑动操作时显示了流畅的滑动页面，提高了浏览效果。本申请对于滑动操作时滑动显示的方法不做限定，例如，目标指示器可以跟随滑动操作的滑动速度进行滑动显示，或者可以跟随滑动操作拉伸该目标指示器的长度，内容组件可以跟随滑动操作的滑动速度滑动待显示的内容等，在此不做限定。
在一种可能的示例中，根据滑动操作的滑动距离和目标页面的页面宽度确定目标页面的滑动比例；根据滑动操作的滑动速度和/或滑动比例确定目标指示器的显示参数；控制所述目标指示器基于所述显示参数滑动显示，控制所述内容组件的内容基于所述滑动比例滑动显示。
其中，目标页面的页面宽度可以理解为客户端的显示设备中显示屏的宽度。滑动比例可以理解为内容组件对应的显示内容的偏移值，或者可以理解为源选项卡在内容组件中不显示的内容和显示的内容之间的比值，或者为目标选项卡在内容组件中显示的内容和待显示的内容之间的比值。
本申请对于滑动比例的计算方法不做限定，可选的，计算滑动操作的滑动距离和目标页面的页面宽度之间的比值，得到滑动比例。可以理解，当滑动比例为滑动距离和页面宽度之间的比值时，内容组件中显示的内容可根据滑动比例进行滑动显示，提高了滑动显示的准确率。
显示参数可包括目标指示器显示的长度、宽度、速度、颜色、背景等，在此不做限定。在一种可能的示例中，显示参数包括滑动操作的滑动速度和伸缩长度。应理解，目标指示器的滑动速度和滑动操作的滑动速度一致，可实现目标指示器跟随滑动操作进行滑动显示的滑动效果。在本申请实施例中，目标指示器的显示长度跟随滑动长度进行伸缩，可将该目标指示器的显示长度称为伸缩长度。且伸缩长度可根据滑动速度和滑动比例进行确定，且该伸缩长度大于源选项卡对应的显示长度，且小于或等于源选项卡对应的显示长度和目标选项卡对应的显示长度之和。
当滑动速度较快，或滑动比例较大时，可以理解为滑动操作的初期，伸缩长度可变长。而当滑动速度较慢，或滑动比例较小时，可以理解为滑动操作的末期，伸缩长度可变短。也就是说，在检测到滑动操作时，目标指示器拉长显示，且拉长显示的长度根据当前的滑动速度和滑动比例进行计算得到。如此，可实现向“橡皮筋”一样的滑动效果，开始拉伸，最后回弹，相比于平滑的滑动显示效果，能够让用户在滑动操作时感受到页面的滑动效果，可进一步提高用户体验。
示例性的，若向右执行滑动操作的示意图，如图3所示，内容组件102中显示了源选项卡(即“全部”选项卡)的右部分内容，以及目标选项卡(即“港股”选项卡)的左部分内容。目标指示器103的伸缩长度大于“全部”选项卡对应的显示长度，且小于“全部”选项卡和“港股”选项卡两者之间的显示长度之和。可以理解，当停止滑动操作，且该滑动操作满足切换条件时，可认为是确认切换操作，目标指示器103的左侧向“橡皮筋”一样回弹，且回弹之后如图2所示位于“港股”选项卡之下。当停止滑动操作，且该滑动操作不满足切换条件时，可认为是取消切换操作或误触切换操作，目标指示器103的右侧在向“橡皮筋”一样回弹，且回弹之后如图1所示位于“全部”选项卡之下。当目标指示器向“橡皮筋”一样拉伸和回弹时，相较于平滑的滑动显示效果，能够让用户在滑动操作时感受到页面的滑动效果，可提高用户体验。
本申请实施例对于切换条件不做限定，当用户在内容组件上执行滑动操作时，可根据滑动操作的滑动距离、滑动速度和\或滑动力度等滑动操作的参数进行确定。当用户在指定选项卡上执行点击操作时，可根据点击操作的点击时长和\或点击力度等点击操作的参数进行确定。可以理解，当滑动力度或点击力度较小、滑动距离较小、滑动速度较小、点击时长较短时，可能表示为误触。相反，表示切换操作非误差。基于此，可根据上述的信息确定是否满足切换条件，可提高切换操作的准确率。
在一种可能的示例中，根据滑动操作(或点击操作)的参数计算切换概率；当切换概率大于第一预设阈值时，确定滑动操作(或点击操作)满足切换条件。
其中，切换概率用于评价滑动操作(或点击操作)用于指示切换页面的概率。可以理解，滑动力度、滑动速度、滑动方向、滑动轨迹、点击力度、点击时长和点击手势等参数的评价维度存在不同，因此可以分别根据滑动操作(或点击操作)的参数对应预设评价规则进行评价，然后进行加权得到切换概率。本申请对于预设评价规则和第一预设阈值均不作限定，预设评价规则还可参照用户的操作习惯进行设置，可提高评价的准确率。
在另一种可能的示例中，当滑动操作的滑动距离大于或等于预设距离时，确定滑动操作满足切换条件。
本申请对于预设距离不做限定，可以为目标页面的页面宽度的1/2，也就是说，当滑动操作的手指在显示设备上滑动的距离超过当前显示的页面宽度的1/2，内容组件的内容会切换为目标选项卡对应的信息，目标指示器会指示目标选项卡。否则，内容组件的内容会切换回源选项卡对应的信息，目标指示器也会指示回源选项卡。
可选的，根据滑动操作的滑动力度和滑动速度确定预设距离。滑动力度和滑动速度与滑动距离存在一定的关系，根据滑动力度和滑动速度计算预设距离，可提高预设距离设置的准确率，便于提高判断滑动操作满足切换条件的准确率。
进一步的，切换条件为目标选项卡的切换条件，例如，是否能切换至目标选项卡。在一种可能的示例中，若滑动操作对应的目标选项卡为预设选项卡，则确定电子设备的环境信息；根据环境信息确定用户的目标安全值；若目标安全值小于第二预设阈值，则获取滑动操作(或点击操作)对应的指纹图像；若指纹图像与预设指纹模板匹配成功，则确定所述滑动操作(或点击操作)满足所述目标选项卡的切换条件。
其中，电子设备的环境信息可包括电子设备的地理位置环境，例如，公共区域、家庭、山区等。电子设备的环境信息还可包括电子设备所接入的网络环境，例如，公共网络、公司网络、家庭网络等。本申请实施例对于电子设备的环境信息不做限定，对于确定电子设备的环境信息的方法不做限定，可以通过电子设备的定位模块确定地理位置环境，或者通过电子设备的网络模块确定网络环境等。
本申请对于环境信息确定用户的目标安全值的方法不做限定，可以基于用户所处的地理位置环境确定第一安全值，基于电子设备的网络环境确定第二安全值；再基于第一安全值和第二安全值确定用户的目标安全值等。
本申请对于预设选项卡不做限定，可以是用户预先指定的选项卡。预设选项卡可以包含用户的隐私信息对应的选项卡，或者用户单独增加的选项卡等。
可以理解，不同的地理位置环境所处的用户可能人身安全的风险，不同的网络环境存在资金盗用的风险。因此，在该示例中，若滑动操作对应的目标选项卡为预设选项卡，则根据电子设备的环境信息确定用户的目标安全值，再根据该目标安全值确定是否满足切换条件，从而可提高切换操作的准确率，便于提高用户信息的安全性。
本申请对于第二预设阈值不做限定，可以由用户进行预先指定，或者通过用户的风险评价值进行计算得到等。其中，用户的风险评价值可以根据用户的资金信息，以及用户购买的安全保险等进行确定等，在此不做限定。
本申请对于预设指纹模板不做限定，可以通过电子设备中登录的应用账号确定用户在电子设备或服务器中存储的指纹模板。可以理解，若电子设备的环境信息所确定的目标安全值小于第二预设阈值，则表示切换页面的操作可能存在安全隐患，可将滑动操作(或点击操作)对应的指纹图像与预设指纹模板进行匹配。并在匹配成功时，确定满足切换条件，可避免切换至用户的隐私页面，提高了用户信息的安全性。
本申请对于指纹图像和预设指纹模板的匹配方法不做限定，在一种可能的示例中，对所述指纹图像进行划分，得到至少两个子指纹图像；根据至少两个所述子指纹图像确定所述指纹图像的采集角度；根据所述采集角度获取预设指纹模板；获取各个所述子指纹图像的图像质量；根据所述子指纹图像的图像质量，从所述子指纹图像中选取至少两个目标子指纹图像；获取各个所述目标子指纹图像和所述预设指纹模板之间的子匹配值；根据所述子匹配值获取目标匹配值；若所述目标匹配值大于或等于第三预设阈值，则确定所述指纹图像与所述预设指纹模板匹配成功。
本申请对于指纹图像划分的方法不做限定，可以基于区域进行划分，例如，将指纹图像划分为上下左右四个图像；或者可以基于指纹的纹路进行划分，由于指纹的纹路是大小不同的包围或半包围的曲线，从而得到的至少两个子指纹图像中的一个子指纹图像中可能包含另一个子指纹图像等。
本申请对于至少两个子指纹图像获取指纹图像的采集角度的方法不做限定，可以根据各个子指纹图像对应的采集角度进行确定，例如，选取子指纹图像对应的采集角度中的平均值，或子指纹图像对应的采集角度的角度范围等。或者可以先各个子指纹图像中的关键点或关键线段，再根据关键点或关键线段对应的连接线进行确定等。
本申请对于获取子指纹图像的图像质量的方法不做限定，可以获取指纹图像的清晰度，以及连续性进行加权计算等。
本申请对于选取目标子指纹图像的方法不做限定，可以选取图像质量较大的子指纹图像作为目标子指纹图像，或者可以将图像质量大于一个指定的阈值的子指纹图像均作为目标子指纹图像等。此处指定的阈值可以是固定的数值，也可以根据各个子指纹图像的图像质量以及子指纹图像的数量进行确定等，在此不做限定。
本申请对于获取目标匹配值的方法不做限定，可以选取子匹配值中的最大值、平均值或最小值，或者获取各个子匹配值的加权平均值等。其中加权所使用的权值可以根据各个子匹配值的区域大小以及区域重要性等进行确定，在此不做限定。
本申请实施例对于第三预设阈值也不做限定，可以是预设指纹模板对应的固定数值，或者可以是根据目标安全值设置的数值，或者可以是根据目标子指纹图像和子指纹图像之间的比值所设置的数值等。
可以理解，在该示例中，先对指纹图像进行划分得到多于1个的子指纹图像，再根据子指纹图像确定的指纹图像的采集角度获取预设指纹模板，如此，选取了采集角度对应的预设指纹模板，便于提高匹配的成功率。此外，还根据子指纹图像的图像质量选取目标子指纹图像。然后将目标子指纹图像与预设指纹模板进行匹配，得到多于1个的匹配值，从而根据匹配值获取目标匹配值。并在目标匹配值大于第三预设阈值时，确定指纹图像与预设指纹模板匹配成功。如此，进一步提高了匹配的成功率。
在本申请实施例中，目标页面基于目标回收者视图组件。目标回收者视图组件继承自RecyclerView框架。RecyclerView是一个滑动组件，通常采用网格布局来实现项目(item)的布局效果，每一行包括多列项目的视图(view)，通过在项目的视图上显示焦点让用户知道当前所操作的对象，并根据用户的滑动操作加载显示区域之外的项目。RecyclerView的优点主要包括以下三项，其中：
1、RecyclerView可实现懒加载。该懒加载可通过DiffUtil.Callback类对处理前目标选项卡组件中的选项卡和处理后的目标选项卡组件中的选项卡进行差别计算，以得到DiffResult差别结果集，其中，DiffUtil.Callback类具体用于限定处理前后的选项卡的比对规则。
可以理解为，开发者可根据实际情况加载选项，而不需要一开始就定义所有的加载项，开发者可以在开始时定义最多的加载项，之后按需加载。只会占用少量内存，对堆栈内存较为友好。
2、RecyclerView具有回收和复用机制。对于显示设备中不可见的选项卡，会回收这部分选项卡的内存，从而减少内存占用，不会出现越滑越卡的情况。此外，还可将回收的内存分配给显示设备中新显示的选项卡，提高了内存的复用率。
3、RecyclerView可实现定制化。RecyclerView有一套成熟的应用程序接口(Application Programming Interface，API)来帮助开发者定义每个选项卡的样式，例如，选项卡的长度、字体、背景，指示器的显示位置、长度、宽度、形状、滑动速度、颜色等，从而可提高定制效果。
RecyclerView相关类可参照下表，通过创建与相关类对应的装置项，可实现相关应用。例如，创建一个适配器(Adapter)，继承自RecyclerView.Adapetr类，主要用来将数据和布局item进行绑定，用于存储RecyclerView对应的数据，并根据该数据显示视图。创建一个视图承载器(ViewHolder)，继承自RecyclerView.ViewHolder，用于加载视图，可以与适配器一起对目标页面中不可见的选项卡的内存进行回收，并将该内存分配给新出现的选项卡进行复用。
Figure BDA0002950088100000121
Figure BDA0002950088100000131
请参照图4，图4为本申请实施例提供的一种目标回收者视图组件的框架结构图。其中，目标回收者视图组件包括标签回收者视图控件(例如，FtTabRecyclerView)、与标签回收者视图控件关联的页面容器(例如，ViewPager)、标签插值器(例如，FtTabInterpolator)和默认标签布局类(DefTabLayout)。
其中，页面容器用于承载用户的滑动操作以及点击操作。标签回收者视图控件为关键类，它是目标选项卡组件的视图，继承自RecyclerView框架，所以它具备了懒加载、回收及复用内存机制和可定制化的优点。标签回收者视图控件通过监听页面容器的滑动操作或点击操作，对目标指示器和内容组件的内容进行绘制，从而实现滑动的效果。
标签插值器用于计算选项卡的位移量，或者说是目标指示器的位移量或内容组件的位移量。本申请对于标签插值器的类型不做限定，可以是加速度插值器或减速度插值器或匀速插值器等。基于标签插值器的类型，目标指示器的滑动显示可以加速度滑动显示，或减速度滑动显示，或匀速滑动显示等，在此也不做限定。
默认标签布局类用于对标签回收者视图控件进行封装，从而基于滑动操作或点击操作进行显示，以使业务可以不用感知低层的目标回收者视图类的方法默认实现，达到业务和基础控件解耦的代码效果。默认标签布局类包括继承自RecyclerView.Adapter的适配器和继承自RecyclerView.ViewHolder的视图承载器。视图承载器用于加载视图，是懒加载和回收复用机制关键的一环。适配器会在合适的时机，加载显示视图承载器或回收未显示的选项卡所占用的内存，从而提高性能。
基于此，请参照图5和图6，分别为滑动操作和点击操作对应的方法示意图。在图5中，当用户在内容组件上的滑动操作时，调用页面容器的页面滑动方法，实现内容组件的内容跟随滑动操作进行滑动显示。标签回收者视图控件通过监听页面容器的页面滑动方法被调用，从标签插值器中获取目标指示器的显示参数，然后基于显示参数调用进行滑动显示，从而实现滑动效果。
在图6中，当适配器检测到用户在目标选项卡组件上针对指定选项卡的点击操作时，调用页面容器的选择指定页面方法，实现内容组件的内容切换为指定选项卡的内容。同时标签回收者视图控件监听到页面容器的选择指定页面方法被调用，通过监听页面容器的页面滑动方法被调用，从标签插值器中获取目标指示器的显示参数，然后基于显示参数调用进行滑动显示，从而实现滑动效果。
在一种可能的示例中，目标选项卡组件对应多个第一选项卡，第一选项卡包括源选项卡和目标选项卡，当接收到针对目标页面的选项卡定制请求时，根据多个第一选项卡和选项卡定制请求对应的多个第二选项卡确定至少一个差别选项卡；根据至少一个差别选项卡对目标选项卡组件进行局部更新，以使目标选项卡组件包括多个第二选项卡。
其中，第一选项卡可以为目标页面中显示的选项卡，也可包括未显示的选项卡。选项卡定制请求用于更新目标选项卡组件中的选项卡，可包括增加、删除以及修改的操作。第二选项卡为给予选项卡定制请求之后，目标选项卡组件对应的所有的选项卡。差别选项卡为第一选项卡和第二选项卡之间不同的选项卡。可以理解，当目标选项卡组件基于继承自RecyclerView的目标回收者视图类时，可实现差别选项卡的局部更新，便于开发人员或用户实现定制化的选项卡编辑操作。
在一种可能的示例中，目标选项卡组件对应多个第一选项卡，第一选项卡包括源选项卡和目标选项卡，若目标显示长度大于目标页面的页面宽度，则根据多个第一选项卡的显示顺序从多个第一选项卡中选取与目标选项卡的显示顺序接近的多个第三选项卡，以使目标选项卡对应的显示长度和多个第三选项卡对应的显示长度之和小于或等于页面宽度；目标选项卡组件上显示多个第三选项卡。
其中，目标显示长度为多个第一选项卡中每一第一选项卡对应的显示长度之和。显示顺序用于描述各个第一选项卡在目标页面中显示的位置，根据显示顺序可确定该第一选项卡在目标页面中左侧以及右侧的选项卡。当目标显示长度大于目标页面的页面宽度时，表示当前页面无法显示全部的第一选项卡，因此，在切换为目标选项卡时，还根据第一选项卡的显示顺序，选取与目标选项卡临近的第三选项卡，且所有的第三选项卡对应的显示长度和目标选项卡对应的显示长度之和小于或等于页面宽度，从而可实现合理的选项卡显示。
本申请对于选取第三选项卡的方法不做限定，当定义目标选项卡的显示顺序为左侧第一个时，从多个第一选项卡中选取显示顺序在目标选项卡之后的第一选项卡作为第三选项卡。当定义目标选项卡的显示顺序位于目标页面的中间时，从多个第一选项卡中依次按照目标选项卡的显示顺序，向前或向后分别选取第三选项卡，直至不能再添加新的第三选项卡时结束选取步骤，也就是说，当前的第三选项卡对应的显示长度和目标选项卡对应的显示长度，最接近页面宽度。
具体的，请参照图7，图7是本申请提供的一种页面显示方法的流程示意图，该方法包括如下步骤S701～S702，其中：
S701：若在目标页面的内容组件上检测到滑动操作，则控制目标指示器和内容组件的内容跟随滑动操作滑动显示。
在本申请实施例中，目标指示器显示于目标页面的目标选项卡组件中，用于指示与内容组件中显示的内容对应的选项卡，目标页面基于目标回收者视图组件。其中，目标页面、内容组件、目标指示器、目标选项卡组件、内容组件和目标回收者视图组件，以及滑动操作和目标指示器和内容组件的内容跟随滑动操作的滑动显示方法可参照前述，在此不再赘述。可以理解，当目标页面基于继承自RecyclerView框架，可继承RecyclerView中懒加载、回收复用机制和定制化的优点。也就是说，可定制化实现贴合滑动效果的滑动显示方式。
S702：在内容组件上检测到滑动操作结束，且滑动操作满足切换条件时，确定目标选项卡组件中滑动操作对应的目标选项卡，控制目标指示器显示于目标选项卡组件中与滑动操作对应的目标选项卡的对应位置上，控制内容组件中显示目标选项卡的内容。
其中，切换条件、滑动操作结束时目标指示器以及内容组件的显示方法可参照前述，在此不再赘述。本申请实施例对于确定目标选项卡的方法不做限定，可根据滑动操作的参数进行确定，例如，前面所述的根据滑动方向确定目标选项卡的显示位置相对于源选项卡的位置。再根据滑动速度或滑动力度等参数确定目标选项卡和源选项卡之间是否存在中间选项卡，以及中间选项卡的数量，或者根据滑动速度或滑动力度等参数确定目标选项卡和源选项卡之间的距离，再根据距离和各个选项卡对应的显示长度确定目标选项卡等。
在图7所示的方法中，目标页面基于目标回收者视图组件，若在目标页面的内容组件上检测到滑动操作，则目标指示器和内容组件的内容可跟随滑动操作滑动显示。在内容组件上检测到滑动操作结束，且滑动操作满足切换条件时，控制目标指示器显示于目标选项卡组件中与滑动操作对应的目标选项卡的对应位置上，以及控制内容组件显示目标选项卡的内容。如此，在用户手指滑动目标页面的过程中，相当于目标页面的子页面的内容(内容组件中显示的内容)和指示该内容的目标指示器跟随用户的滑动操作进行滑动显示，且在滑动操作结束之后显示于对应的位置，提高了滑动显示的页面流畅效果。
在一种可能的示例中，所述方法还包括：若在所述目标选项卡组件的指定选项卡上检测到点击操作，则控制所述目标指示器滑动显示至所述指定选项卡对应的位置，控制所述内容组件中显示所述指定选项卡的内容。
其中，点击操作以及点击操作对应的显示方法可参照前述，在此不再赘述。可以理解，在用户点击指定选项卡之后，目标指示器跟随该用户点击指定选项卡的点击操作滑动显示至指定选项卡，内容组件将内容切换至指定选项卡的内容，提高了页面切换时的页面显示的流畅效果。
上述详细阐述了本申请实施例的方法，下面提供了本申请实施例的装置。
请参照图8，图8是本申请提出的一种页面显示装置的结构示意图，如图8所示，上述页面显示装置800包括：
存储单元804用于存储切换条件；
检测单元801用于在目标页面的内容组件上检测滑动操作；以及在所述内容组件上检测到所述滑动操作结束；
显示单元802用于控制目标指示器和所述内容组件的内容跟随所述滑动操作滑动显示，所述目标指示器显示于所述目标页面的目标选项卡组件中，用于指示与所述内容组件中显示的内容对应的选项卡，所述目标页面基于目标回收者视图组件；在所述检测单元801检测到所述滑动操作结束，且所述滑动操作满足所述切换条件时，控制所述目标指示器显示于所述目标选项卡组件中与所述滑动操作对应的目标选项卡的对应位置上，控制所述内容组件中显示所述目标选项卡的内容。
在一个可能的示例中，显示单元802具体用于根据所述滑动操作的滑动距离和所述目标页面的页面宽度确定所述目标页面的滑动比例；根据所述滑动操作的滑动速度和/或所述滑动比例确定目标指示器的显示参数；控制所述目标指示器基于所述显示参数滑动显示，控制所述内容组件的内容基于所述滑动比例滑动显示。
在一个可能的示例中，所述显示参数包括所述滑动速度和伸缩长度，所述伸缩长度大于源选项卡对应的显示长度，且小于或等于所述源选项卡对应的显示长度和所述目标选项卡对应的显示长度之和，所述源选项卡为所述滑动操作之前所述内容组件的内容对应的选项卡。
在一个可能的示例中，检测单元801还用于在所述目标选项卡组件的指定选项卡上检测点击操作；显示单元802还用于控制所述目标指示器滑动显示至所述指定选项卡对应的位置，控制所述内容组件中显示所述指定选项卡的内容。
在一个可能的示例中，所述目标选项卡组件对应多个第一选项卡，所述多个第一选项卡包括所述目标选项卡，所述页面显示装置还包括通信单元805，用于接收针对所述目标页面的选项卡定制请求，所述选项卡定制请求对应多个第二选项卡；显示单元802还用于根据所述多个第一选项卡和所述多个第二选项卡确定至少一个差别选项卡；根据所述至少一个差别选项卡对所述目标选项卡组件进行局部更新，以使所述目标选项卡组件对应所述多个第二选项卡。
在一个可能的示例中，所述目标选项卡组件包括多个第一选项卡，所述多个第一选项卡包括所述目标选项卡，显示单元802还用于计算所述多个第一选项卡对应的显示长度之和，得到目标显示长度；若所述目标显示长度大于所述目标页面的页面宽度，则根据所述多个第一选项卡的显示顺序从所述多个第一选项卡中选取与所述目标选项卡的显示顺序接近的多个第三选项卡，以使所述目标选项卡对应的显示长度和所述多个第三选项卡对应的显示长度之和小于或等于所述页面宽度；控制所述目标选项卡组件上显示所述多个第三选项卡。
在一个可能的示例中，页面显示装置800还包括处理单元803，用于当所述滑动操作的滑动距离大于或等于预设距离时，确定所述滑动操作满足切换条件。
该页面显示装置800中各个单元执行详细过程可以参见前述方法实施例中的执行步骤，此处不在赘述。
请参照图9，图9是本申请实施例提供的另一种页面显示装置的结构示意图。如图9所示，该页面显示装置900包括处理器910、存储器920、通信接口930以及一个或至少一个程序940。图8所示的通信单元805、检测单元801和显示单元803所实现的相关功能可通过通信接口930来实现，图8所示的存储单元804所实现的相关功能可通过存储器920来实现，图8所示的处理单元802所实现的相关功能可通过处理器910来实现。
上述一个或至少一个程序940被存储在上述存储器920中，并且被配置由上述处理器910执行，上述程序940包括用于执行以下步骤的指令：
若在目标页面的内容组件上检测到滑动操作，则控制目标指示器和所述内容组件的内容跟随所述滑动操作滑动显示，所述目标指示器显示于所述目标页面的目标选项卡组件中，用于指示与所述内容组件中显示的内容对应的选项卡，所述目标页面基于目标回收者视图组件；
在所述内容组件上检测到所述滑动操作结束，且所述滑动操作满足切换条件时，控制所述目标指示器显示于所述目标选项卡组件中与所述滑动操作对应的目标选项卡的对应位置上，控制所述内容组件中显示所述目标选项卡的内容。
在一个可能的示例中，在所述控制目标指示器和所述内容组件的内容跟随所述滑动操作滑动显示方面，所述程序940具体用于执行以下步骤的指令：
根据所述滑动操作的滑动距离和所述目标页面的页面宽度确定所述目标页面的滑动比例；
根据所述滑动操作的滑动速度和/或所述滑动比例确定目标指示器的显示参数；
控制所述目标指示器基于所述显示参数滑动显示，控制所述内容组件的内容基于所述滑动比例滑动显示。
在一个可能的示例中，所述显示参数包括所述滑动速度和伸缩长度，所述伸缩长度大于源选项卡对应的显示长度，且小于或等于所述源选项卡对应的显示长度和所述目标选项卡对应的显示长度之和，所述源选项卡为所述滑动操作之前所述内容组件的内容对应的选项卡。
在一个可能的示例中，所述程序940还用于执行以下步骤的指令：
若在所述目标选项卡组件的指定选项卡上检测到点击操作，则控制所述目标指示器滑动显示至所述指定选项卡对应的位置，控制所述内容组件中显示所述指定选项卡的内容。
在一个可能的示例中，所述目标选项卡组件对应多个第一选项卡，所述多个第一选项卡包括所述目标选项卡，所述程序940还用于执行以下步骤的指令：
接收针对所述目标页面的选项卡定制请求，所述选项卡定制请求对应多个第二选项卡；
根据所述多个第一选项卡和所述多个第二选项卡确定至少一个差别选项卡；
根据所述至少一个差别选项卡对所述目标选项卡组件进行局部更新，以使所述目标选项卡组件对应所述多个第二选项卡。
在一个可能的示例中，所述目标选项卡组件对应多个第一选项卡，所述多个第一选项卡包括所述目标选项卡，所述程序940还用于执行以下步骤的指令：
计算所述多个第一选项卡对应的显示长度之和，得到目标显示长度；
若所述目标显示长度大于所述目标页面的页面宽度，则根据所述多个第一选项卡的显示顺序从所述多个第一选项卡中选取与所述目标选项卡的显示顺序接近的多个第三选项卡，以使所述目标选项卡对应的显示长度和所述多个第三选项卡对应的显示长度之和小于或等于所述页面宽度；
控制所述目标选项卡组件上显示所述多个第三选项卡。
在一个可能的示例中，所述程序940还用于执行以下步骤的指令：
当所述滑动操作的滑动距离大于或等于预设距离时，确定所述滑动操作满足切换条件。
本申请实施例还提供一种计算机存储介质，其中，该计算机存储介质存储用于存储计算机程序，该计算机程序使得计算机执行以实现方法实施例中记载的任一方法的部分或全部步骤，计算机包括电子设备和服务器。
本申请实施例还提供一种计算机程序产品，计算机程序产品包括存储了计算机程序的非瞬时性计算机可读存储介质，计算机程序可操作来使计算机执行以实现方法实施例中记载的任一方法的部分或全部步骤。该计算机程序产品可以为一个软件安装包，计算机包括电子设备和服务器。
需要说明的是，对于前述的各方法实施例，为了简单描述，故将其都表述为一系列的动作组合，但是本领域技术人员应该知悉，本申请并不受所描述的动作顺序的限制，因为依据本申请，某些步骤可以采用其他顺序或者同时进行。其次，本领域技术人员也应该知悉，说明书中所描述的实施例均属于优选实施例，所涉及的动作和模式并不一定是本申请所必须的。
在上述实施例中，对各个实施例的描述都各有侧重，某个实施例中没有详述的部分，可以参见其他实施例的相关描述。
在本申请所提供的几个实施例中，应该理解到，所揭露的装置，可通过其它的方式实现。例如，以上所描述的装置实施例仅仅是示意性的，例如单元的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，例如至少一个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另一点，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口，装置或单元的间接耦合或通信连接，可以是电性或其它的形式。
作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到至少一个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。
另外，在本申请各个实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现，也可以采用软件程序模式的形式实现。
集成的单元如果以软件程序模式的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读取存储器中。根据这样的理解，本申请的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储器中，包括若干指令用以使得一台计算机设备(可为个人计算机、服务器或者网络设备等)执行本申请各个实施例方法的全部或部分步骤。而前述的存储器包括：U盘、只读存储器(read-only memory，ROM)、随机存取存储器(randomaccess memory，RAM)、移动硬盘、磁碟或者光盘等各种可以存储程序代码的介质。
以上对本申请实施例进行了详细介绍，本文中应用了具体个例对本申请的原理及实施方式进行了阐述，以上实施例的说明只是用于帮助理解本申请的方法及其核心思想；同时，对于本领域的一般技术人员，依据本申请的思想，在具体实施方式及应用范围上均会有改变之处，综上，本说明书内容不应理解为对本申请的限制。

Claims (9)

1.一种页面显示方法，其特征在于，包括：
若在目标页面的内容组件上检测到滑动操作，则控制目标指示器和所述内容组件的内容跟随所述滑动操作滑动显示，所述目标指示器显示于所述目标页面的目标选项卡组件中，用于指示与所述内容组件中显示的内容对应的选项卡，所述目标页面基于目标回收者视图组件；
在所述内容组件上检测到所述滑动操作结束，且所述滑动操作满足切换条件时，控制所述目标指示器显示于所述目标选项卡组件中与所述滑动操作对应的目标选项卡的对应位置上，控制所述内容组件中显示所述目标选项卡的内容；
所述目标选项卡组件包括多个第一选项卡，所述多个第一选项卡包括所述目标选项卡，所述方法还包括：
计算所述多个第一选项卡对应的显示长度之和，得到目标显示长度；
若所述目标显示长度大于所述目标页面的页面宽度，则根据所述多个第一选项卡的显示顺序从所述多个第一选项卡中选取与所述目标选项卡的显示顺序接近的多个第三选项卡，以使所述目标选项卡对应的显示长度和所述多个第三选项卡对应的显示长度之和小于或等于所述页面宽度；
控制所述目标选项卡组件上显示所述多个第三选项卡。
2.根据权利要求1所述的页面显示方法，其特征在于，所述控制目标指示器和所述内容组件的内容跟随所述滑动操作滑动显示，包括：
根据所述滑动操作的滑动距离和所述目标页面的页面宽度确定所述目标页面的滑动比例；
根据所述滑动操作的滑动速度和/或所述滑动比例确定目标指示器的显示参数；
控制所述目标指示器基于所述显示参数滑动显示，控制所述内容组件的内容基于所述滑动比例滑动显示。
3.根据权利要求2所述的页面显示方法，其特征在于，所述显示参数包括所述滑动速度和伸缩长度，所述伸缩长度大于源选项卡对应的显示长度，且小于或等于所述源选项卡对应的显示长度和所述目标选项卡对应的显示长度之和，所述源选项卡为所述滑动操作之前所述内容组件的内容对应的选项卡。
4.根据权利要求1-3中任一项所述的页面显示方法，其特征在于，所述方法还包括：
若在所述目标选项卡组件的指定选项卡上检测到点击操作，则控制所述目标指示器滑动显示至所述指定选项卡对应的位置，控制所述内容组件中显示所述指定选项卡的内容。
5.根据权利要求1-3中任一项所述的页面显示方法，其特征在于，所述目标选项卡组件对应多个第一选项卡，所述多个第一选项卡包括所述目标选项卡，所述方法还包括：
接收针对所述目标页面的选项卡定制请求，所述选项卡定制请求对应多个第二选项卡；
根据所述多个第一选项卡和所述多个第二选项卡确定至少一个差别选项卡；
根据所述至少一个差别选项卡对所述目标选项卡组件进行局部更新，以使所述目标选项卡组件对应所述多个第二选项卡。
6.根据权利要求1-3中任一项所述的页面显示方法，其特征在于，所述方法还包括：
当所述滑动操作的滑动距离大于或等于预设距离时，确定所述滑动操作满足切换条件。
7.一种页面显示装置，其特征在于，所述页面显示装置包括用于执行如权利要求1-6中任一项所述的方法的单元。
8.一种页面显示装置，其特征在于，包括处理器、存储器、通信接口以及一个或至少一个程序，其中，所述一个或至少一个程序被存储在所述存储器中，并且被配置由所述处理器执行，所述程序包括用于执行权利要求1-6任一项方法中的步骤的指令。
9.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质存储计算机程序，所述计算机程序使得计算机执行以实现权利要求1-6任一项所述的方法。
CN202110213145.XA 2021-02-24 2021-02-24 页面显示方法、装置及介质 Active CN112905075B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202110213145.XA CN112905075B (zh) 2021-02-24 2021-02-24 页面显示方法、装置及介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202110213145.XA CN112905075B (zh) 2021-02-24 2021-02-24 页面显示方法、装置及介质

Publications (2)

Publication Number Publication Date
CN112905075A CN112905075A (zh) 2021-06-04
CN112905075B true CN112905075B (zh) 2022-06-07

Family

ID=76107193

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202110213145.XA Active CN112905075B (zh) 2021-02-24 2021-02-24 页面显示方法、装置及介质

Country Status (1)

Country Link
CN (1) CN112905075B (zh)

Families Citing this family (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN114138143A (zh) * 2021-11-23 2022-03-04 北京三快在线科技有限公司 查询界面的显示方法、装置、终端及存储介质

Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102707887A (zh) * 2012-05-11 2012-10-03 广东欧珀移动通信有限公司 基于安卓平台的listView中列表项的滑选方法
CN109407937A (zh) * 2018-09-29 2019-03-01 Oppo（重庆）智能科技有限公司 显示控制方法及相关产品
CN110058760A (zh) * 2019-03-15 2019-07-26 努比亚技术有限公司 一种显示方法、可穿戴设备及计算机可读存储介质

Family Cites Families (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2016128896A1 (en) * 2015-02-09 2016-08-18 Neptune Computer Inc. Methods, apparatuses, and systems for facilitating electronic communications through a haptic wearable interface
CN112241498B (zh) * 2019-07-18 2023-12-29 腾讯科技（深圳）有限公司 页面内容显示方法、装置、可读存储介质和计算机设备
CN111324836B (zh) * 2020-02-10 2024-03-01 广州虎牙科技有限公司 一种页面的处理方法、装置、计算机设备和存储介质
CN111596832B (zh) * 2020-05-20 2022-04-08 北京搜狗智能科技有限公司 一种页面切换方法及装置
CN111767487A (zh) * 2020-05-22 2020-10-13 阿里巴巴集团控股有限公司 页面展示方法、装置及电子设备

Patent Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102707887A (zh) * 2012-05-11 2012-10-03 广东欧珀移动通信有限公司 基于安卓平台的listView中列表项的滑选方法
CN109407937A (zh) * 2018-09-29 2019-03-01 Oppo（重庆）智能科技有限公司 显示控制方法及相关产品
CN110058760A (zh) * 2019-03-15 2019-07-26 努比亚技术有限公司 一种显示方法、可穿戴设备及计算机可读存储介质

Non-Patent Citations (1)

* Cited by examiner, † Cited by third party
Title
基于UI设计的社交软件界面优化项目研究;孙军等;《项目管理技术》;20181010(第10期);59-63 *

Also Published As

Publication number Publication date
CN112905075A (zh) 2021-06-04

Similar Documents

Publication Publication Date Title
US10152228B2 (en) Enhanced display of interactive elements in a browser
CN101971127B (zh) 解释触摸屏上的有歧义输入
EP2545432B1 (en) Control selection approximation
US20160342779A1 (en) System and method for universal user interface configurations
US20110248939A1 (en) Apparatus and method for sensing touch
US9519369B2 (en) Touch screen selection
US11379112B2 (en) Managing content displayed on a touch screen enabled device
CN102999274A (zh) 语义缩放动画
CN103049254A (zh) 用于语义缩放的编程接口
US10474344B2 (en) Method, apparatus and recording medium for a scrolling screen
CN104679485A (zh) 页面元素的控制方法及装置
CN106980379B (zh) 一种显示方法及终端
CN106384264A (zh) 一种信息查询方法及终端
US10042445B1 (en) Adaptive display of user interface elements based on proximity sensing
KR20140094407A (ko) 이동 단말기를 이용한 쇼핑정보 제공방법 및 이동 단말기를 이용하여 쇼핑정보를 제공하는 사용자 인터페이스
CN113641638A (zh) 应用管理方法、装置、电子设备及存储介质
CN112905075B (zh) 页面显示方法、装置及介质
CN113407075B (zh) 图标整理方法、装置和电子设备
CN113268182A (zh) 应用图标的管理方法和电子设备
US10289276B2 (en) Managing tab buttons
CN104321732A (zh) 用户接口装置、搜索方法和程序
CN115917488A (zh) 一种显示界面处理方法、装置及存储介质
CN107862728B (zh) 图片标签的添加方法、装置及计算机可读存储介质
CN114415889A (zh) 图标管理方法、装置、设备和存储介质
KR102213861B1 (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
TA01 Transfer of patent application right
TA01 Transfer of patent application right

Effective date of registration: 20220506

Address after: 518000 28 / F, building D1, Kexing Science Park, 15 Keyuan Road, Science Park community, Yuehai street, Nanshan District, Shenzhen City, Guangdong Province

Applicant after: Futuo Network Technology (Shenzhen) Co.,Ltd.

Address before: 518100 25th floor, building D1, Kexing Science Park, 15 Keyuan Road, Science Park community, Yuehai street, Nanshan District, Shenzhen City, Guangdong Province

Applicant before: SHENZHEN FUTU NETWORK TECHNOLOGY Co.,Ltd.

GR01 Patent grant
GR01 Patent grant