CN114594985A - 一种页面组件展示方法、装置、设备及介质 - Google Patents

一种页面组件展示方法、装置、设备及介质 Download PDF

Info

Publication number
CN114594985A
CN114594985A CN202210246168.5A CN202210246168A CN114594985A CN 114594985 A CN114594985 A CN 114594985A CN 202210246168 A CN202210246168 A CN 202210246168A CN 114594985 A CN114594985 A CN 114594985A
Authority
CN
China
Prior art keywords
component
preset
page
target preset
preset component
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
CN202210246168.5A
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 ByteDance Network Technology Co Ltd
Original Assignee
Beijing ByteDance 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 Beijing ByteDance Network Technology Co Ltd filed Critical Beijing ByteDance Network Technology Co Ltd
Priority to CN202210246168.5A priority Critical patent/CN114594985A/zh
Publication of CN114594985A publication Critical patent/CN114594985A/zh
Pending legal-status Critical Current

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/70Software maintenance or management
    • G06F8/71Version control; Configuration management
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/95Retrieval from the web
    • G06F16/958Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/445Program loading or initiating
    • G06F9/44521Dynamic linking or loading; Link editing at or after load time, e.g. Java class loading
    • G06F9/44526Plug-ins; Add-ons
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/451Execution arrangements for user interfaces

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Databases & Information Systems (AREA)
  • Human Computer Interaction (AREA)
  • Computer Security & Cryptography (AREA)
  • Data Mining & Analysis (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本公开实施例涉及一种页面组件展示方法、装置、设备及介质,其中该方法包括:接收针对目标预设组件的展示请求,展示请求中包括目标预设组件的配置信息,目标预设组件为多个预设组件中的任意一个,预设组件表示具有提醒功能的组件;调用通用组件基于目标预设组件的配置信息判断目标预设组件是否满足优先级条件,并在确定目标预设组件满足优先级条件之后在页面中展示目标预设组件。本公开实施例通过在页面中引入一个通用组件设置预设组件的优先级条件的通用判断逻辑,能够在每个预设组件展示时根据配置信息调用通用组件执行判断并展示,降低了开发量、开发复杂度以及维护困难度,进而提升了页面中预设组件的开发效率和展示效率。

Description

一种页面组件展示方法、装置、设备及介质
技术领域
本公开涉及前端页面技术领域,尤其涉及一种页面组件展示方法、装置、设备及介质。
背景技术
随着前端网页技术的不断发展,网页中使用的很多集成逻辑和展示模块可以基于组件式的开发模式开发,提升开发和维护效率。针对网页中在某些时刻会在特定位置展示的组件,在满足特定条件之后需要隐藏该组件,从而达到特定的业务需求同时不会因长时间存在引起用户反感,例如引导组件,可以通过小手图像引导用户点击所需的业务按键,在用户点击引导位置之后隐藏小手,从而达到引导用户点击,同时不会长时间存在引起用户反感的需求。
相关技术中,当页面中仅仅需要设置一个上述组件时实现起来比较简单快速,但多时候需要在页面中的多个位置去显示上述组件,甚至多个位置之间还有优先级的要求,每个位置均需要引入该组件并且需要设置是否显示的判断逻辑以及与其他位置的组件之间冲突逻辑等,存在代码量多、开发效率低、因逻辑耦合造成的开发复杂度高以及维护困难的缺陷。
发明内容
为了解决上述技术问题,本公开提供了一种页面组件展示方法、装置、设备及介质。
本公开实施例提供了一种页面组件展示方法,所述方法包括:
接收针对目标预设组件的展示请求,所述展示请求中包括所述目标预设组件的配置信息,所述目标预设组件为多个预设组件中的任意一个,所述预设组件表示具有提醒功能的组件;
调用通用组件基于所述目标预设组件的配置信息判断所述目标预设组件是否满足优先级条件,并在确定所述目标预设组件满足优先级条件之后在页面中展示所述目标预设组件。
本公开实施例还提供了一种页面组件展示装置,所述装置包括:
请求模块,用于接收针对目标预设组件的展示请求,所述展示请求中包括所述目标预设组件的配置信息,所述目标预设组件为多个预设组件中的任意一个,所述预设组件表示具有提醒功能的组件;
展示模块,用于调用通用组件基于所述目标预设组件的配置信息判断所述目标预设组件是否满足优先级条件,并在确定所述目标预设组件满足优先级条件之后在页面中展示所述目标预设组件。
本公开实施例还提供了一种电子设备,所述电子设备包括:处理器;用于存储所述处理器可执行指令的存储器;所述处理器,用于从所述存储器中读取所述可执行指令,并执行所述指令以实现如本公开实施例提供的页面组件展示方法。
本公开实施例还提供了一种计算机可读存储介质,所述存储介质存储有计算机程序,所述计算机程序用于执行如本公开实施例提供的页面组件展示方法。
本公开实施例提供的技术方案与现有技术相比具有如下优点:本公开实施例提供的页面组件展示方案,接收针对目标预设组件的展示请求,展示请求中包括目标预设组件的配置信息,目标预设组件为多个预设组件中的任意一个,预设组件表示具有提醒功能的组件;调用通用组件基于目标预设组件的配置信息判断目标预设组件是否满足优先级条件,并在确定目标预设组件满足优先级条件之后在页面中展示目标预设组件。采用上述技术方案,通过在页面中引入一个通用组件设置预设组件的优先级条件的通用判断逻辑,能够在每个预设组件展示时根据配置信息调用通用组件执行判断并展示,预设组件的不同展示需求可以通过配置信息设置,避免了在每个预设组件中都需要进行的判断逻辑的重复开发,降低了开发量、开发复杂度以及维护困难度,进而提升了页面中预设组件的开发效率和展示效率。
附图说明
结合附图并参考以下具体实施方式,本公开各实施例的上述和其他特征、优点及方面将变得更加明显。贯穿附图中,相同或相似的附图标记表示相同或相似的元素。应当理解附图是示意性的,原件和元素不一定按照比例绘制。
图1为本公开实施例提供的一种页面组件展示方法的流程示意图;
图2为本公开实施例提供的一种引导组件的示意图;
图3为本公开实施例提供的另一种页面组件展示方法的流程示意图;
图4为本公开实施例提供的一种页面组件展示装置的结构示意图;
图5为本公开实施例提供的一种电子设备的结构示意图。
具体实施方式
下面将参照附图更详细地描述本公开的实施例。虽然附图中显示了本公开的某些实施例,然而应当理解的是,本公开可以通过各种形式来实现,而且不应该被解释为限于这里阐述的实施例,相反提供这些实施例是为了更加透彻和完整地理解本公开。应当理解的是,本公开的附图及实施例仅用于示例性作用,并非用于限制本公开的保护范围。
应当理解,本公开的方法实施方式中记载的各个步骤可以按照不同的顺序执行,和/或并行执行。此外,方法实施方式可以包括附加的步骤和/或省略执行示出的步骤。本公开的范围在此方面不受限制。
本文使用的术语“包括”及其变形是开放性包括,即“包括但不限于”。术语“基于”是“至少部分地基于”。术语“一个实施例”表示“至少一个实施例”;术语“另一实施例”表示“至少一个另外的实施例”;术语“一些实施例”表示“至少一些实施例”。其他术语的相关定义将在下文描述中给出。
需要注意,本公开中提及的“第一”、“第二”等概念仅用于对不同的装置、模块或单元进行区分,并非用于限定这些装置、模块或单元所执行的功能的顺序或者相互依存关系。
需要注意,本公开中提及的“一个”、“多个”的修饰是示意性而非限制性的,本领域技术人员应当理解,除非在上下文另有明确指出,否则应该理解为“一个或多个”。
本公开实施方式中的多个装置之间所交互的消息或者信息的名称仅用于说明性的目的,而并不是用于对这些消息或信息的范围进行限制。
相关技术中,当页面中仅仅需要设置一个类似引导组件的组件时实现起来比较简单快速,但多时候需要在页面中的多个位置去显示上述组件,甚至多个位置之间还有优先级的要求,例如当A位置出现引导组件时,B位置的引导组件不能显示。页面开发往往是基于组件式的开发模式,即一个页面按模块被分成了很多个组件,不同位置往往在不同的组件内,若要实现上述组件,在每个需要显示上述组件的关联组件中,需要进行如下操作:引入一个组件;将组件放置在对应位置;声明一个变量(以下简称visible),用来表示组件是否显示,visible为true时显示,visible为false时不显示;关联组件在某个操作下触发了显示组件的逻辑时执行以下流程:a.获取页面全局变量,判断当中是否有和自己优先级冲突的组件,如果有,并且冲突的组件优先级高于自己,则不显示当前组件;如果有并且突的小手优先级不高于自己,则设置visible为true,在页面全局变量中添加一个当前组件的变量(包含组件位置的唯一标识、优先级信息),将冲突的组件移除;b.如果没有优先级冲突的组件正在显示,设置visible为true,在页面全局变量添加相关信息。
上述方案存在以下缺陷:在每个需要引导的位置都需要引入一个组件,即使那个位置的组件显示频率很低,导致代码量增多,静态资源体积变大;同时,每个位置都需要写组件是否显示的判断逻辑,还耦合了其他位置的组件逻辑,不同组件之间逻辑互相耦合,导致开发复杂度高;组件开发效率低,每个位置都需要重复的编写各种逻辑;维护困难,修改一个组件时组要注意不影响到其他位置的组件。为了解决上述问题,本公开实施例提供了一种页面组件展示方法,下面结合具体的实施例对该方法进行介绍。
图1为本公开实施例提供的一种页面组件展示方法的流程示意图,该方法可以由页面组件展示装置执行,其中该装置可以采用软件和/或硬件实现,一般可集成在电子设备中。如图1所示,该方法包括:
步骤101、接收针对目标预设组件的展示请求,展示请求中包括目标预设组件的配置信息,目标预设组件为多个预设组件中的任意一个,预设组件表示具有提醒功能的组件。
本公开实施例的页面组件展示方法可以由浏览器或通过浏览器运行的Web应用程序执行。本公开实施例的页面可以为H5页面,也即Web页面或网页,由前端负责开发。组件可以为页面内所使用到的集成逻辑和/或展示模块等。预设组件可以为页面中的一种组件,通过在页面的代码中添加预设组件的代码即可引入该预设组件,预设组件可以理解为能够在一些特定时刻在页面的某个位置进行展示以实现提醒功能的组件。本公开实施例中预设组件可以包括引导组件、动画组件等中的至少一种,引导组件可以为具有引导提醒功能的组件,动画组件可以为通过动画方式进行提醒的组件。目标预设组件可以为当前需要展示的预设组件。
配置信息可以理解为用于进行逻辑自定义的相关信息,目标预设组件的配置信息可以包括组件标识(ID)、组件分类(category)、优先级(priority)和展示位置(position)等,组件标识可以为用于区分不同预设组件的标识,组件分类可以为按照展示位置或展示样式等对预设组件划分的类别,优先级可以表征预设组件展示时的先后顺序,同一组件分类下的多个预设组件具有优先级的设置,展示位置可以为预设组件在页面上的具体展示位置。
在一些实施例中,接收针对目标预设组件的展示请求,包括:获取目标预设组件的展示位置所在关联组件发送的目标预设组件的展示请求,其中,目标预设组件的展示请求为关联组件响应于预设按键的展示和/或预设信息满足变化条件发送,预设按键、预设信息设置在关联组件中。
其中,预设按键可以为与目标预设组件关联的按键,预设按键的数量不限,例如目标预设组件为一个引导组件时,预设按键可以为被引导点击的“领取资源”的按键。预设信息可以理解为页面中不断变化的信息,变化条件可以为针对预设信息设置的条件,例如目标预设组件为一个动画组件,预设信息为点赞数量,变化条件可以为点赞数量达到数量阈值(例如1000)。关联组件可以理解为页面中需要展示预设组件的大的组件,目标预设组件的展示位置所在关联组件表示目标预设组件在页面展示时展示在关联组件中,上述预设按键和预设信息可以设置在目标预设组件的展示位置所在关联组件中。本公开实施例在每个需要展示预设组件的关联组件中均可以预先存储预设组件的配置信息,并引入对应的事件广播器,以能够在需要展示预设组件时调用事件广播器的事件通知模块将配置信息添加在展示请求中通知出去。
具体地,目标预设组件的展示位置所在关联组件可以监控预设按键和/或预设信息,当检测到预设按键展示和/或预设信息满足变化条件之后,则此时需要展示目标预设组件,可以将目标预设组件的展示请求发送出去,页面组件展示装置可以获取到目标预设组件的展示请求。可选的,关联组件可以通过事件广播器将目标预设组件的展示请求作为一个事件通知出去,并附带有目标预设组件的配置信息,页面组件展示装置可以接收到该目标预设组件的展示请求。
步骤102、调用通用组件基于目标预设组件的配置信息判断目标预设组件是否满足优先级条件,并在确定目标预设组件满足优先级条件之后在页面中展示目标预设组件。
其中,通用组件可以理解为在页面的代码中新增的一个设置了上述多个预设组件具有的相同优先级判断逻辑的组件,可以设置在页面的最顶层。优先级条件可以为用于定义不同预设组件之间是否有优先级冲突的条件。
在本公开实施例中,调用通用组件基于目标预设组件的配置信息判断目标预设组件是否满足优先级条件,可以包括:通过事件广播器调用通用组件从页面全局变量中提取当前预设组件的配置信息,其中,当前预设组件在页面中展示,当前预设组件与目标预设组件的组件分类相同;根据当前预设组件的配置信息的提取结果以及目标预设组件的优先级与当前预设组件的优先级的对比结果,判断目标预设组件是否满足优先级条件。
事件广播器(emitter)可以理解为用于在不同组件之间通过发送事件和接收事件实现信息传递的广播器,全局事件广播器可以是通用组件中引入的事件广播器。页面全局变量用于存储页面中正在显示的全部预设组件的配置信息,页面全局变量可以是一个数组结构,保存多个变量,预设组件的配置信息可以作为变量存储,并且支持对变量的增加、删除、修改和查询等操作。
具体地,页面组件展示装置在接收针对目标预设组件的展示请求之后,可以启动通用组件以及通用组件对应的全局事件广播器,将目标预设组件的展示请求发送出去,通用组件通过全局事件广播器中的监听模块在监听到展示目标预设组件的展示请求的事件之后可以执行优先级判断逻辑,具体执行过程可以包括:通用组件可以提取展示请求中目标预设组件的配置信息,根据其中目标预设组件的组件分类在页面全局变量中进行查找,提取相同组件分类的当前预设组件的配置信息;之后通用组件可以根据当前预设组件的配置信息的提取结果以及目标预设组件、当前预设组件的优先级的对比结果判断目标预设组件是否满足优先级条件。
在一些实施例中,确定目标预设组件满足优先级条件,可以包括:当从页面全局变量中未提取到当前预设组件的配置信息,或者当从页面全局变量中未提取到当前预设组件的配置信息并且对比结果为目标预设组件的优先级大于或等于当前预设组件的优先级,则确定目标预设组件满足优先级条件。
具体地,通用组件在页面全局变量中未查找到与目标预设组件的组件分类相同的当前预设组件的配置信息时,则可以确定目标预设组件满足优先级条件;或者,通用组件从页面全局变量提取到当前预设组件的配置信息之后,判断目标预设组件的优先级是否大于或等于当前预设组件的优先级,若是,则可以确定目标预设组件满足优先级条件;否则,可以确定目标预设组件不满足优先级条件。
通过通用组件确定目标预设组件满足优先级条件之后,可以将目标预设组件的配置信息添加在页面全局变量中,进而可以在页面中展示目标预设组件。可选的,当目标预设组件的优先级是否大于当前预设组件的优先级,或者,目标预设组件的优先级等于当前预设组件的优先级以及相同优先级的预设组件不支持同时展示时,删除页面全局变量中的当前预设组件的配置信息,并将目标预设组件的配置信息添加至页面全局变量中,以关闭当前预设组件并展示目标预设组件;当目标预设组件的优先级等于当前预设组件的优先级,并且相同优先级的预设组件支持同时展示时,可以将目标预设组件的配置信息添加至页面全局变量中,并同时在页面展示目标预设组件和当前预设组件。
在本公开实施例中,在页面中展示目标预设组件,可以包括:根据目标预设组件的配置信息中的展示位置,以通用组件为参照物将目标预设组件展示在页面上,多个预设组件为通用组件的子元素,通用组件和各预设组件的定位方式为绝对定位方式。
页面中的可以设置层级关系实现多层结构,也即可以通过样式设置将一个元素叠加在另一个元素上方展示,预设组件可以是一种元素。绝对定位方式(absolute)可以是页面中元素的一种定位方式,该定位方式下元素可以非默认定位方式(static)的父元素为参照物,通过修改相对于参照物的左间距(left)和上间距(top)可以修改元素的显示位置。
页面中的定位方式包括默认定位方式、相对定位方式(relative)、固定定位方式(fixed)和上述绝对定位方式,默认定位方式可以是没有特殊样式设置时元素的定位方式,相同父元素时在同一层级正常地从上到下渲染,在页面中占据一定的大小区域,无法通过修改样式设置来修改位置;相对定位方式与默认定位方式一样正常渲染,相对定位方式的元素可以作为绝对定位方式的子元素的参照物;固定定位方式可以相对于屏幕位置做定位,也即参照物为屏幕位置,也可以通过修改相对于屏幕位置的左间距和上间距修改元素的显示位置,例如当相对于屏幕位置的左间距和上间距均为0时,固定定位方式的元素将始终显示在屏幕的左上角,相对定位方式的元素也可以作为绝对定位方式的子元素的参照物。
当元素定位方式设置为绝对定位方式和固定定位方式时,不会挤开其他元素,也不会影响其他元素的渲染位置,同时层级会高于原先同层级的元素,例如原本元素A和B都是元素C的子元素,那么A和B是同一个层级,将A的定位方式设置为绝对定位方式后,A的层级会高于B,可以通过设置相对于参照物的左间距和上间距等方式使A叠加在B的上方展示。
本公开实施例中可以设置通用组件为一个绝对定位方式的div元素,div元素可以是页面中的一种基本的容器元素,可以用来放置其他元素。可选的,通用组件可以定位在页面的左上角,并且通过将透明度设置为透明,以使用户不可见,避免影响页面其他元素的展示。通用组件可以根据页面全局变量生成多个预设组件作为子元素,当页面全局变量变化时可以自动更新页面中的视图,并且通用组件可以将每个预设组件的定位方式也设置为绝对定位方式,每个预设组件相对于通用组件定位,也即参照物为通用组件。在展示目标预设组件时,可以通用组件为参照物根据目标预设组件的配置信息中的展示位置,将目标预设组件叠加展示在页面上。
示例性的,图2为本公开实施例提供的一种引导组件的示意图,如图2所示,图中展示了一个引导组件201以及关联的预设按键202,预设按键202可以为一个“领取资源”的按键,用于进行资源领取;该引导组件201是一个小手形状,在预设按键202展示在页面之后通过通用组件确定引导组件201满足优先级条件时展示引导组件201,以引导用户点击预设按键202。图2中的引导组件及其预设按键仅为一种示例,而非限定。
本公开实施例提供的页面组件展示方案,接收针对目标预设组件的展示请求,展示请求中包括目标预设组件的配置信息,目标预设组件为多个预设组件中的任意一个,预设组件表示具有提醒功能的组件;调用通用组件基于目标预设组件的配置信息判断目标预设组件是否满足优先级条件,并在确定目标预设组件满足优先级条件之后在页面中展示目标预设组件。采用上述技术方案,通过在页面中引入一个通用组件设置预设组件的优先级条件的通用判断逻辑,能够在每个预设组件展示时根据配置信息调用通用组件执行判断并展示,预设组件的不同展示需求可以通过配置信息设置,避免了在每个预设组件中都需要进行的判断逻辑的重复开发,降低了开发量、开发复杂度以及维护困难度,进而提升了页面中预设组件的开发效率和展示效率。
在一些实施例中,通用组件可以设置在页面最顶层并通过全局事件广播器设置其执行逻辑。可选的,全局事件广播器包括事件监听执行模块,事件监听模块用于监听预设组件的展示请求或隐藏请求并执行对应的展示操作或隐藏操作。
在执行上述目标预设组件的展示和隐藏之前,在页面中可以先设置通用组件,将通用组件设置在页面的最顶层,并将定位方式设置为绝对定位方式。并且引入通用组件的全局事件广播器,全局事件广播器中设置事件监听执行模块,该事件监听执行模块在代码中可以通过“emitter.on(事件名称,方法)”调用,表示监听事件名称的事件,当监听到事件时可以拿到事件的数据并执行对应的方法,本公开实施例中事件名称的事件可以包括两种,一种为预设组件的展示事件,事件的数据可以为预设组件的配置信息,另一种为预设组件的隐藏事件,事件的数据可以为预设组件的组件标识,方法可以包括执行优先级条件的判断逻辑之后的展示操作或执行组件标识匹配逻辑的隐藏操作。可选的,全局事件广播器中还可以设置事件通知模块,该事件通知模块在代码中可以通过“emitter.on(事件名称,广播数据)”调用,表示通知一个事件名称的事件,并附带该事件的数据。
示例性的,图3为本公开实施例提供的另一种页面组件展示方法的流程示意图,如图3所示,在一种可行的实施方式中,在页面中展示目标预设组件之后,页面组件展示方法还可以包括:
步骤301、接收对目标预设组件的隐藏请求,通过全局事件广播器调用通用组件基于目标预设组件的组件标识在页面全局变量中进行匹配。
其中,隐藏请求可以为用于对目标预设组件进行隐藏的请求,隐藏请求中可以包括目标预设组件的组件标识。本公开实施例在每个需要展示预设组件的关联组件中均可以预先存储预设组件的配置信息,并引入对应的事件广播器能够在需要隐藏预设组件时调用事件广播器的事件通知模块将组件标识添加在隐藏请求中通知出去。
具体地,目标预设组件的展示位置所在关联组件当检测到用户对目标预设组件的隐藏触发操作之后,则确定此时需要隐藏目标预设组件,可以通过事件广播器将目标预设组件的隐藏请求作为一个事件通知出去,并附带有目标预设组件的组件标识;页面组件展示装置可以接收到该目标预设组件的隐藏请求,之后可以启动通用组件以及通用组件对应的全局事件广播器,将目标预设组件的隐藏请求发送出去;通用组件通过全局事件广播器中的监听模块在监听到目标预设组件的隐藏请求的事件之后,可以将目标预设组件的组件标识在页面全局变量中进行匹配,判断是否存在相同的组件标识。
步骤302、判断是否匹配成功,若是,则执行步骤303;否则,执行步骤304。
具体地,当目标预设组件的组件标识在页面全局变量中匹配成功,则说明存在相同的组件标识,也即该目标预设组件在页面上已经展示,可以执行步骤303;当目标预设组件的组件标识在页面全局变量中匹配失败,则说明不存在相同的组件标识,也即该目标预设组件在页面上没有展示,可以执行步骤304。
步骤303、隐藏目标预设组件。
具体地,页面组件展示装置可以在页面全局变量中删除目标杨树组件的配置信息,以在页面中隐藏目标预设组件。
步骤304、拒绝隐藏。
页面组件展示装置在目标预设组件并没有展示时,可以拒绝隐藏,不做任何操作。
上述方案中,通用组件中不仅可以设置预设组件展示时的优先级条件的判断逻辑,还可以设置预设组件隐藏时的组件标识匹配逻辑,能够在每个预设组件隐藏时调用通用组件执行匹配并隐藏,避免了针对每个预设组件中隐藏时的组件标识匹配逻辑的重复开发,降低了开发量、开发复杂度以及维护困难度。
本方案相较于相关技术,具有高效率、易用性、通用性和低能耗的优势,具体的,本方案将页面中预设组件的重复逻辑封装到通用组件内部,只需要在页面引入一次通用组件,不需要在页面的每个位置设置重复逻辑,提高开发效率,降低开发成本;开发时只需要关注预设组件显示和隐藏的时机,配置必要的属性,不需要关注和其他组件间的冲突问题,降低开发难度,提升易用性;通过多个配置属性,达到适配多种业务需求的目的,提高了通用性;在需要显示或者隐藏预设组件时触发通用组件执行一次事件即可,不需要在每个需要的位置执行重复逻辑,更加高效便捷;同时可以将引入的预设组件的数量控制在最低,降低了资源体积和用户的宽带消耗。
图4为本公开实施例提供的一种页面组件展示装置的结构示意图,该装置可由软件和/或硬件实现,一般可集成在电子设备中。如图4所示,该装置包括:
请求模块401,用于接收针对目标预设组件的展示请求,所述展示请求中包括所述目标预设组件的配置信息,所述目标预设组件为多个预设组件中的任意一个,所述预设组件表示具有提醒功能的组件;
展示模块402,用于调用通用组件基于所述目标预设组件的配置信息判断所述目标预设组件是否满足优先级条件,并在确定所述目标预设组件满足优先级条件之后在页面中展示所述目标预设组件。
可选的,所述请求模块401具体用于:
获取所述目标预设组件的展示位置所在关联组件发送的目标预设组件的展示请求,其中,所述目标预设组件的展示请求为所述关联组件响应于预设按键的展示和/或预设信息满足变化条件发送,所述预设按键、所述预设信息设置在所述关联组件中。
可选的,所述目标预设组件的配置信息包括组件标识、组件分类、优先级和展示位置。
可选的,所述展示模块402包括:
信息单元,用于通过全局事件广播器调用所述通用组件从页面全局变量中提取当前预设组件的配置信息,其中,所述当前预设组件在所述页面中展示,所述当前预设组件与所述目标预设组件的组件分类相同;
判断单元,用于根据所述当前预设组件的配置信息的提取结果以及所述目标预设组件的优先级与所述当前预设组件的优先级的对比结果,判断所述目标预设组件是否满足优先级条件。
可选的,所述展示模块402还包括优先级满足单元,用于:
当从所述页面全局变量中未提取到所述当前预设组件的配置信息,或者当从所述页面全局变量中提取到所述当前预设组件的配置信息并且所述对比结果为所述目标预设组件的优先级大于或等于所述当前预设组件的优先级,则确定所述目标预设组件满足优先级条件。
可选的,所述页面全局变量用于存储页面中正在显示的全部预设组件的配置信息。
可选的,所述装置还包括隐藏模块,用于:在页面中展示所述目标预设组件之后,
接收对所述目标预设组件的隐藏请求,通过全局事件广播器调用所述通用组件基于所述目标预设组件的组件标识在页面全局变量中进行匹配;
若匹配成功,则隐藏所述目标预设组件;否则拒绝隐藏。
可选的,所述通用组件设置在所述页面最顶层并通过全局事件广播器设置其执行逻辑。
可选的,所述全局事件广播器包括事件监听执行模块,所述事件监听模块用于监听所述预设组件的展示请求或隐藏请求并执行对应的展示操作或隐藏操作。
可选的,所述展示模块402还包括展示执行单元,用于:
根据所述目标预设组件的配置信息中的展示位置,以所述通用组件为参照物将所述目标预设组件展示在所述页面上,所述多个预设组件为所述通用组件的子元素,所述通用组件和各所述预设组件的定位方式为绝对定位方式。
可选的,所述预设组件包括引导组件、动画组件中的至少一种。
本公开实施例所提供的页面组件展示装置可执行本公开任意实施例所提供的页面组件展示方法,具备执行方法相应的功能模块和有益效果。
本公开实施例还提供了一种计算机程序产品,包括计算机程序/指令,该计算机程序/指令被处理器执行时实现本公开任意实施例所提供的页面组件展示方法。
图5为本公开实施例提供的一种电子设备的结构示意图。下面具体参考图5,其示出了适于用来实现本公开实施例中的电子设备500的结构示意图。本公开实施例中的电子设备500可以包括但不限于诸如移动电话、笔记本电脑、数字广播接收器、PDA(个人数字助理)、PAD(平板电脑)、PMP(便携式多媒体播放器)、车载终端(例如车载导航终端)等等的移动终端以及诸如数字TV、台式计算机等等的固定终端。图5示出的电子设备仅仅是一个示例,不应对本公开实施例的功能和使用范围带来任何限制。
如图5所示,电子设备500可以包括处理装置(例如中央处理器、图形处理器等)501,其可以根据存储在只读存储器(ROM)502中的程序或者从存储装置508加载到随机访问存储器(RAM)503中的程序而执行各种适当的动作和处理。在RAM 503中,还存储有电子设备500操作所需的各种程序和数据。处理装置501、ROM 502以及RAM503通过总线504彼此相连。输入/输出(I/O)接口505也连接至总线504。
通常,以下装置可以连接至I/O接口505:包括例如触摸屏、触摸板、键盘、鼠标、摄像头、麦克风、加速度计、陀螺仪等的输入装置506;包括例如液晶显示器(LCD)、扬声器、振动器等的输出装置507;包括例如磁带、硬盘等的存储装置508;以及通信装置509。通信装置509可以允许电子设备500与其他设备进行无线或有线通信以交换数据。虽然图5示出了具有各种装置的电子设备500,但是应理解的是,并不要求实施或具备所有示出的装置。可以替代地实施或具备更多或更少的装置。
特别地,根据本公开的实施例,上文参考流程图描述的过程可以被实现为计算机软件程序。例如,本公开的实施例包括一种计算机程序产品,其包括承载在非暂态计算机可读介质上的计算机程序,该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中,该计算机程序可以通过通信装置509从网络上被下载和安装,或者从存储装置508被安装,或者从ROM 502被安装。在该计算机程序被处理装置501执行时,执行本公开实施例的页面组件展示方法中限定的上述功能。
需要说明的是,本公开上述的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件,或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于:具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本公开中,计算机可读存储介质可以是任何包含或存储程序的有形介质,该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本公开中,计算机可读信号介质可以包括在基带中或者作为载波一部分传播的数据信号,其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式,包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读信号介质还可以是计算机可读存储介质以外的任何计算机可读介质,该计算机可读信号介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输,包括但不限于:电线、光缆、RF(射频)等等,或者上述的任意合适的组合。
在一些实施方式中,客户端、服务器可以利用诸如HTTP(HyperText TransferProtocol,超文本传输协议)之类的任何当前已知或未来研发的网络协议进行通信,并且可以与任意形式或介质的数字数据通信(例如,通信网络)互连。通信网络的示例包括局域网(“LAN”),广域网(“WAN”),网际网(例如,互联网)以及端对端网络(例如,ad hoc端对端网络),以及任何当前已知或未来研发的网络。
上述计算机可读介质可以是上述电子设备中所包含的;也可以是单独存在,而未装配入该电子设备中。
上述计算机可读介质承载有一个或者多个程序,当上述一个或者多个程序被该电子设备执行时,使得该电子设备:接收针对目标预设组件的展示请求,所述展示请求中包括所述目标预设组件的配置信息,所述目标预设组件为多个预设组件中的任意一个,所述预设组件表示具有提醒功能的组件;调用通用组件基于所述目标预设组件的配置信息判断所述目标预设组件是否满足优先级条件,并在确定所述目标预设组件满足优先级条件之后在页面中展示所述目标预设组件。
可以以一种或多种程序设计语言或其组合来编写用于执行本公开的操作的计算机程序代码,上述程序设计语言包括但不限于面向对象的程序设计语言—诸如Java、Smalltalk、C++,还包括常规的过程式程序设计语言—诸如“C”语言或类似的程序设计语言。程序代码可以完全地在用户计算机上执行、部分地在用户计算机上执行、作为一个独立的软件包执行、部分在用户计算机上部分在远程计算机上执行、或者完全在远程计算机或服务器上执行。在涉及远程计算机的情形中,远程计算机可以通过任意种类的网络——包括局域网(LAN)或广域网(WAN)—连接到用户计算机,或者,可以连接到外部计算机(例如利用因特网服务提供商来通过因特网连接)。
附图中的流程图和框图,图示了按照本公开各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上,流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分,该模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意,在有些作为替换的实现中,方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如,两个接连地表示的方框实际上可以基本并行地执行,它们有时也可以按相反的顺序执行,这依所涉及的功能而定。也要注意的是,框图和/或流程图中的每个方框、以及框图和/或流程图中的方框的组合,可以用执行规定的功能或操作的专用的基于硬件的系统来实现,或者可以用专用硬件与计算机指令的组合来实现。
描述于本公开实施例中所涉及到的单元可以通过软件的方式实现,也可以通过硬件的方式来实现。其中,单元的名称在某种情况下并不构成对该单元本身的限定。
本文中以上描述的功能可以至少部分地由一个或多个硬件逻辑部件来执行。例如,非限制性地,可以使用的示范类型的硬件逻辑部件包括:现场可编程门阵列(FPGA)、专用集成电路(ASIC)、专用标准产品(ASSP)、片上系统(SOC)、复杂可编程逻辑设备(CPLD)等等。
在本公开的上下文中,机器可读介质可以是有形的介质,其可以包含或存储以供指令执行系统、装置或设备使用或与指令执行系统、装置或设备结合地使用的程序。机器可读介质可以是机器可读信号介质或机器可读储存介质。机器可读介质可以包括但不限于电子的、磁性的、光学的、电磁的、红外的、或半导体系统、装置或设备,或者上述内容的任何合适组合。机器可读存储介质的更具体示例会包括基于一个或多个线的电气连接、便携式计算机盘、硬盘、随机存取存储器(RAM)、只读存储器(ROM)、可擦除可编程只读存储器(EPROM或快闪存储器)、光纤、便捷式紧凑盘只读存储器(CD-ROM)、光学储存设备、磁储存设备、或上述内容的任何合适组合。
以上描述仅为本公开的较佳实施例以及对所运用技术原理的说明。本领域技术人员应当理解,本公开中所涉及的公开范围,并不限于上述技术特征的特定组合而成的技术方案,同时也应涵盖在不脱离上述公开构思的情况下,由上述技术特征或其等同特征进行任意组合而形成的其它技术方案。例如上述特征与本公开中公开的(但不限于)具有类似功能的技术特征进行互相替换而形成的技术方案。
此外,虽然采用特定次序描绘了各操作,但是这不应当理解为要求这些操作以所示出的特定次序或以顺序次序执行来执行。在一定环境下,多任务和并行处理可能是有利的。同样地,虽然在上面论述中包含了若干具体实现细节,但是这些不应当被解释为对本公开的范围的限制。在单独的实施例的上下文中描述的某些特征还可以组合地实现在单个实施例中。相反地,在单个实施例的上下文中描述的各种特征也可以单独地或以任何合适的子组合的方式实现在多个实施例中。
尽管已经采用特定于结构特征和/或方法逻辑动作的语言描述了本主题,但是应当理解所附权利要求书中所限定的主题未必局限于上面描述的特定特征或动作。相反,上面所描述的特定特征和动作仅仅是实现权利要求书的示例形式。

Claims (14)

1.一种页面组件展示方法,其特征在于,包括:
接收针对目标预设组件的展示请求,所述展示请求中包括所述目标预设组件的配置信息,所述目标预设组件为多个预设组件中的任意一个,所述预设组件表示具有提醒功能的组件;
调用通用组件基于所述目标预设组件的配置信息判断所述目标预设组件是否满足优先级条件,并在确定所述目标预设组件满足优先级条件之后在页面中展示所述目标预设组件。
2.根据权利要求1所述的方法,其特征在于,接收针对目标预设组件的展示请求,包括:
获取所述目标预设组件的展示位置所在关联组件发送的目标预设组件的展示请求,其中,所述目标预设组件的展示请求为所述关联组件响应于预设按键的展示和/或预设信息满足变化条件发送,所述预设按键、所述预设信息设置在所述关联组件中。
3.根据权利要求1或2所述的方法,其特征在于,所述目标预设组件的配置信息包括组件标识、组件分类、优先级和展示位置。
4.根据权利要求3所述的方法,其特征在于,调用通用组件基于所述目标预设组件的配置信息判断所述目标预设组件是否满足优先级条件,包括:
通过全局事件广播器调用所述通用组件从页面全局变量中提取当前预设组件的配置信息,其中,所述当前预设组件在所述页面中展示,所述当前预设组件与所述目标预设组件的组件分类相同;
根据所述当前预设组件的配置信息的提取结果以及所述目标预设组件的优先级与所述当前预设组件的优先级的对比结果,判断所述目标预设组件是否满足优先级条件。
5.根据权利要求4所述的方法,其特征在于,确定所述目标预设组件满足优先级条件,包括:
当从所述页面全局变量中未提取到所述当前预设组件的配置信息,或者当从所述页面全局变量中提取到所述当前预设组件的配置信息并且所述对比结果为所述目标预设组件的优先级大于或等于所述当前预设组件的优先级,则确定所述目标预设组件满足优先级条件。
6.根据权利要求4或5所述的方法,其特征在于,所述页面全局变量用于存储页面中正在显示的全部预设组件的配置信息。
7.根据权利要求3所述的方法,其特征在于,在页面中展示所述目标预设组件之后,所述方法还包括:
接收对所述目标预设组件的隐藏请求,通过全局事件广播器调用所述通用组件基于所述目标预设组件的组件标识在页面全局变量中进行匹配;
若匹配成功,则隐藏所述目标预设组件;否则拒绝隐藏。
8.根据权利要求1所述的方法,其特征在于,所述通用组件设置在所述页面最顶层并通过全局事件广播器设置其执行逻辑。
9.根据权利要求8所述的方法,其特征在于,所述全局事件广播器包括事件监听执行模块,所述事件监听模块用于监听所述预设组件的展示请求或隐藏请求并执行对应的展示操作或隐藏操作。
10.根据权利要求3所述的方法,其特征在于,在页面中展示所述目标预设组件,包括:
根据所述目标预设组件的配置信息中的展示位置,以所述通用组件为参照物将所述目标预设组件展示在所述页面上,所述多个预设组件为所述通用组件的子元素,所述通用组件和各所述预设组件的定位方式为绝对定位方式。
11.根据权利要求1-10中任一所述的方法,其特征在于,所述预设组件包括引导组件、动画组件中的至少一种。
12.一种页面组件展示装置,其特征在于,包括:
请求模块,用于接收针对目标预设组件的展示请求,所述展示请求中包括所述目标预设组件的配置信息,所述目标预设组件为多个预设组件中的任意一个,所述预设组件表示具有提醒功能的组件;
展示模块,用于调用通用组件基于所述目标预设组件的配置信息判断所述目标预设组件是否满足优先级条件,并在确定所述目标预设组件满足优先级条件之后在页面中展示所述目标预设组件。
13.一种电子设备,其特征在于,所述电子设备包括:
处理器;
用于存储所述处理器可执行指令的存储器;
所述处理器,用于从所述存储器中读取所述可执行指令,并执行所述指令以实现上述权利要求1-11中任一所述的页面组件展示方法。
14.一种计算机可读存储介质,其特征在于,所述存储介质存储有计算机程序,所述计算机程序用于执行上述权利要求1-11中任一所述的页面组件展示方法。
CN202210246168.5A 2022-03-14 2022-03-14 一种页面组件展示方法、装置、设备及介质 Pending CN114594985A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202210246168.5A CN114594985A (zh) 2022-03-14 2022-03-14 一种页面组件展示方法、装置、设备及介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202210246168.5A CN114594985A (zh) 2022-03-14 2022-03-14 一种页面组件展示方法、装置、设备及介质

Publications (1)

Publication Number Publication Date
CN114594985A true CN114594985A (zh) 2022-06-07

Family

ID=81817950

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202210246168.5A Pending CN114594985A (zh) 2022-03-14 2022-03-14 一种页面组件展示方法、装置、设备及介质

Country Status (1)

Country Link
CN (1) CN114594985A (zh)

Similar Documents

Publication Publication Date Title
CN111414498B (zh) 多媒体信息推荐方法、装置及电子设备
CN113938456B (zh) 会话消息置顶处理方法和装置
CN110658961B (zh) 信息显示方法、装置和电子设备
CN112528595B (zh) 文档处理方法、装置和电子设备
CN109684589B (zh) 客户端的评论数据的处理方法、装置及计算机存储介质
CN111190520A (zh) 菜单项选择方法、装置、可读介质及电子设备
CN111488185A (zh) 页面数据处理方法、装置、电子设备和可读介质
CN111596991A (zh) 交互操作执行方法、装置和电子设备
CN115470432A (zh) 一种页面渲染方法、装置、电子设备及计算机可读介质
CN111723309A (zh) 用于网页搜索的方法和装置
CN111552620B (zh) 数据获取方法、装置、终端及存储介质
CN110069186B (zh) 显示应用的操作界面的方法和设备
CN110717126A (zh) 页面浏览方法、装置、电子设备及计算机可读存储介质
CN110619101B (zh) 用于处理信息的方法和装置
CN115793911A (zh) 数据处理方法、装置、电子设备及存储介质
CN115379245B (zh) 信息显示方法、装置和电子设备
CN111353296B (zh) 文章处理方法、装置、电子设备及计算机可读存储介质
CN111274513B (zh) 窗口显示方法、装置、终端及存储介质
CN114594985A (zh) 一种页面组件展示方法、装置、设备及介质
CN114063795A (zh) 一种交互方法、装置、电子设备和存储介质
CN112162682A (zh) 内容显示方法、装置、电子设备及计算机可读存储介质
CN111787043A (zh) 数据请求方法和装置
CN115314456B (zh) 交互方法、装置和电子设备
CN111310031B (zh) 房源信息展示方法、装置、终端及存储介质
CN112965778B (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