CN114661213A - 基于移动端的页面展示交互方法、系统、设备和介质 - Google Patents

基于移动端的页面展示交互方法、系统、设备和介质 Download PDF

Info

Publication number
CN114661213A
CN114661213A CN202210199241.8A CN202210199241A CN114661213A CN 114661213 A CN114661213 A CN 114661213A CN 202210199241 A CN202210199241 A CN 202210199241A CN 114661213 A CN114661213 A CN 114661213A
Authority
CN
China
Prior art keywords
page
level
pages
target
travel
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
CN202210199241.8A
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.)
Ctrip Travel Network Technology Shanghai Co Ltd
Original Assignee
Ctrip Travel Network Technology Shanghai 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 Ctrip Travel Network Technology Shanghai Co Ltd filed Critical Ctrip Travel Network Technology Shanghai Co Ltd
Priority to CN202210199241.8A priority Critical patent/CN114661213A/zh
Publication of CN114661213A publication Critical patent/CN114661213A/zh
Pending legal-status Critical Current

Links

Images

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/04842Selection of displayed objects or displayed text elements
    • 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/04847Interaction techniques to control parameter settings, e.g. interaction with sliders or dials

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示出一实施例中基于移动端的页面展示交互方法的主要步骤,参照图1所示,本实施例的页面展示交互方法包括:
步骤S110,响应于出行查询请求,获得出行查询请求对应的目标出行类目的目标多层级页面;其中,每种出行类目配置有多层级页面,每种出行类目的多层级页面的层级划分与出行类目的出行预订流程的流程节点相对应。
每种出行类目的多层级页面均隶属于一包含有各种出行类目的根页面;当在根页面触发一种出行类目或输入出行条件,生成出行查询请求。出行应用程序被触发后,即会进入根页面。根页面展示有各种配置好的出行类目,例如包括“节假日出行”类目、“交通组合出行”类目等等。在根页面,用户触发任意出行类目,即会生成携带有该出行类目的标识信息的出行查询请求,从而后端根据该出行查询请求查询到对应的出行类目。根页面还配置有查询输入栏,用户可在查询输入栏输入出行条件,从而后端能够根据携带出行条件的出行查询请求查询到对应的出行类目。
每种出行类目配置的多层级页面的层级划分与该种出行类目的出行预订流程的流程节点相对应的场景例如:“节假日出行”类目下,出行预订流程的流程节点包括:确定出行时间(节假日)→确定出行地点(景点/目的地)→确定出行产品,则,“节假日出行”类目的多层级页面的层级划分对应包括:与出行时间对应的第一层级、与出行地点对应的第二层级、以及与出行产品对应的第三层级。在第一层级页面中,用户可以选择节假日(所有节假日可以合为一个总的页面,用户通过点击选择对应的节假日;也可以分属不同的页面,用户通过滑动切换页面选择对应的节假日);在第二层级页面中,用户可以选择景点/目的地(不同的景点/目的地可以合为一个总的页面,也可以分属不同的页面);在第三层级页面中,基于第一层级页面和第二层级页面的选择结果,展示推荐的出行产品供用户预订。
再如,“交通组合出行”类目下,出行预订流程的流程节点包括:确定出行方式(交通组合方式)→确定时段和价格→确定出行产品;则,“交通组合出行”类目的多层级页面的层级划分对应包括:与交通组合方式对应的第一层级、与时段和价格对应的第二层级、以及与出行产品对应的第三层级。在第一层级页面中,用户可以选择交通组合方式(例如飞机+火车,火车+火车等等);在第二层级页面中,展示基于第一层级页面的选择结果的出行产品的时段分布和对应价格;在第三层级页面中,基于第二层级页面的选择结果,展示具体的出行产品供用户预订。
在其他场景中,不同出行类目的多层级页面的层级可以采用不同的划分数量和划分方式,不以上述列举为限。
步骤S120,按照目标多层级页面的层级划分,在移动端层叠展示目标多层级页面;其中,每组多层级页面的每个层级包含至少一个页面,层叠展示的目标多层级页面中,每个层级仅展示首页面且剩余页面重合于对应的首页面下。
图2示出一实施例中目标多层级页面的层叠展示示意,参照图2所示,本实施例中目标出行类目为“节假日出行”类目,移动端界面200层叠展示的目标多层级页面包括与出行时间对应的第一层级页面210(优先级最高)、与出行地点对应的第二层级页面220(优先级次之)和与出行产品对应的第三层级页面230(优先级最低)。
目标多层级页面的每个层级包含至少一个页面,层叠展示的目标多层级页面中,每个层级如图2所示仅展示首页面,剩余页面重合于对应的首页面下。
步骤S130,响应于目标交互操作,联动更新层叠展示的目标多层级页面。
目标交互操作可以是触发目标多层级页面中的一个页面,则该页面会被优先展示。具体来说,在一个实施例中,步骤S130可包括:响应于对层叠展示的目标多层级页面中的一当前页面的触发操作,将当前页面全屏展示于移动端的主体区域;以及,根据目标多层级页面的层级划分,确定当前页面的父级页面和/或子级页面,将当前页面的父级页面缩略展示于移动端的顶部区域,将当前页面的子级页面缩略展示于移动端的底部区域。
图3示出一实施例中目标多层级页面的联动更新后的示意,结合图2和图3所示,在移动端界面200触发第二层级页面220(例如点击第二层级页面220、上拉第二层级页面220或下拉第三层级页面230等触发操作),则进入移动端界面300,第二层级页面220被全屏展示于移动端的主体区域,第二层级页面220的父级页面(第一层级页面210)缩略展示于移动端的顶部区域,第二层级页面220的子级页面(第三层级页面230)缩略展示于移动端的底部区域。从而,实现根据用户对当前页面的触发操作优先展示当前页面的页面信息。
本实施例中所说的“主体区域”即除了顶部区域(若有展示)和底部区域(若有展示)外的其他区域。在其他实施例中,当前页面的关联层级页面也可展示于移动端的左侧/右侧区域,则“主体区域”是指除了左侧/右侧区域外的其他区域。
此外,本实施例中所说的“全屏展示”,并非指页面占满移动端的全部显示区域,而是指在移动端的主体区域展示出完整的页面。“缩略展示”,即只展示页面的一小部分。
在一些场景下,结合图2所示,若用户触发了第一层级页面210,则将第一层级页面210全屏展示于主体区域,将第一层级页面210的子级页面(包括第二层级页面220和第三层级页面230)缩略并层叠展示于底部区域,或者仅将相邻子级页面(第二层级页面220)缩略展示于底部区域。同理,若用户触发了第三层级页面230,则将第三层级页面230全屏展示于主体区域,将第三层级页面230的父级页面(包括第一层级页面210和第二层级页面220)缩略并层叠展示于顶部区域,或者仅将相邻父级页面(第二层级页面220)缩略展示于顶部区域。
目标交互操作还可以是切换主体区域当前展示的页面,实现关联层级页面的关联切换。具体来说,在一个实施例中,步骤S130可包括:响应于主体区域的单向横滑操作,在主体区域切换展示与当前页面同层级的页面,并根据主体区域当前展示的页面的父级页面和/或子级页面,对应更新顶部区域和/或底部区域的页面信息;其中,每种出行类目的多层级页面中,同层级的多个页面隶属于相同或不同的父级页面;响应于主体区域的单向纵滑操作,在主体区域切换展示当前页面的父级页面或子级页面,并根据主体区域当前展示的页面的父级页面和/或子级页面,对应更新顶部区域和/或底部区域的页面信息。
单向横滑操作例如左滑或右滑,可以是单指或多指。每种出行类目的多层级页面中,同层级的多个页面可以隶属于相同或不同的父级页面,通过作用于主体区域的单向横滑操作,能够在同层级间切换主体区域当前展示的页面,切换展示后顶部区域(若主体区域当前展示的页面具有不同的父级页面)/底部区域(若主体区域当前展示的页面具有不同的子级页面)也会关联切换。单向纵滑操作例如上滑或下滑,可以是单指或多指。通过作用于主体区域的单向纵滑操作,能够在不同层级间切换主体区域当前展示的页面,切换展示后顶部区域(若主体区域当前展示的页面具有父级页面)/底部区域(若主体区域当前展示的页面具有子级页面)也会关联切换。从而,实现层叠展示的多层级页面的一键切换。
目标交互操作还可以是双向横滑以查看主体区域当前展示的页面的所有同层级页面。具体来说,在一个实施例中,步骤S130可包括:响应于主体区域的两侧向中心的双向横滑操作,在主体区域横向展示与当前页面同层级的所有页面;所有页面中,隶属不同的父级页面的页面集以横向并列卡包的方式进行展示,且同一横向卡包中的页面以横向层叠卡片的方式进行展示;以及,响应于对一卡片的选择操作,以所选卡片对应的页面为当前页面,联动更新层叠展示的目标多层级页面。
图4示出一实施例中横向展示目标多层级页面的同一层级下所有页面的示意,参照图4所示的移动端界面400,当用户用两指同时从主体区域的两侧向主体区域的中心滑动时,主体区域横向展示与当前页面同层级的所有页面;其中,隶属不同的父级页面的页面集以横向并列卡包的方式进行展示(图4中示出三个横向并列的卡包410、420和430)。同一横向卡包中的页面,例如图4中的卡包420中的页面,以横向层叠卡片420’的方式进行展示。用户可横向滑动卡包410、420和430、以及每个卡包中的卡片,当一卡片被选择(例如点击),则将该卡片对应的页面全屏展示至主体区域,并联动更新顶部区域/底部区域的页面信息。
通过响应于双向横滑操作采用卡包和卡片在主体区域横向展示与当前页面同层级的所有页面,能够便于用户同时查看到当前层级下的所有页面,并且方便、清晰地选择需要进一步查看的页面。
目标交互操作还可以是双向纵滑以查看目标出行类目下的所有页面。具体来说,在一个实施例中,步骤S130可包括:响应于顶部区域和底部区域向主体区域的双向纵滑操作,在移动端纵向展示目标多层级页面的所有页面;所有页面中,属于不同层级的页面组以纵向并列卡包的方式进行展示、同一纵向卡包中隶属不同的父级页面的页面集以横向并列卡包的方式进行展示,且同一横向卡包中的页面以横向层叠卡片的方式进行展示;以及,响应于对一卡片的选择操作,以所选卡片对应的页面为当前页面,联动更新层叠展示的目标多层级页面。
图5示出一实施例中纵向展示目标多层级页面的所有页面的示意,参照图5所示的移动端界面500,当用户用两指同时从移动端的顶部和底部区域向主体区域滑动时,移动端界面500纵向展示当前的目标多层级页面的所有页面。其中,属于不同层级的页面组以纵向并列卡包的方式进行展示,例如图5中示出三个纵向卡包510、520和530。每个纵向卡包中,隶属不同的父级页面的页面集以横向并列卡包的方式进行展示,例如图5中示出卡包520中包括三个横向并列的卡包520a、520b和520c。同一横向卡包中的页面以横向层叠卡片的方式进行展示,例如图5中示出卡包520b中包括三个横向层叠的卡包520b’。用户可纵向滑动卡包510、520和530,可横向滑动卡包510/520/530中的子卡包,并可横向滑动子卡包中的卡片。当一卡片被选择(例如点击),则将该卡片对应的页面全屏展示至主体区域,并联动更新顶部区域/底部区域的页面信息。
通过响应于双向纵滑操作采用卡包和卡片在移动端界面展示当前的目标出行类目下的所有页面,能够便于用户同时查看到目标出行类目下的所有页面,并且方便、清晰地选择需要进一步查看的页面。
上述每个移动端界面中,均可在右上角等区域设置返回按钮,以供用户触发返回至根页面。
进一步地,每种出行类目的多层级页面中,同层级的多个页面具有初始的页面排序;在一个实施例中,步骤S130还可包括:根据主体区域当前展示的页面,实时更新当前展示的页面所在层级的页面排序,以使用户最新查看的页面在同层级页面中具有最高优先级,以便于用户返回查看。
本发明的基于移动端的页面展示交互方法,能够缩短用户操作步长,通过多层级页面展示交互,降低用户翻动切换页面的操作费力度,便于用户掌握关联页面信息,提升用户使用体验。
本发明实施例还提供一种基于移动端的页面展示交互系统,可用于实现上述任意实施例描述的基于移动端的页面展示交互方法。上述任意实施例描述的页面展示交互方法的特征和原理均可应用至下面的页面展示交互系统实施例。在下面的页面展示交互系统实施例中,对已经阐明的关于页面展示交互的特征和原理不再重复说明。
图6示出一实施例中基于移动端的页面展示交互系统的主要模块,参照图6所示,本实施例的页面展示交互系统600包括:查询响应模块610,用于响应于出行查询请求,获得出行查询请求对应的目标出行类目的目标多层级页面;其中,每种出行类目配置有多层级页面,每种出行类目的多层级页面的层级划分与出行类目的出行预订流程的流程节点相对应;层级展示模块620,用于按照目标多层级页面的层级划分,在移动端层叠展示目标多层级页面;其中,每组多层级页面的每个层级包含至少一个页面,层叠展示的目标多层级页面中,每个层级仅展示首页面且剩余页面重合于对应的首页面下;以及交互响应模块630,用于响应于目标交互操作,联动更新层叠展示的目标多层级页面。
进一步地,页面展示交互系统600还可包括实现上述各页面展示交互方法实施例的其他流程步骤的模块,各个模块的具体原理可参照上述各页面展示交互方法实施例的描述,此处不再重复说明。
本发明的页面展示交互系统,能够缩短用户操作步长,通过多层级页面展示交互,降低用户翻动切换页面的操作费力度,便于用户掌握关联页面信息,提升用户使用体验。
本发明实施例还提供一种电子设备,包括处理器和存储器,存储器中存储有可执行指令,可执行指令被处理器执行时,实现上述任意实施例描述的页面展示交互方法。
本发明的电子设备,能够实现缩短用户操作步长,通过多层级页面展示交互,降低用户翻动切换页面的操作费力度,便于用户掌握关联页面信息,提升用户使用体验。
图7是本发明实施例中电子设备的结构示意图,应当理解的是,图7仅仅是示意性地示出各个模块,这些模块可以是虚拟的软件模块或实际的硬件模块,这些模块的合并、拆分及其余模块的增加都在本发明的保护范围之内。
如图7所示,电子设备700以通用计算设备的形式表现。电子设备700的组件包括但不限于:至少一个处理单元710、至少一个存储单元720、连接不同平台组件(包括存储单元720和处理单元710)的总线730、显示单元740等。
其中,存储单元存储有程序代码,程序代码可以被处理单元710执行,使得处理单元710执行上述任意实施例描述的页面展示交互方法的步骤。例如,处理单元710可以执行如图1所示的步骤。
存储单元720可以包括易失性存储单元形式的可读介质,例如随机存取存储单元(RAM)7201和/或高速缓存存储单元7202,还可以进一步包括只读存储单元(ROM)7203。
存储单元720还可以包括具有一个或多个程序模块7205的程序/实用工具7204,这样的程序模块7205包括但不限于:操作系统、一个或者多个应用程序、其它程序模块以及程序数据,这些示例中的每一个或某种组合中可能包括网络环境的实现。
总线730可以为表示几类总线结构中的一种或多种,包括存储单元总线或者存储单元控制器、外围总线、图形加速端口、处理单元或者使用多种总线结构中的任意总线结构的局域总线。
电子设备700也可以与一个或多个外部设备通信,外部设备可以是键盘、指向设备、蓝牙设备等设备中的一种或多种。这些外部设备使得用户能与该电子设备700进行交互通信。电子设备700也能与一个或多个其它计算设备进行通信,所示计算机设备包括路由器、调制解调器。这种通信可以通过输入/输出(I/O)接口750进行。并且,电子设备700还可以通过网络适配器760与一个或者多个网络(例如局域网(LAN),广域网(WAN)和/或公共网络,例如因特网)通信。网络适配器760可以通过总线730与电子设备700的其它模块通信。应当明白,尽管图中未示出,可以结合电子设备700使用其它硬件和/或软件模块,包括但不限于:微代码、设备驱动器、冗余处理单元、外部磁盘驱动阵列、RAID系统、磁带驱动器以及数据备份存储平台等。
本发明实施例还提供一种计算机可读的存储介质,用于存储程序,程序被执行时实现上述任意实施例描述的页面展示交互方法。在一些可能的实施方式中,本发明的各个方面还可以实现为一种程序产品的形式,其包括程序代码,当程序产品在终端设备上运行时,程序代码用于使终端设备执行上述任意实施例描述的页面展示交互方法。
本发明的存储介质当被处理器执行时,能够实现缩短用户操作步长,通过多层级页面展示交互,降低用户翻动切换页面的操作费力度,便于用户掌握关联页面信息,提升用户使用体验。
存储介质可以采用便携式紧凑盘只读存储器(CD-ROM)并包括程序代码,并可以在终端设备,例如个人电脑上运行。然而,本发明的存储介质不限于此,其可以是任何包含或存储程序的有形介质,该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。
存储介质可以采用一个或多个可读介质的任意组合。可读介质可以是可读信号介质或者可读存储介质。可读存储介质例如可以为但不限于电、磁、光、电磁、红外线、或半导体的系统、装置或器件,或者任意以上的组合。可读存储介质的更具体的例子包括但不限于:具有一个或多个导线的电连接、便携式盘、硬盘、随机存取存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。
可读信号介质可以包括在基带中或者作为载波一部分传播的数据信号,其中承载了可读程序代码。这种传播的数据信号可以采用多种形式,包括但不限于电磁信号、光信号或上述的任意合适的组合。可读信号介质还可以是可读存储介质以外的任何可读介质,该可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。可读信号介质上包含的程序代码可以用任何适当的介质传输,包括但不限于无线、有线、光缆、RF等等,或者上述的任意合适的组合。
可以以一种或多种程序设计语言的任意组合来编写用于执行本发明操作的程序代码,程序设计语言包括面向对象的程序设计语言—诸如Java、C++等,还包括常规的过程式程序设计语言—诸如“C”语言或类似的程序设计语言。程序代码可以完全地在用户计算设备上执行、部分地在用户设备上执行、作为一个独立的软件包执行、部分在用户计算设备上部分在远程计算设备上执行、或者完全在远程计算设备或服务器上执行。在涉及远程计算设备的情形中,远程计算设备可以通过任意种类的网络,包括局域网(LAN)或广域网(WAN),连接到用户计算设备,或者,可以连接到外部计算设备,例如利用因特网服务提供商来通过因特网连接。
以上内容是结合具体的优选实施方式对本发明所作的进一步详细说明,不能认定本发明的具体实施只局限于这些说明。对于本发明所属技术领域的普通技术人员来说,在不脱离本发明构思的前提下,还可以做出若干简单推演或替换,都应当视为属于本发明的保护范围。

Claims (10)

1.一种基于移动端的页面展示交互方法,其特征在于,包括:
响应于出行查询请求,获得所述出行查询请求对应的目标出行类目的目标多层级页面;其中,每种出行类目配置有多层级页面,每种所述出行类目的多层级页面的层级划分与所述出行类目的出行预订流程的流程节点相对应;
按照所述目标多层级页面的层级划分,在移动端层叠展示所述目标多层级页面;其中,每组多层级页面的每个层级包含至少一个页面,层叠展示的所述目标多层级页面中,每个层级仅展示首页面且剩余页面重合于对应的首页面下;以及
响应于目标交互操作,联动更新层叠展示的所述目标多层级页面。
2.如权利要求1所述的页面展示交互方法,其特征在于,每种所述出行类目的多层级页面均隶属于一包含有各种所述出行类目的根页面;
当在所述根页面触发一种出行类目或输入出行条件,生成所述出行查询请求。
3.如权利要求1所述的页面展示交互方法,其特征在于,所述响应于目标交互操作,联动更新层叠展示的所述目标多层级页面,包括:
响应于对层叠展示的所述目标多层级页面中的一当前页面的触发操作,将所述当前页面全屏展示于所述移动端的主体区域;以及
根据所述目标多层级页面的层级划分,确定所述当前页面的父级页面和/或子级页面,将所述当前页面的父级页面缩略展示于所述移动端的顶部区域,将所述当前页面的子级页面缩略展示于所述移动端的底部区域。
4.如权利要求3所述的页面展示交互方法,其特征在于,所述响应于目标交互操作,联动更新层叠展示的所述目标多层级页面,还包括:
响应于所述主体区域的单向横滑操作,在所述主体区域切换展示与所述当前页面同层级的页面,并根据所述主体区域当前展示的页面的父级页面和/或子级页面,对应更新所述顶部区域和/或所述底部区域的页面信息;
其中,每种所述出行类目的多层级页面中,同层级的多个页面隶属于相同或不同的父级页面;
响应于所述主体区域的单向纵滑操作,在所述主体区域切换展示所述当前页面的父级页面或子级页面,并根据所述主体区域当前展示的页面的父级页面和/或子级页面,对应更新所述顶部区域和/或所述底部区域的页面信息。
5.如权利要求3所述的页面展示交互方法,其特征在于,所述响应于目标交互操作,联动更新层叠展示的所述目标多层级页面,还包括:
响应于所述主体区域的两侧向中心的双向横滑操作,在所述主体区域横向展示与所述当前页面同层级的所有页面;
所述所有页面中,隶属不同的父级页面的页面集以横向并列卡包的方式进行展示,且同一横向卡包中的页面以横向层叠卡片的方式进行展示;以及
响应于对一卡片的选择操作,以所选卡片对应的页面为所述当前页面,联动更新层叠展示的所述目标多层级页面。
6.如权利要求3所述的页面展示交互方法,其特征在于,所述响应于目标交互操作,联动更新层叠展示的所述目标多层级页面,还包括:
响应于所述顶部区域和所述底部区域向所述主体区域的双向纵滑操作,在所述移动端纵向展示所述目标多层级页面的所有页面;
所述所有页面中,属于不同层级的页面组以纵向并列卡包的方式进行展示、同一纵向卡包中隶属不同的父级页面的页面集以横向并列卡包的方式进行展示,且同一横向卡包中的页面以横向层叠卡片的方式进行展示;以及
响应于对一卡片的选择操作,以所选卡片对应的页面为所述当前页面,联动更新层叠展示的所述目标多层级页面。
7.如权利要求3-6任一项所述的页面展示交互方法,其特征在于,每种所述出行类目的多层级页面中,同层级的多个页面具有初始的页面排序;
所述响应于目标交互操作,联动更新层叠展示的所述目标多层级页面,还包括:
根据所述主体区域当前展示的页面,实时更新所述当前展示的页面所在层级的页面排序。
8.一种基于移动端的页面展示交互系统,其特征在于,包括:
查询响应模块,用于响应于出行查询请求,获得所述出行查询请求对应的目标出行类目的目标多层级页面;其中,每种出行类目配置有多层级页面,每种所述出行类目的多层级页面的层级划分与所述出行类目的出行预订流程的流程节点相对应;
层级展示模块,用于按照所述目标多层级页面的层级划分,在移动端层叠展示所述目标多层级页面;其中,每组多层级页面的每个层级包含至少一个页面,层叠展示的所述目标多层级页面中,每个层级仅展示首页面且剩余页面重合于对应的首页面下;以及
交互响应模块,用于响应于目标交互操作,联动更新层叠展示的所述目标多层级页面。
9.一种电子设备,其特征在于,包括:
一处理器;
一存储器,所述存储器中存储有可执行指令;
其中,所述可执行指令被所述处理器执行时,实现如权利要求1-7任一项所述的基于移动端的页面展示交互方法。
10.一种计算机可读的存储介质,用于存储程序,其特征在于,所述程序被处理器执行时实现如权利要求1-7任一项所述的基于移动端的页面展示交互方法。
CN202210199241.8A 2022-03-01 2022-03-01 基于移动端的页面展示交互方法、系统、设备和介质 Pending CN114661213A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202210199241.8A CN114661213A (zh) 2022-03-01 2022-03-01 基于移动端的页面展示交互方法、系统、设备和介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202210199241.8A CN114661213A (zh) 2022-03-01 2022-03-01 基于移动端的页面展示交互方法、系统、设备和介质

Publications (1)

Publication Number Publication Date
CN114661213A true CN114661213A (zh) 2022-06-24

Family

ID=82026893

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202210199241.8A Pending CN114661213A (zh) 2022-03-01 2022-03-01 基于移动端的页面展示交互方法、系统、设备和介质

Country Status (1)

Country Link
CN (1) CN114661213A (zh)

Citations (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102012787A (zh) * 2010-11-19 2011-04-13 互动在线(北京)科技有限公司 层叠样式表实现非固定区域随浏览器高/宽度自适应方法
US20150052425A1 (en) * 2013-08-13 2015-02-19 Samsung Electronics Co., Ltd. Method of searching for page using three-dimensional manner in portable device and portable device for the same
CN105867937A (zh) * 2016-04-18 2016-08-17 浙江慧脑信息科技有限公司 一种交互式多窗设计方法
CN106354357A (zh) * 2016-08-09 2017-01-25 华为技术有限公司 信息显示方法及装置
CN110209329A (zh) * 2019-05-23 2019-09-06 厦门美柚信息科技有限公司 显示页面内容的方法、装置、设备及存储介质
CN110928623A (zh) * 2019-11-08 2020-03-27 维沃移动通信有限公司 目录显示方法及电子设备
CN113986063A (zh) * 2021-11-08 2022-01-28 北京字跳网络技术有限公司 显示控制方法、装置、电子设备和存储介质

Patent Citations (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102012787A (zh) * 2010-11-19 2011-04-13 互动在线(北京)科技有限公司 层叠样式表实现非固定区域随浏览器高/宽度自适应方法
US20150052425A1 (en) * 2013-08-13 2015-02-19 Samsung Electronics Co., Ltd. Method of searching for page using three-dimensional manner in portable device and portable device for the same
CN105867937A (zh) * 2016-04-18 2016-08-17 浙江慧脑信息科技有限公司 一种交互式多窗设计方法
CN106354357A (zh) * 2016-08-09 2017-01-25 华为技术有限公司 信息显示方法及装置
CN110209329A (zh) * 2019-05-23 2019-09-06 厦门美柚信息科技有限公司 显示页面内容的方法、装置、设备及存储介质
CN110928623A (zh) * 2019-11-08 2020-03-27 维沃移动通信有限公司 目录显示方法及电子设备
CN113986063A (zh) * 2021-11-08 2022-01-28 北京字跳网络技术有限公司 显示控制方法、装置、电子设备和存储介质

Similar Documents

Publication Publication Date Title
CN108009275B (zh) 航班中转信息展示方法、装置、电子设备、存储介质
CN104239395B (zh) 搜索的方法和系统
CN110088778B (zh) 自动化平台的情节存储器的系统、方法和计算机可读介质
CN107368907A (zh) 酒店信息展示方法及装置、电子设备、存储介质
CN109416699A (zh) 用于显现相关结果的用户界面元素
CN107229718A (zh) 处理报表数据的方法和装置
CN110472163A (zh) 地图搜索结果的展现确定方法、装置、电子设备和介质
CN112785215B (zh) 一种生成拣货路径的方法和装置
JP2018531379A6 (ja) 経路照会方法、装置、デバイス及び不揮発性コンピューター記憶媒体
JP2018531379A (ja) 経路照会方法、装置、デバイス及び不揮発性コンピューター記憶媒体
CN107832365A (zh) 多类旅行产品推送方法、装置、电子设备、存储介质
CN116610398A (zh) 递归树形组件展示方法、装置、计算机设备及计算机可读存储介质
CN107704104B (zh) 表单输入项联想方法、系统、设备及存储介质
CN109710832A (zh) 一种用于搜索寄宿程序的方法与设备
CN114661213A (zh) 基于移动端的页面展示交互方法、系统、设备和介质
US20080313063A1 (en) Expense Report Generation From Confirmation Emails
CN112765159A (zh) 报表生成方法、系统、计算机设备和存储介质
CN110348581B (zh) 用户特征群中用户特征寻优方法、装置、介质及电子设备
CN112308487A (zh) 物流轨迹展示方法、装置、电子设备以及存储介质
CN108763518B (zh) 乘车方案的推荐方法、装置、终端设备及可读存储介质
CN111753164A (zh) 链路事件引导方法、装置、电子设备及存储介质
CN109241102A (zh) 数据处理方法及装置、存储介质和电子设备
CN113175940A (zh) 数据处理方法、装置、设备和存储介质
CN114282121A (zh) 业务节点推荐方法、系统、设备及存储介质
CN113094401B (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