CN113885960A - 小程序页面的处理方法、装置、电子设备和存储介质 - Google Patents
小程序页面的处理方法、装置、电子设备和存储介质 Download PDFInfo
- Publication number
- CN113885960A CN113885960A CN202111171505.0A CN202111171505A CN113885960A CN 113885960 A CN113885960 A CN 113885960A CN 202111171505 A CN202111171505 A CN 202111171505A CN 113885960 A CN113885960 A CN 113885960A
- Authority
- CN
- China
- Prior art keywords
- target view
- positioning
- view element
- page
- location
- 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.)
- Granted
Links
- 238000000034 method Methods 0.000 title claims abstract description 59
- 238000012545 processing Methods 0.000 title claims abstract description 34
- 238000009877 rendering Methods 0.000 claims abstract description 34
- 230000000007 visual effect Effects 0.000 claims abstract description 29
- 230000008569 process Effects 0.000 claims abstract description 19
- 238000012544 monitoring process Methods 0.000 claims abstract description 17
- 238000004590 computer program Methods 0.000 claims description 10
- 230000004044 response Effects 0.000 claims description 10
- 239000000126 substance Substances 0.000 claims 1
- 230000000694 effects Effects 0.000 abstract description 9
- 238000003672 processing method Methods 0.000 abstract description 8
- 238000005516 engineering process Methods 0.000 description 9
- 238000004891 communication Methods 0.000 description 8
- 238000010586 diagram Methods 0.000 description 7
- 238000013473 artificial intelligence Methods 0.000 description 5
- 230000006870 function Effects 0.000 description 3
- 230000004048 modification Effects 0.000 description 3
- 238000012986 modification Methods 0.000 description 3
- 230000003287 optical effect Effects 0.000 description 3
- 230000006978 adaptation Effects 0.000 description 2
- 230000003993 interaction Effects 0.000 description 2
- 238000010801 machine learning Methods 0.000 description 2
- 238000005096 rolling process Methods 0.000 description 2
- 238000001179 sorption measurement Methods 0.000 description 2
- 230000001960 triggered effect Effects 0.000 description 2
- 238000003491 array Methods 0.000 description 1
- 230000006399 behavior Effects 0.000 description 1
- 238000004364 calculation method Methods 0.000 description 1
- 230000001413 cellular effect Effects 0.000 description 1
- 238000010276 construction Methods 0.000 description 1
- 238000013135 deep learning Methods 0.000 description 1
- 230000007547 defect Effects 0.000 description 1
- 238000013461 design Methods 0.000 description 1
- 238000011161 development Methods 0.000 description 1
- 230000006872 improvement Effects 0.000 description 1
- 239000004973 liquid crystal related substance Substances 0.000 description 1
- 238000007726 management method Methods 0.000 description 1
- 238000003058 natural language processing Methods 0.000 description 1
- 239000013307 optical fiber Substances 0.000 description 1
- 239000004065 semiconductor Substances 0.000 description 1
- 230000001953 sensory effect Effects 0.000 description 1
- 238000006467 substitution reaction Methods 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements 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/44—Arrangements for executing specific programs
- G06F9/445—Program loading or initiating
- G06F9/44568—Immediately runnable code
-
- 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/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
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements 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/44—Arrangements for executing specific programs
- G06F9/451—Execution arrangements for user interfaces
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Software Systems (AREA)
- General Engineering & Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Human Computer Interaction (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本公开提供了一种小程序页面的处理方法、装置、电子设备和存储介质，涉及计算机技术领域，具体涉及小程序技术领域。具体实现方案为：响应于第一滚动事件，对小程序的展示页面调整可视区域的位置，在调整过程中，对展示页面的目标视图容器中包含粘性定位属性的目标视图元素监测相对可视区域的第一位置，在目标视图元素的第一位置和对应的粘性定位属性指示的定位位置匹配的情况下，根据定位位置，对目标视图元素定位，调用渲染引擎对定位后的目标视图元素进行渲染展示，通过小程序在页面处理时调用粘性定位属性指示的定位位置，对目标视图元素进行定位，并调用对应的渲染引擎进行渲染展示，实现了适配多种渲染引擎，提高了渲染效果。
Description
技术领域
本公开涉及计算机技术领域，具体涉及小程序技术领域，尤其涉及小程序页面的处理方法、装置、电子设备和存储介质。
背景技术
随着小程序的不断发展，小程序的使用场景越来越丰富。小程序的页面的渲染方式一直使用网页视图webview的方式进行页面的绘制。而在低端设备或者车载系统上使用webview的方式进行页面的绘制并进行粘性布局时，页面渲染并不流畅，因此，为了提升小程序页面的渲染性能，需要支持本地化应用视图(Native Application Program，NA)view的方式在渲染小程序页面的过程中实现粘性布局效果。
发明内容
本公开提供了一种小程序页面的处理方法、装置、电子设备和存储介质。
根据本公开的一方面，提供了一种小程序页面的处理方法，包括：
响应于第一滚动事件，对小程序的展示页面调整可视区域的位置；
在调整过程中，对所述展示页面的目标视图容器中包含粘性定位属性的目标视图元素监测相对可视区域的第一位置；
在所述目标视图元素的第一位置和对应的粘性定位属性指示的定位位置匹配的情况下，根据所述定位位置，对所述目标视图元素定位；
调用渲染引擎对定位后的目标视图元素进行渲染展示。
根据本公开的另一方面，提供了一种小程序页面的处理装置，包括：
调整模块，用于响应于第一滚动事件，对小程序的展示页面调整可视区域的位置；
监测模块，用于在调整过程中，对所述展示页面的目标视图容器中包含粘性定位属性的目标视图元素监测相对可视区域的第一位置；
定位模块，用于在所述目标视图元素的第一位置和对应的粘性定位属性指示的定位位置匹配的情况下，根据所述定位位置，对所述目标视图元素定位；
渲染模块，用于调用渲染引擎对定位后的目标视图元素进行渲染展示。
根据本公开的另一方面，提供了一种电子设备，包括：
至少一个处理器；以及与所述至少一个处理器通信连接的存储器；其中，所述存储器存储有可被所述至少一个处理器执行的指令，所述指令被所述至少一个处理器执行，以使所述至少一个处理器能够执行前述一方面所述方法的步骤。
根据本公开的另一方面，提供了一种存储有计算机指令的非瞬时计算机可读存储介质，其中，所述计算机指令用于使所述计算机执行前述一方面所述方法的步骤。
根据本公开的另一方面，提供了一种计算机程序产品，包括计算机指令，所述计算机指令在被处理器执行时实现前述一方面所述方法的步骤。
应当理解，本部分所描述的内容并非旨在标识本公开的实施例的关键或重要特征，也不用于限制本公开的范围。本公开的其它特征将通过以下的说明书而变得容易理解。
附图说明
附图用于更好地理解本方案，不构成对本公开的限定。其中：
图1为本公开实施例所提供的一种小程序页面的处理方法的流程示意图；
图2为本公开实施例提供的另一种小程序页面的处理方法的流程示意图；
图3为本公开实施例提供的一种小程序页面的粘性布局示意图之一；
图4为本公开实施例提供的一种小程序页面的粘性布局示意图之二；
图5为本公开实施例提供的另一种小程序页面的处理方法的流程示意图；
图6为本公开实施例提供的一种小程序页面的处理装置的结构示意图；
图7示出了可以用来实施本公开的实施例的示例电子设备700的示意性框图。
具体实施方式
以下结合附图对本公开的示范性实施例做出说明，其中包括本公开实施例的各种细节以助于理解，应当将它们认为仅仅是示范性的。因此，本领域普通技术人员应当认识到，可以对这里描述的实施例做出各种改变和修改，而不会背离本公开的范围和精神。同样，为了清楚和简明，以下的描述中省略了对公知功能和结构的描述。
下面参考附图描述本公开实施例的小程序页面的处理方法、装置、电子设备和存储介质。
图1为本公开实施例所提供的一种小程序页面的处理方法的流程示意图。
如图1所示，该方法包含以下步骤：
步骤101，响应于第一滚动事件，对小程序的展示页面调整可视区域的位置。
本公开实施例的执行主体为小程序页面处理装置，该小程序页面处理装置设置在任意的用户终端，用户终端可以为手机、掌上电脑等。
本公开实施例中，小程序监测页面的滚动事件，在监测到发生滚动事件时，响应于第一滚动事件，对小程序的展示页面调整可视区域的位置，也就是说随着页面的滚动，当前展示的可视区域的位置随着页面的滚动发生了移动，也就是说页面可视区域内展示的内容随着页面的滚动发生变化，而可视区域和用户终端的视窗是对应的。
实际应用中，页面垂直方向的滚动居多，因此，本公开实施例中以垂直方向为例对本公开的技术方案进行说明。从而，第一滚动事件，即为垂直方向的滚动事件，垂直方向的滚动事件包含垂直向下的滚动和垂直向上的滚动，通常，用户通过下拉滚动条滚动页面以获取信息，本公开实施例中以第一滚动事件为滚动条下拉，页面向上滚动为例进行说明。
其中，本公开的技术方案中，所涉及的用户个人信息的获取，存储和应用等，均符合相关法律法规的规定，且不违背公序良俗。
步骤102，在调整过程中，对展示页面的目标视图容器中包含粘性定位属性的目标视图元素监测相对可视区域的第一位置。
其中，目标视图容器是因滚动触发了第一滚动事件的视图容器，其中包含多个视图元素或组件。
本公开实施例中，小程序的框架层已经设置了粘性定位属性，也就是说展示页面中各视图元素已经在css的属性中写入粘性定位属性，即position:sticky。其中，position:sticky的粘性定位表现为当视图元素在可视区域中时，视图元素位置时相对的，当视图元素在可视区域外部时，元素位置固定。从而在监听到滚动事件时，可查询滚动的目标视图容器中的各视图元素是否存在包含粘性定位属性，将包含粘性定位属性的视图元素称为目标视图元素，即为在小程序的展示页面滚动的过程中，固定在设定位置，实现页面吸附效果的页面元素。由于包含粘性定位属性的目标视图容器需要进行粘性定位，因此，需要监测目标视图元素相对可视区域的第一位置，以确定是否需要触发对目标视图元素进行定位，其中，对目标视图元素粘性定位后，目标视图元素则定位在粘贴定位属性指示的位置，不再随目标视图容器的滚动而移出可视区域，实现目标视图元素的吸附效果。
需要说明的是，目标视图元素相对可视区域的第一位置，可以是目标视图元素相对可视区域的任一边缘的第一位置，例如，是目标视图元素相对可视区域的顶部边缘的第一位置。
步骤103，在目标视图元素的第一位置和对应的粘性定位属性指示的定位位置匹配的情况下，根据定位位置，对目标视图元素定位。
本公开实施例中，在目标视图容器滚动的过程中，在监测到目标视图元素相对可视区域的第一位置和定位位置匹配的情况下，则认为目标视图元素需要进行定位，则根据定位位置，将目标视图元素定位在定位位置。
步骤104，调用渲染引擎对定位后的目标视图元素进行渲染展示。
本公开实施例中，小程序调用渲染引擎，例如为NAview的渲染方式对定位后的目标视图元素进行渲染展示，通过能适配NAview的渲染方式，可对粘性定位后的视图元素进行渲染，提高了页面渲染的效果。
本公开实施例的小程序页面的处理方法中，响应于第一滚动事件，对小程序的展示页面调整可视区域的位置，在调整过程中，对展示页面的目标视图容器中包含粘性定位属性的目标视图元素监测相对可视区域的第一位置，在目标视图元素的第一位置和对应的粘性定位属性指示的定位位置匹配的情况下，根据定位位置，对目标视图元素定位，调用渲染引擎对定位后的目标视图元素进行渲染展示，通过在小程序内部程序框架层增加粘性定位属性，使得小程序在页面处理时可以调用粘性定位属性指示的定位位置，对目标视图元素进行定位，并调用对应的渲染引擎进行渲染展示，实现了适配多种渲染引擎，提高了渲染效果。
基于上述实施例，图2为本公开实施例提供的另一种小程序页面的处理方法的流程示意图，如图2所示，该方法包含以下步骤：
步骤201，响应于第一滚动事件，对小程序的展示页面调整可视区域的位置。
步骤202，在调整过程中，对展示页面的目标视图容器中包含粘性定位属性的目标视图元素，监测相对可视区域的第一位置。
步骤201和步骤202可参照前述实施例的中解释说明，原理相同，本实施例中不再赘述。
步骤203，获取目标视图元素在目标视图容器中的第二位置。
本公开实施例中，目标视图元素在目标视图容器中具有一个位置，为了便于区分，称为第二位置。
步骤204，在第一位置和定位位置的距离小于或等于零的情况下，将目标视图元素从第二位置移除。
本公开实施例中，在目标视图元素相对可视区域的第一位置和该目标视图元素的粘贴定位属性指示的定位位置间的距离小于或等于零的情况下，则认为目标视图元素需要进行粘性定位，为了避免目标视图元素随着目标视图容器的移动而移动，将目标视图元素从第二位置移除。
步骤205，将目标视图元素设置于可视区域中的定位位置。
本公开实施例中，将目标视图元素从第二位置移除，并将目标视图元素设置于可视区域中的定位位置，以实现将目标视图元素在定位位置进行固定，不随页面的滚动而移动出可视区域。
如图3所示，页面的滚动轴向下，页面向上滚动，实际应用中，页面的根容器中会包含多个子容器，本公开实施例的目标容器可以为根容器或者为子容器，本公开实施例中，以存在滚动的为子容器为例进行说明，结合图3和图4进行说明，为简化说明，由于页面中存在滚动的视图容器通常为一个，图3中仅示出当前滚动的一个视图容器进行说明。如图3所示，视图元素A是视图元素B均为设置了粘贴属性的视图元素，在视图容器滚动的过程中，视图容器中的各个视图元素和视图元素的子元素均进行滚动，作为一种实现方式，首选监测视图元素A相对可视区域顶部边缘的第一位置，第一位置随着展示页面的滚动，如图3中的2图所示，第一位置距离可视区域顶部边缘的第一位置越来越近，在监测到第一位置距离顶部边缘的位置和粘贴属性指示的定位位置间的距离小于或等于零的情况下，如图4所示，将视图元素B从对应的视图容器中的固定位置删除，将视图元素B固定在根容器中，即将视图元素B固定在定位位置，如图3中的3图所示，视图元素B不再随页面的滚动而移动，不会随所属的视图容器的滚动而移出可视区域。
需要说明的是，对于视图容器中的其它视图元素的粘贴定位方式原理相同。其中，不同视图元素粘贴定位的位置可以是不同的，若粘贴定位位置相同，则后一个视图元素会覆盖前一个视图元素的定位位置。
本公开实施例的一种实现方式中，定位位置包含水平方向的位置和垂直方向的位置，根据水平方向的位置和垂直方向的位置，可确定目标视图元素在可视区域中的准确位置，例如，在目标视图元素在可视区域顶部粘贴定位的时候，还可以根据水平方向的位置，确定目标视图元素距离可视区域的两侧边的距离，以实现目标视图元素的准确定位。
步骤206，调用渲染引擎对定位后的目标视图元素进行渲染展示。
具体地，可参照前述实施例中的解释说明，原理相同，本实施例中不再赘述。
本公开实施例的小程序页面的处理方法中，响应于第一滚动事件，对小程序的展示页面调整可视区域的位置，在调整过程中，对展示页面的目标视图容器中包含粘性定位属性的目标视图元素监测相对可视区域的第一位置，获取目标视图元素在目标视图容器中的第二位置，在第一位置和定位位置的距离小于或等于零的情况下，将目标视图元素从第二位置移除，将目标视图元素设置于可视区域中的定位位置，将目标视图元素从第二位置移除，并将目标视图元素设置于可视区域中的定位位置，以实现将目标视图元素在定位位置进行固定，不随页面的滚动而移动出可视区域，实现了粘性定位，并调用对应的渲染引擎进行渲染展示，实现了适配多种渲染引擎，提高了渲染效果。
基于上述实施例，上述实施例中是说明了在页面滚动过程中，具有粘贴属性的目标视图元素可以进行粘贴定位，而在页面反向滚动的过程中，当目标视图元素的容器又滚动回可视区域中后，则将目标视图元素恢复至目标视图容器中。
基于上述实施例，图5为本公开实施例提供的另一种小程序页面的处理方法的流程示意图，如图5所示，步骤104之后，还包括以下步骤：
步骤501，响应于第二滚动事件，对小程序的展示页面调整可视区域的位置。
本公开实施例中，第二滚动事件对应的滚动方向和第一滚动事件的对应的滚动方向相反，例如，第一滚动事件是页面向上滚动的滚动事件，则第二滚动事件则为反向的页面向下的滚动事件。本实施例中，以第二滚动事件为页面向下滚动为例进行说明。
步骤502，在调整过程中，监测目标视图元素在目标视图容器中的第二位置相对于定位位置之间的距离。
本公开实施例中，目标视图元素在目标视图容器中的第二位置，是目标视图元素和目标视图容器的相对位置，该第二位置也可以指示目标视图元素在整个展示页面中的位置，在展示页面向下滚动的过程中，监测第二位置相对定位位置间的距离，该距离越来越小。
步骤503，在该距离小于或等于零的情况下，将目标视图元素从定位位置移除。
步骤504，将目标视图元素恢复至目标视图容器中的第二位置。
本公开实施例中，在监测到目标视图元素在目标视图容器中的第二位置相对于定位位置之间的距离小于或等于零的情况下，将目标视图元素从定位位置移除，并将目标视图元素恢复至目标视图容器中的第二位置，以使得目标视图元素定位在目标视图容器中的第二位置，并调用渲染引擎，例如NAview对恢复后的目标视图元素进行渲染展示。
本公开实施例的小程序页面的处理方法中，响应于第二滚动事件，对小程序的展示页面调整可视区域的位置，在调整过程中，监测目标视图元素在目标视图容器中的第二位置相对于定位位置之间的距离，在该距离小于或等于零的情况下，将目标视图元素从定位位置移除，将目标视图元素恢复至目标视图容器中的第二位置，并调用渲染引擎对定位后的目标视图元素进行渲染展示，使得页面在滚动过程中，可以实现粘性定位，也可以实现相对固定，提高了页面的展示效果。
基于上述实施例，本公开实施例的一种实现方式中，为了提高页面调整的准确性，监测目标视图元素在目标视图容器中的第二位置相对于定位位置之间的距离之前，可监测目标视图容器相对于可视区域的第四位置，并确定第四位置处于可视区域，在目标视图容器的第四位置处于可视区域的情况下，说明目标视图容器已经部分展示或全部展示在可视区域中，此时，开启对目标视图元素在目标视图容器中的第二位置相对于定位位置之间的距离，可提高了目标视图元素定位的可靠性。
为了实现上述实施例，本实施例提供了一种小程序页面的处理装置。
图6为本公开实施例提供的一种小程序页面的处理装置的结构示意图，如图6所示，该装置包含：
调整模块61，用于响应于第一滚动事件，对小程序的展示页面调整可视区域的位置。
监测模块62，用于在调整过程中，对所述展示页面的目标视图容器中包含粘性定位属性的目标视图元素监测相对可视区域的第二位置。
定位模块63，用于在所述目标视图元素的第二位置和对应的粘性定位属性指示的定位位置匹配的情况下，根据所述定位位置，对所述目标视图元素定位。
渲染模块64，用于调用渲染引擎对定位后的目标视图元素进行渲染展示。
进一步，在本申请实施例的一种实现方式中，定位模块63，具体用于：
获取所述目标视图元素在所述目标视图容器中的第二位置；
在所述第一位置和所述定位位置的距离小于或等于零的情况下，将所述目标视图元素从所述第二位置移除；
将所述目标视图元素设置于所述可视区域中的所述定位位置。
在本申请实施例的一种实现方式中，所述装置，还包括：
调整模块61，还用于响应于第二滚动事件，对小程序的展示页面调整可视区域的位置。
监测模块62，还用于在调整过程中，监测所述目标视图元素在所述目标视图容器中的第二位置相对于定位位置之间的距离。
处理模块，用于在所述距离小于或等于零的情况下，将所述目标视图元素从所述定位位置移除；将所述目标视图元素恢复至所述目标视图容器中的第二位置。
在本申请实施例的一种实现方式中，所述装置，还包括：
监测模块62，还用于监测所述目标视图容器相对于可视区域的第四位置。
确定模块，用于确定所述第四位置处于可视区域。
在本申请实施例的一种实现方式中，其中，所述粘性定位属性指示的定位位置包含水平方向的位置和垂直方向的位置。
需要理解的是，前述方法实施例中的解释说明也适用于本实施例的中的装置，原理相同，本实施例中不再赘述。
本公开实施例的小程序页面的处理装置中，响应于第一滚动事件，对小程序的展示页面调整可视区域的位置，在调整过程中，对展示页面的目标视图容器中包含粘性定位属性的目标视图元素监测相对可视区域的第一位置，在目标视图元素的第一位置和对应的粘性定位属性指示的定位位置匹配的情况下，根据定位位置，对目标视图元素定位，调用渲染引擎对定位后的目标视图元素进行渲染展示，通过在小程序内部程序框架层增加粘性定位属性，使得小程序在页面处理时可以调用粘性定位属性指示的定位位置，对目标视图元素进行定位，并调用对应的渲染引擎进行渲染展示，实现了适配多种渲染引擎，提高了渲染效果。
为了实现上述实施例，本公开实施例还提供了一种电子设备，包括：
至少一个处理器；以及与所述至少一个处理器通信连接的存储器；其中，所述存储器存储有可被所述至少一个处理器执行的指令，所述指令被所述至少一个处理器执行，以使所述至少一个处理器能够执行前述方法实施例所述方法的步骤。
为了实现上述实施例，本公开实施例还提供了一种存储有计算机指令的非瞬时计算机可读存储介质，其中，所述计算机指令用于使所述计算机执行前述方法实施例所述方法的步骤。
为了实现上述实施例，本公开实施例还提供了一种计算机程序产品，包括计算机指令，所述计算机指令在被处理器执行时实现前述方法实施例所述方法的步骤。
根据本公开的实施例，本公开还提供了一种电子设备、一种可读存储介质和一种计算机程序产品。
图7示出了可以用来实施本公开的实施例的示例电子设备700的示意性框图。电子设备旨在表示各种形式的数字计算机，诸如，膝上型计算机、台式计算机、工作台、个人数字助理、服务器、刀片式服务器、大型计算机、和其它适合的计算机。电子设备还可以表示各种形式的移动装置，诸如，个人数字处理、蜂窝电话、智能电话、可穿戴设备和其它类似的计算装置。本文所示的部件、它们的连接和关系、以及它们的功能仅仅作为示例，并且不意在限制本文中描述的和/或者要求的本公开的实现。
如图7所示，设备700包括计算单元701，其可以根据存储在ROM(Read-OnlyMemory，只读存储器)702中的计算机程序或者从存储单元708加载到RAM(Random AccessMemory，随机访问/存取存储器)703中的计算机程序，来执行各种适当的动作和处理。在RAM703中，还可存储设备700操作所需的各种程序和数据。计算单元701、ROM 702以及RAM703通过总线704彼此相连。I/O(Input/Output，输入/输出)接口705也连接至总线704。
设备700中的多个部件连接至I/O接口705，包括：输入单元706，例如键盘、鼠标等；输出单元707，例如各种类型的显示器、扬声器等；存储单元708，例如磁盘、光盘等；以及通信单元709，例如网卡、调制解调器、无线通信收发机等。通信单元709允许设备700通过诸如因特网的计算机网络和/或各种电信网络与其他设备交换信息/数据。
计算单元701可以是各种具有处理和计算能力的通用和/或专用处理组件。计算单元701的一些示例包括但不限于CPU(Central Processing Unit，中央处理单元)、GPU(Graphic Processing Units，图形处理单元)、各种专用的AI(Artificial Intelligence，人工智能)计算芯片、各种运行机器学习模型算法的计算单元、DSP(Digital SignalProcessor，数字信号处理器)、以及任何适当的处理器、控制器、微控制器等。计算单元701执行上文所描述的各个方法和处理，例如小程序页面的处理方法。例如，在一些实施例中，小程序页面的处理方法可被实现为计算机软件程序，其被有形地包含于机器可读介质，例如存储单元708。在一些实施例中，计算机程序的部分或者全部可以经由ROM 702和/或通信单元709而被载入和/或安装到设备700上。当计算机程序加载到RAM703并由计算单元701执行时，可以执行上文描述的小程序页面的处理方法的一个或多个步骤。备选地，在其他实施例中，计算单元701可以通过其他任何适当的方式(例如，借助于固件)而被配置为执行小程序页面的处理方法。
本文中以上描述的系统和技术的各种实施方式可以在数字电子电路系统、集成电路系统、FPGA(Field Programmable Gate Array，现场可编程门阵列)、ASIC(Application-Specific Integrated Circuit，专用集成电路)、ASSP(Application Specific StandardProduct，专用标准产品)、SOC(System On Chip，芯片上系统的系统)、CPLD(ComplexProgrammable Logic Device，复杂可编程逻辑设备)、计算机硬件、固件、软件、和/或它们的组合中实现。这些各种实施方式可以包括：实施在一个或者多个计算机程序中，该一个或者多个计算机程序可在包括至少一个可编程处理器的可编程系统上执行和/或解释，该可编程处理器可以是专用或者通用可编程处理器，可以从存储系统、至少一个输入装置、和至少一个输出装置接收数据和指令，并且将数据和指令传输至该存储系统、该至少一个输入装置、和该至少一个输出装置。
用于实施本公开的方法的程序代码可以采用一个或多个编程语言的任何组合来编写。这些程序代码可以提供给通用计算机、专用计算机或其他可编程数据处理装置的处理器或控制器，使得程序代码当由处理器或控制器执行时使流程图和/或框图中所规定的功能/操作被实施。程序代码可以完全在机器上执行、部分地在机器上执行，作为独立软件包部分地在机器上执行且部分地在远程机器上执行或完全在远程机器或服务器上执行。
在本公开的上下文中，机器可读介质可以是有形的介质，其可以包含或存储以供指令执行系统、装置或设备使用或与指令执行系统、装置或设备结合地使用的程序。机器可读介质可以是机器可读信号介质或机器可读储存介质。机器可读介质可以包括但不限于电子的、磁性的、光学的、电磁的、红外的、或半导体系统、装置或设备，或者上述内容的任何合适组合。机器可读存储介质的更具体示例会包括基于一个或多个线的电气连接、便携式计算机盘、硬盘、RAM、ROM、EPROM(Electrically Programmable Read-Only-Memory，可擦除可编程只读存储器)或快闪存储器、光纤、CD-ROM(Compact Disc Read-Only Memory，便捷式紧凑盘只读存储器)、光学储存设备、磁储存设备、或上述内容的任何合适组合。
为了提供与用户的交互，可以在计算机上实施此处描述的系统和技术，该计算机具有：用于向用户显示信息的显示装置(例如，CRT(Cathode-Ray Tube，阴极射线管)或者LCD(Liquid Crystal Display，液晶显示器)监视器)；以及键盘和指向装置(例如，鼠标或者轨迹球)，用户可以通过该键盘和该指向装置来将输入提供给计算机。其它种类的装置还可以用于提供与用户的交互；例如，提供给用户的反馈可以是任何形式的传感反馈(例如，视觉反馈、听觉反馈、或者触觉反馈)；并且可以用任何形式(包括声输入、语音输入或者、触觉输入)来接收来自用户的输入。
可以将此处描述的系统和技术实施在包括后台部件的计算系统(例如，作为数据服务器)、或者包括中间件部件的计算系统(例如，应用服务器)、或者包括前端部件的计算系统(例如，具有图形用户界面或者网络浏览器的用户计算机，用户可以通过该图形用户界面或者该网络浏览器来与此处描述的系统和技术的实施方式交互)、或者包括这种后台部件、中间件部件、或者前端部件的任何组合的计算系统中。可以通过任何形式或者介质的数字数据通信(例如，通信网络)来将系统的部件相互连接。通信网络的示例包括：LAN(LocalArea Network，局域网)、WAN(Wide Area Network，广域网)、互联网和区块链网络。
计算机系统可以包括客户端和服务器。客户端和服务器一般远离彼此并且通常通过通信网络进行交互。通过在相应的计算机上运行并且彼此具有客户端-服务器关系的计算机程序来产生客户端和服务器的关系。服务器可以是云服务器，又称为云计算服务器或云主机，是云计算服务体系中的一项主机产品，以解决了传统物理主机与VPS服务("Virtual Private Server"，或简称"VPS")中，存在的管理难度大，业务扩展性弱的缺陷。服务器也可以为分布式系统的服务器，或者是结合了区块链的服务器。
其中，需要说明的是，人工智能是研究使计算机来模拟人的某些思维过程和智能行为(如学习、推理、思考、规划等)的学科，既有硬件层面的技术也有软件层面的技术。人工智能硬件技术一般包括如传感器、专用人工智能芯片、云计算、分布式存储、大数据处理等技术；人工智能软件技术主要包括计算机视觉技术、语音识别技术、自然语言处理技术以及机器学习/深度学习、大数据处理技术、知识图谱技术等几大方向。
应该理解，可以使用上面所示的各种形式的流程，重新排序、增加或删除步骤。例如，本公开中记载的各步骤可以并行地执行也可以顺序地执行也可以不同的次序执行，只要能够实现本公开公开的技术方案所期望的结果，本文在此不进行限制。
上述具体实施方式，并不构成对本公开保护范围的限制。本领域技术人员应该明白的是，根据设计要求和其他因素，可以进行各种修改、组合、子组合和替代。任何在本公开的精神和原则之内所作的修改、等同替换和改进等，均应包含在本公开保护范围之内。
Claims (13)
1.一种小程序页面的处理方法，包括：
响应于第一滚动事件，对小程序的展示页面调整可视区域的位置；
在调整过程中，对所述展示页面的目标视图容器中包含粘性定位属性的目标视图元素监测相对可视区域的第一位置；
在所述目标视图元素的第一位置和对应的粘性定位属性指示的定位位置匹配的情况下，根据所述定位位置，对所述目标视图元素定位；
调用渲染引擎对定位后的目标视图元素进行渲染展示。
2.如权利要求1所述的方法，所述在所述目标视图元素的第一位置和对应的粘性定位属性指示的定位位置匹配的情况下，根据所述定位位置，对所述目标视图元素定位，包括：
获取所述目标视图元素在所述目标视图容器中的第二位置；
在所述第一位置和所述定位位置的距离小于或等于零的情况下，将所述目标视图元素从所述第二位置移除；
将所述目标视图元素设置于所述可视区域中的所述定位位置。
3.如权利要求2所述的方法，所述对所述目标视图元素定位之后，包括：
响应于第二滚动事件，对小程序的展示页面调整可视区域的位置；
在调整过程中，监测所述目标视图元素在所述目标视图容器中的第二位置相对于所述定位位置之间的距离；
在所述距离小于或等于零的情况下，将所述目标视图元素从所述定位位置移除；
将所述目标视图元素恢复至所述目标视图容器中的第二位置。
4.如权利要求3所述的方法，所述监测所述目标视图元素在所述目标视图容器中的第二位置相对于所述定位位置之间的距离之前，包括：
监测所述目标视图容器相对于可视区域的第四位置；
确定所述第四位置处于可视区域。
5.如权利要求1-4任一项所述的方法，其中，所述粘性定位属性指示的定位位置包含水平方向的位置和垂直方向的位置。
6.一种小程序页面的处理装置，包括：
调整模块，用于响应于第一滚动事件，对小程序的展示页面调整可视区域的位置；
监测模块，用于在调整过程中，对所述展示页面的目标视图容器中包含粘性定位属性的目标视图元素监测相对可视区域的第一位置；
定位模块，用于在所述目标视图元素的第一位置和对应的粘性定位属性指示的定位位置匹配的情况下，根据所述定位位置，对所述目标视图元素定位；
渲染模块，用于调用渲染引擎对定位后的目标视图元素进行渲染展示。
7.如权利要求6所述的装置，所述定位模块，用于：
获取所述目标视图元素在所述目标视图容器中的第二位置；
在所述第一位置和所述定位位置的距离小于或等于零的情况下，将所述目标视图元素从所述第二位置移除；
将所述目标视图元素设置于所述可视区域中的所述定位位置。
8.如权利要求7所述的装置，所述装置，还包括：
所述调整模块，还用于响应于第二滚动事件，对小程序的展示页面调整可视区域的位置；
所述监测模块，还用于在调整过程中，监测所述目标视图元素在所述目标视图容器中的第二位置相对于所述定位位置之间的距离；
处理模块，用于在所述距离小于或等于零的情况下，将所述目标视图元素从所述定位位置移除；将所述目标视图元素恢复至所述目标视图容器中的第二位置。
9.如权利要求8所述的装置，所述装置，还包括：
所述监测模块，还用于监测所述目标视图容器相对于可视区域的第四位置；
确定模块，用于确定所述第四位置处于可视区域。
10.如权利要求6-9任一项所述的装置，其中，所述粘性定位属性指示的定位位置包含水平方向的位置和垂直方向的位置。
11.一种电子设备，包括：
至少一个处理器；以及
与所述至少一个处理器通信连接的存储器；其中，
所述存储器存储有可被所述至少一个处理器执行的指令，所述指令被所述至少一个处理器执行，以使所述至少一个处理器能够执行权利要求1-5中任一项所述方法的步骤。
12.一种存储有计算机指令的非瞬时计算机可读存储介质，其中，所述计算机指令用于使所述计算机执行根据权利要求1-5中任一项所述方法的步骤。
13.一种计算机程序产品，包括计算机指令，所述计算机指令在被处理器执行时实现根据权利要求1-5中任一项所述方法的步骤。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202111171505.0A CN113885960B (zh) | 2021-10-08 | 2021-10-08 | 小程序页面的处理方法、装置、电子设备和存储介质 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202111171505.0A CN113885960B (zh) | 2021-10-08 | 2021-10-08 | 小程序页面的处理方法、装置、电子设备和存储介质 |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN113885960A true CN113885960A (zh) | 2022-01-04 |
| CN113885960B CN113885960B (zh) | 2024-04-26 |
Family
ID=79005508
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202111171505.0A Active CN113885960B (zh) | 2021-10-08 | 2021-10-08 | 小程序页面的处理方法、装置、电子设备和存储介质 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN113885960B (zh) |
Cited By (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN114510189A (zh) * | 2022-01-26 | 2022-05-17 | 北京百度网讯科技有限公司 | 一种切换标签的方法、装置、电子设备及存储介质 |
| CN114564166A (zh) * | 2022-02-28 | 2022-05-31 | 北京达佳互联信息技术有限公司 | 小程序页面的布局方法、装置、电子设备及存储介质 |
Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20190163498A1 (en) * | 2017-11-28 | 2019-05-30 | Microsoft Technology Licensing, Llc | Thread independent parametric positioning for rendering elements |
| CN111199005A (zh) * | 2019-12-27 | 2020-05-26 | 山石网科通信技术股份有限公司 | 网页组件处理方法及装置 |
| CN111880712A (zh) * | 2020-08-07 | 2020-11-03 | 北京达佳互联信息技术有限公司 | 页面显示方法、装置、电子设备及存储介质 |
| CN111949264A (zh) * | 2020-07-09 | 2020-11-17 | 北京齐尔布莱特科技有限公司 | 一种页面元素的定位方法及移动终端 |
| CN112905279A (zh) * | 2021-02-03 | 2021-06-04 | 广州虎牙科技有限公司 | 页面组件渲染方法、装置、电子设备及存储介质 |
| CN113449500A (zh) * | 2021-06-29 | 2021-09-28 | 杭州时戳信息科技有限公司 | 表格吸顶方法、装置及计算机可读存储介质 |
-
2021
- 2021-10-08 CN CN202111171505.0A patent/CN113885960B/zh active Active
Patent Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20190163498A1 (en) * | 2017-11-28 | 2019-05-30 | Microsoft Technology Licensing, Llc | Thread independent parametric positioning for rendering elements |
| CN111199005A (zh) * | 2019-12-27 | 2020-05-26 | 山石网科通信技术股份有限公司 | 网页组件处理方法及装置 |
| CN111949264A (zh) * | 2020-07-09 | 2020-11-17 | 北京齐尔布莱特科技有限公司 | 一种页面元素的定位方法及移动终端 |
| CN111880712A (zh) * | 2020-08-07 | 2020-11-03 | 北京达佳互联信息技术有限公司 | 页面显示方法、装置、电子设备及存储介质 |
| CN112905279A (zh) * | 2021-02-03 | 2021-06-04 | 广州虎牙科技有限公司 | 页面组件渲染方法、装置、电子设备及存储介质 |
| CN113449500A (zh) * | 2021-06-29 | 2021-09-28 | 杭州时戳信息科技有限公司 | 表格吸顶方法、装置及计算机可读存储介质 |
Non-Patent Citations (1)
| Title |
|---|
| 牟云峰: "\"python粘性扩展_小程序粘性布局组件实现\"", pages 1 - 8, Retrieved from the Internet <URL:https://blog.csdn.net/weixin_42097369/article/details/113674266> * |
Cited By (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN114510189A (zh) * | 2022-01-26 | 2022-05-17 | 北京百度网讯科技有限公司 | 一种切换标签的方法、装置、电子设备及存储介质 |
| CN114510189B (zh) * | 2022-01-26 | 2024-05-07 | 北京百度网讯科技有限公司 | 一种切换标签的方法、装置、电子设备及存储介质 |
| CN114564166A (zh) * | 2022-02-28 | 2022-05-31 | 北京达佳互联信息技术有限公司 | 小程序页面的布局方法、装置、电子设备及存储介质 |
Also Published As
| Publication number | Publication date |
|---|---|
| CN113885960B (zh) | 2024-04-26 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN113885960B (zh) | 小程序页面的处理方法、装置、电子设备和存储介质 | |
| EP3916634A2 (en) | Text recognition method and device, and electronic device | |
| US20210350541A1 (en) | Portrait extracting method and apparatus, and storage medium | |
| US11861498B2 (en) | Method and apparatus for compressing neural network model | |
| EP4123595A2 (en) | Method and apparatus of rectifying text image, training method and apparatus, electronic device, and medium | |
| CN115659039A (zh) | 信息推荐与信息展示方法、装置、设备、介质及程序产品 | |
| CN113392346A (zh) | 资源文件的路径处理方法、装置、电子设备及存储介质 | |
| CN112669852B (zh) | 内存分配方法、装置及电子设备 | |
| CN113378511A (zh) | 页面的显示方法、装置、电子设备和存储介质 | |
| CN115878935B (zh) | 一种图表的局部刷新方法、系统、装置、设备及介质 | |
| US20230144949A1 (en) | Virtual-machine cold migration method and apparatus, electronic device and storage medium | |
| CN115309730A (zh) | 数据审核方法、装置、电子设备及存储介质 | |
| CN114445682A (zh) | 训练模型的方法、装置、电子设备、存储介质及产品 | |
| CN112861504A (zh) | 文本交互方法、装置、设备、存储介质及程序产品 | |
| CN114461944B (zh) | 搜索结果的展示方法、装置及电子设备 | |
| CN113642612B (zh) | 样本图像生成方法、装置、电子设备及存储介质 | |
| CN115686714A (zh) | 一种页面展示方法、装置、设备及存储介质 | |
| EP4086905A1 (en) | Voice activity detection method and apparatus, electronic device and storage medium | |
| CN113642605A (zh) | 模型蒸馏方法、装置、电子设备及存储介质 | |
| CN116245109A (zh) | 文本处理方法、装置及电子设备 | |
| CN118092776A (zh) | 页面元素展示方法、装置、电子设备及存储介质 | |
| CN113971256A (zh) | 页面的处理方法、装置、电子设备和存储器 | |
| CN113344620A (zh) | 福利信息的发放方法、设备和存储介质 | |
| CN115953771A (zh) | 文本图像处理方法、装置、设备和介质 | |
| CN113343005A (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 | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |