CN113536173B - 一种页面处理方法、装置、电子设备及可读存储介质 - Google Patents

一种页面处理方法、装置、电子设备及可读存储介质 Download PDF

Info

Publication number
CN113536173B
CN113536173B CN202110796850.7A CN202110796850A CN113536173B CN 113536173 B CN113536173 B CN 113536173B CN 202110796850 A CN202110796850 A CN 202110796850A CN 113536173 B CN113536173 B CN 113536173B
Authority
CN
China
Prior art keywords
picture
target
position information
target picture
touch
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
CN202110796850.7A
Other languages
English (en)
Other versions
CN113536173A (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.)
Douyin Vision Co Ltd
Original Assignee
Douyin Vision 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 Douyin Vision Co Ltd filed Critical Douyin Vision Co Ltd
Priority to CN202110796850.7A priority Critical patent/CN113536173B/zh
Publication of CN113536173A publication Critical patent/CN113536173A/zh
Priority to EP22841082.5A priority patent/EP4339808A1/en
Priority to PCT/CN2022/097301 priority patent/WO2023284442A1/zh
Application granted granted Critical
Publication of CN113536173B publication Critical patent/CN113536173B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90—Details of database functions independent of the retrieved data types
    • G06F16/95—Retrieval from the web
    • G06F16/957—Browsing optimisation, e.g. caching or content distillation
    • G06F16/9577—Optimising the visualization of content, e.g. distillation of HTML documents
    • 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/04845—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 for image manipulation, e.g. dragging, rotation, expansion or change of colour
    • 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
    • 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
    • G06F2203/00—Indexing scheme relating to G06F3/00 - G06F3/048
    • G06F2203/048—Indexing scheme relating to G06F3/048
    • G06F2203/04806—Zoom, i.e. interaction techniques or interactors for controlling the zooming operation
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F2203/00—Indexing scheme relating to G06F3/00 - G06F3/048
    • G06F2203/048—Indexing scheme relating to G06F3/048
    • G06F2203/04808—Several contacts: gestures triggering a specific function, e.g. scrolling, zooming, right-click, when the user establishes several contacts with the surface simultaneously; e.g. using several fingers or a combination of fingers and pen

Landscapes

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

Abstract

本公开提供了一种页面处理方法、装置、电子设备及可读存储介质，其中，该方法包括：响应于作用在终端界面上的触摸操作，获取触摸位置信息，以及获取目标动态页面中的各个图片的图片位置信息；基于触摸位置信息和图片位置信息，确定触摸的目标图片以及目标图片位置信息；在目标图片位置处，创建原生图像视图组件并基于原生图像视图组件渲染目标图片，以及，启动屏幕触摸事件拦截机制；当拦截到针对目标图片的触摸事件时，根据目标图片的触摸事件中指示的触摸操作对原生图像视图组件渲染的目标图片进行相应处理。本公开实施例中，用户在目标动态页面就可以实现对页面中图片的缩放，无需跳转到查看大图页面，提高了交互效率。

Description

一种页面处理方法、装置、电子设备及可读存储介质
技术领域
本公开涉及信息技术领域，具体而言，涉及一种页面处理方法、装置、电子设备及可读存储介质。
背景技术
随着互联网技术的发展，在终端页面上展示的内容越来越多样化。为了实现内容可以动态化地展示，通常采用基于超文本标记语言制作的动态网页展示内容。
目前，在动态网页上对图片进行放大查看时，通常需要进行先点击终端界面上动态网页中的图片，终端界面跳转到查看大图页面，然后在查看大图页面上进行手势放大图片的操作步骤。
上述对动态网页中的图片进行放大查看的过程，操作繁琐，交互效率较低。
发明内容
本公开实施例至少提供一种页面处理方法、装置、电子设备及可读存储介质。
第一方面，本公开实施例提供了一种页面处理方法，包括：
响应于作用在终端界面上的触摸操作，获取触摸位置信息，以及获取在所述终端界面上显示的目标动态页面中的各个图片的图片位置信息；
基于所述触摸位置信息和所述各个图片的图片位置信息，确定所述各个图片中被触摸的目标图片，以及所述目标图片在所述终端界面中的目标图片位置信息；
在所述目标图片位置信息指示的目标图片位置处，创建原生图像视图组件并基于所述原生图像视图组件渲染所述目标图片，以及，启动屏幕触摸事件拦截机制；
当拦截到针对所述目标图片的触摸事件时，根据所述目标图片的触摸事件中指示的触摸操作对所述原生图像视图组件渲染的所述目标图片进行相应处理。
一种可选的实施方式中，基于所述触摸位置信息和所述各个图片的图片位置信息，确定所述各个图片中被触摸的目标图片，以及所述目标图片在所述终端界面中的目标图片位置信息，包括：
基于所述各个图片在所述目标动态页面中的图片位置信息，以及所述目标动态页面与所述终端界面之间的坐标系转换关系，确定所述各个图片在所述终端界面中的图片位置信息；
基于所述触摸位置信息以及确定的所述各个图片在所述终端界面中的图片位置信息，确定所述各个图片中被触摸的目标图片，以及所述目标图片在所述终端界面中的目标图片位置信息。
一种可选的实施方式中，基于所述触摸位置信息以及确定的所述各个图片在所述终端界面中的图片位置信息，确定所述各个图片中被触摸的目标图片，包括：
在所述触摸位置信息指示的触摸位置点为多个触摸位置点的情况下，基于所述各个图片在所述终端界面中的图片位置信息，从所述各个图片中，选择对应的图片区域包含所述多个触摸位置点的图片作为所述目标图片。
一种可选的实施方式中，根据所述目标图片的触摸事件中指示的触摸操作，基于所述原生图像视图组件对所述目标图片进行渲染更新，以更新所述目标图片的显示属性，包括：
根据所述触摸位置信息的变化，确定对所述目标图片的缩放属性信息；所述缩放属性信息包括缩放比例和缩放方向；
按照所述缩放属性信息，基于所述原生图像视图组件对所述目标图片进行渲染更新，以更新所述目标图片的显示属性。
一种可选的实施方式中，基于所述触摸位置信息和所述各个图片的图片位置信息，确定所述各个图片中被触摸的目标图片，以及所述目标图片在所述终端界面中的目标图片位置信息之后，所述方法还包括：
在所述目标图片位置处，添加与所述目标动态页面中的目标图片大小一致的占位图片；所述占位图片位于所述原生图像视图组件渲染的目标图片下方且位于所述目标动态页面中的目标图片上方。
一种可选的实施方式中，还包括：
检测到所述触摸操作停止时，基于所述原生图像视图组件对所述目标图片进行动画渲染，以使所述目标图片恢复至所述目标图片位置处，且与所述目标动态页面中的目标图片的大小一致。
一种可选的实施方式中，在所述目标图片位置信息指示的目标图片位置处，创建原生图像视图组件，并基于所述原生图像视图组件渲染所述目标图片，以及，启动屏幕触摸事件拦截机制之前，还包括：
基于所述触摸位置信息，判断在所述终端界面上是否存在多个触摸位置点；
在所述目标图片位置信息指示的目标图片位置处，创建原生图像视图组件，并基于所述原生图像视图组件渲染所述目标图片，以及，启动屏幕触摸事件拦截机制，包括：
当确定存在多个触摸位置点的情况下，在所述目标图片位置信息指示的目标图片位置处，创建原生图像视图组件，并基于所述原生图像视图组件渲染所述目标图片，以及，启动屏幕触摸事件拦截机制。
第二方面，本公开实施例还提供一种页面处理装置，包括：
获取模块，用于响应于作用在终端界面上的触摸操作，获取触摸位置信息，以及获取在所述终端界面上显示的目标动态页面中的各个图片的图片位置信息；
确定模块，用于基于所述触摸位置信息和所述各个图片的图片位置信息，确定所述各个图片中被触摸的目标图片，以及所述目标图片在所述终端界面中的目标图片位置信息；
渲染模块，用于在所述目标图片位置信息指示的目标图片位置处，创建原生图像视图组件并基于所述原生图像视图组件渲染所述目标图片，以及，启动屏幕触摸事件拦截机制；
处理模块，用于当拦截到针对所述目标图片的触摸事件时，根据所述目标图片的触摸事件中指示的触摸操作对所述原生图像视图组件渲染的所述目标图片进行相应处理。
第三方面，本公开实施例还提供一种计算机设备，包括：处理器、存储器和总线，所述存储器存储有所述处理器可执行的机器可读指令，当计算机设备运行时，所述处理器与所述存储器之间通过总线通信，所述机器可读指令被所述处理器执行时执行上述第一方面，或第一方面中任一种可能的实施方式中的步骤。
第四方面，本公开实施例还提供一种计算机可读存储介质，该计算机可读存储介质上存储有计算机程序，该计算机程序被处理器运行时执行上述第一方面，或第一方面中任一种可能的实施方式中的步骤。
本公开实施例提供的一种页面处理方法、装置、电子设备及可读存储介质，在目标图片位置处创建原生图像视图组件并基于原生图像视图组件渲染目标图片，后续基于屏幕拦截事件机制，将针对目标图片的触摸事件进行拦截，然后根据目标图片的触摸事件中指示的触摸操作对原生图像视图组件渲染的目标图片进行相应处理，实现了对目标动态页面中的图片进行手势缩放、拖拽的显示效果，本公开实施例无需点击目标动态页面中的目标图片跳转到查看大图页面后再进行图片的相关操作，直接在原生图像视图组件渲染的目标图片中就可以实现对图片的缩放、拖拽等查看操作，节省了操作步骤，提高了交互效率。
进一步，本公开实施例提供的页面处理方法，在目标图片位置处，添加与目标图片大小一致的占位图片，其中占位图片位于目标图片下方且位于目标图片上方，当原生图像视图组件渲染的目标图片被缩放拖拽时，占位图片可以遮挡目标图片，实现看起来像是目标图片被触摸对象进行了缩放、拖拽，从而提高了显示效果的真实性。
为使本公开的上述目的、特征和优点能更明显易懂，下文特举较佳实施例，并配合所附附图，作详细说明如下。
附图说明
为了更清楚地说明本公开实施例的技术方案，下面将对实施例中所需要使用的附图作简单地介绍，此处的附图被并入说明书中并构成本说明书中的一部分，这些附图示出了符合本公开的实施例，并与说明书一起用于说明本公开的技术方案。应当理解，以下附图仅示出了本公开的某些实施例，因此不应被看作是对范围的限定，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他相关的附图。
图1示出了本公开实施例所提供的一种页面处理方法的流程图；
图2示出了本公开实施例所提供的触摸前的页面效果示意图；
图3示出了本公开实施例所提供的触摸后的页面效果示意图；
图4示出了本公开实施例所提供的另一种页面处理方法的流程图；
图5示出了本公开实施例所提供的一种页面处理装置的示意图；
图6示出了本公开实施例所提供的一种计算机设备的示意图。
具体实施方式
为使本公开实施例的目的、技术方案和优点更加清楚，下面将结合本公开实施例中附图，对本公开实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本公开一部分实施例，而不是全部的实施例。通常在此处附图中描述和示出的本公开实施例的组件可以以各种不同的配置来布置和设计。因此，以下对在附图中提供的本公开的实施例的详细描述并非旨在限制要求保护的本公开的范围，而是仅仅表示本公开的选定实施例。基于本公开的实施例，本领域技术人员在没有做出创造性劳动的前提下所获得的所有其他实施例，都属于本公开保护的范围。
在对动态页面中的图片进行放大查看时，通常需要先点击终端界面显示的动态页面中的图片，然后终端界面跳转到查看大图页面，最后在查看大图页面上进行手势缩放、拖拽操作，以实现查看大图的目的。上述对动态页面中的图片进行放大查看的操作步骤比较繁琐、交互效率较低。
基于上述研究，本公开提供了一种页面处理方法，在目标图片位置处创建原生图像视图组件并基于原生图像视图组件渲染目标图片，后续基于屏幕拦截事件机制，将针对目标图片的触摸事件进行拦截，然后根据目标图片的触摸事件中指示的触摸操作对原生图像视图组件渲染的目标图片进行相应处理，实现了对目标动态页面中的图片进行手势缩放、拖拽的显示效果，本公开实施例无需点击目标动态页面中的目标图片跳转到查看大图页面后再进行图片的相关操作，直接在原生图像视图组件渲染的目标图片中就可以实现对图片的缩放、拖拽等查看操作，节省了操作步骤，提高了交互效率。
针对以上方案所存在的缺陷，均是发明人在经过实践并仔细研究后得出的结果，因此，上述问题的发现过程以及下文中本公开针对上述问题所提出的解决方案，都应该是发明人在本公开过程中对本公开做出的贡献。
应注意到：相似的标号和字母在下面的附图中表示类似项，因此，一旦某一项在一个附图中被定义，则在随后的附图中不需要对其进行进一步定义和解释。
为便于对本实施例进行理解，首先对本公开实施例所公开的一种页面处理方法进行详细介绍，本公开实施例所提供的页面处理方法的执行主体一般为具有一定计算能力的终端设备或其它处理设备，终端设备可以为用户设备(User Equipment，UE)、移动设备、用户终端、终端、蜂窝电话、无绳电话、个人数字助理(Personal Digital Assistant，PDA)、手持设备、计算设备、车载设备、可穿戴设备等。在一些可能的实现方式中，该页面处理方法可以通过处理器调用存储器中存储的计算机可读指令的方式来实现。
下面以执行主体为终端设备为例对本公开实施例提供的页面处理方法加以说明。
首先需要说明的是，本公开实施例提供的页面处理方法主要应用在用户查看动态页面中的图片内容的场景中，启动安装在终端设备上的目标应用程序(目标应用程序中包含动态页面，例如新闻资讯类的应用程序)，并打开目标应用程序中的内容详情页后，在该内容详情页为动态页面，且用户通过触摸操作想要查看内容详情页中包含的图片内容时，可以执行本公开实施例提供的页面处理方法。
参见图1所示，为本公开实施例提供的页面处理方法的流程图，所述方法包括S101～S104，其中：
S101：响应于作用在终端界面上的触摸操作，获取触摸位置信息，以及获取在所述终端界面上显示的目标动态页面中的各个图片的图片位置信息。
终端界面可以是终端设备上的触摸屏中的显示界面，目标动态页面可以指的是能够实现页面内容或者结构动态化展示的页面，例如基于超文本标记语言5(Hyper TextMark up Language5，HTML5)制作的网页，这里简称H5网页。需要说明的是，下文中涉及到的H5网页均指代基于HTML5制作的网页。H5页面可以通过网页视图(webview)加载，并显示在终端界面中。
通常目标动态页面并没有与终端界面重合，这是因为终端界面显示目标动态页面时，在终端界面的其他显示区域还会显示一些由原生组件渲染的固定的页面布局内容，例如终端设备上打开新闻咨询类的内容详情页(网页视图加载的H5页面)时，终端界面在内容详情页上方还会显示文章作者信息，以及在内容详情页下方还会显示用户评论内容等。
目标动态页面可以相对于终端界面在上下的方向上平移，也可以在左右的方向上平移。通过平移目标动态页面，可以将目标动态页面中未显示在终端界面上的内容显示出来。
当目标动态页面中包含的内容较多时，这些内容占用的篇幅较长，无法全部地展示在终端界面中，对目标动态页面执行滑动操作或者其他任何可能的显示操作，将之前展示的内容部分地或者完全地隐藏起来后，那些未展示出来的内容才可以展示出来。当目标动态页面中包含的内容较少时，这些内容可以全部地展示在终端界面中，那么就无需对目标动态页面执行任何操作。
终端界面显示出目标动态页面后，如果目标动态页面中有图片时，首先目标脚本可以检测目标动态页面中各个图片的图片位置信息。目标动态页面中的各个图片可以是当前全部显示在终端界面中的图片，也可以是部分显示在终端界面中的图片，也可以是均未显示在终端界面中的图片(未显示出来的图片可以通过平移目标动态页面后显示出来)。图片位置信息指的是各个图片在目标动态页面中的位置信息。
目标脚本检测到的图片的图片位置信息，可以包括图片上下边缘距离目标动态页面顶部的偏移量、图片左边缘距离目标动态页面左边的偏移量、以及图片右边缘距离目标动态页面右边的偏移量。
为了方便描述图片位置信息，也可以在目标动态页面中建立平面直角坐标系。在一种可行的实施方式中，可以以目标动态页面的一个顶点为坐标原点，以该顶点相邻的两条边(假设目标动态页面为矩形)所在的直线分别为横坐标轴和纵坐标轴，建立平面直角坐标系，图片位置信息可以是图片在平面直角坐标系中的坐标信息，具体地可以是图片的每个顶点在平面直角坐标系中的坐标信息。在其他可行的实施方式中，也可以是以目标动态页面的其他点为原点建立平面直角坐标系，这里不再赘述。
在获取到目标动态页面中各个图片的图片位置信息后，如果有触摸对象(例如用户的手指)在终端界面上执行触摸操作，则终端设备能够检测到触摸位置，从而获取到触摸位置信息。其中，触摸位置信息指的是触摸对象触摸终端界面时与终端界面接触的位置信息。
同样，为了方便描述触摸位置信息，可以在终端界面中建立平面直角坐标系，然后获取该平面直角坐标系中的触摸位置信息。在一种可行的实施方式中，可以以终端界面的一个顶点为原点，以该顶点相邻的两条边(假设终端界面为矩形)所在的直线分别为横坐标轴和纵坐标轴，建立平面直角坐标系，触摸位置信息可以是平面直角坐标系中的坐标信息。需要说明的是，这里可以把触摸位置当做是一个点，也就是触摸对象(例如用户的手指)与终端界面相切的点。当触摸位置有多个时，可以获取每个触摸位置对应的坐标信息。在其他可行的实施方式中，也可以是以终端界面的其他点为原点建立平面直角坐标系，这里不再赘述。
在一种可行的实施方式中，进一步为了方便描述触摸位置信息和图片位置信息，可以将终端界面中左上角的顶点以及目标动态页面中左上角的顶点分别作为原点(也可以是其他位置的顶点，但是终端界面中作为原点的顶点应与目标动态页面中作为原点的顶点在各自的平面中的相对位置相同)，建立坐标轴方向相同的两个平面直角坐标系，然后分别获取触摸位置信息和图片位置信息。
在上述实施方式中，通过在终端界面和目标动态页面中分别建立平面直角坐标系，然后分别获取触摸位置信息和图片位置信息，以此保证触摸位置信息和图片位置信息的准确性。
在一种可行的实施方式中，还可以在终端界面或者目标动态页面中建立一个平面直角坐标系，然后在该平面直角坐标系下，既获取触摸位置信息，又获取各个图片的图片位置信息，虽然这种实施方式可以同时描述触摸位置信息和图片位置信息，减少处理位置信息的工作量，并且快速在步骤S102中确定出各个图片中被触摸的目标图片(不需要将终端界面中建立的平面直角坐标系与目标动态页面中建立的平面直角坐标系进行坐标系的转换)，但是这种实施方式能够执行的前提是要求终端界面与目标动态页面完全重合，且目标动态页面中包含的图片全部显示出来。
S102：基于所述触摸位置信息和所述各个图片的图片位置信息，确定所述各个图片中被触摸的目标图片，以及所述目标图片在所述终端界面中的目标图片位置信息。
在前述步骤中已经通过建立的平面直角坐标系，获取了触摸位置信息和各个图片的图片位置信息，这里可以基于触摸位置信息和各个图片的图片位置信息，确定各个图片中被触摸的目标图片。
针对前述一种可行的实施方式中，当终端界面与目标动态页面完全重合，且目标动态页面中包含的图片全部同时显示出来的情况下，可以直接在终端界面或者目标动态页面中建立的平面直角坐标下，基于触摸位置信息和各个图片的图片位置信息，确定各个图片中被触摸的目标图片。
而针对终端界面与目标动态页面不完全重合的情况，可以将在终端界面中建立的平面直角坐标与在目标动态页面中建立的平面直角坐标进行坐标系转换，也就是将触摸位置信息和各个图片的图片位置信息转换到同一坐标系下，这样才能有对比性，从而基于同一坐标系下的触摸位置信息和各个图片的图片位置信息，确定各个图片中被触摸的目标图片。
在一种可行的实施方式中，可以将目标动态页面中的平面直角坐标下的图片位置信息转换到终端界面中的平面直角坐标系下的图片位置信息，具体地，可以基于各个图片在目标动态页面中的图片位置信息，以及目标动态页面与终端界面之间的坐标系转换关系，确定各个图片在终端界面中的图片位置信息。
这里的坐标系转换关系可以包括坐标轴的转换关系以及坐标单位的转换关系(这里主要是考虑不同的终端设备具有不同的像素密度，因此图片在不同的终端界面上的显示尺寸可能不同)。
具体地，可以根据目标动态页面中的平面直角坐标系的原点与终端界面中的平面直角坐标系的原点的相对位置以及坐标轴的方向(在本公开中，目标动态页面中的平面直角坐标系的坐标轴与终端界面中的平面直角坐标系的坐标轴的方向可以是一致的)，确定坐标轴的转换关系。然后根据终端界面中的屏幕像素密度，确定坐标单位的转换关系，具体地，将脚本返回的目标动态页面中各个图片的图片坐标单位乘以终端界面中的屏幕像素密度，得到各个图片在终端界面上进行显示的坐标单位。
在确定出各个图片在终端界面中的图片位置信息之后，可以基于触摸位置信息以及确定的各个图片在终端界面中的图片位置信息，确定各个图片中被触摸的目标图片，以及目标图片在终端界面中的目标图片位置信息。
在本公开中，在触摸位置信息指示的触摸位置点为多个触摸位置点的情况下，基于各个图片在终端界面中的图片位置信息，从各个图片中，选择对应的图片区域包含多个触摸位置点的图片作为目标图片。也就是当有多个触摸位置点时，多个触摸位置点均位于同一个图片对应的图片区域内时，该图片才作为目标图片。
由于一般情况下，用户对图片进行拖拽/缩放是需要使用多指操作的，因此，可以将判断当前是否为多指操作作为执行后续步骤(也即下述S103)的前提。具体地，基于触摸位置信息，判断在同一个图片对应的图片区域内是否存在多个触摸位置点，当在同一个图片对应的图片区域内存在的触摸位置点为一个时，可以检测是否为长按操作，如果是长按操作，可以在终端界面展示下载图片或者分享图片的提示信息，如果不是长按操作，则可以不响应当前的触摸操作，认为是普通的滑动过程中的触摸。当在同一个图片对应的图片区域内存在的触摸位置点为多个时，则可以执行S103的步骤，以实现拖拽/缩放的效果。
S103：在所述目标图片位置信息指示的目标图片位置处，创建原生图像视图组件并基于所述原生图像视图组件渲染所述目标图片，以及，启动屏幕触摸事件拦截机制。
这里的原生图像视图组件可以是原生的ImageView(图像视图)组件。在确定了目标图片之后，可以在目标图片位置信息指示的目标图片位置处，创建原生图像视图组件，原生图像视图组件可以加载目标图片对应的图片地址，并渲染目标图片，原生图像视图组件渲染的目标图片覆盖在了原来的图片的位置上。
当原生图像视图组件渲染了目标图片之后，触摸对象对目标图片的各个触摸操作可以被终端界面的屏幕触摸事件传递机制拦截下来，然后作用到原生图像视图组件上，也就是S104的过程。
S104：当拦截到针对所述目标图片的触摸事件时，根据所述目标图片的触摸事件中指示的触摸操作对所述原生图像视图组件渲染的所述目标图片进行相应处理。
这里触摸操作可以是对目标图片的缩放操作，根据目标图片的触摸事件中指示的触摸操作，可以确定对目标图片的缩放属性信息；缩放属性信息包括缩放比例和缩放方向。
具体地，根据触摸操作可以确定出触摸位置信息的变化，触摸位置信息的变化可以包括触摸位置间距离的变化以及触摸位置的相对方向的变化，这里可以基于触摸位置信息的变化。
其中，缩放比例指的是目标图片缩放后与缩放前的比例；缩放方向指的是目标图片缩放后与缩放前的相对方向。
然后按照缩放属性信息，基于原生图像视图组件对目标图片进行渲染更新，以更新目标图片的显示属性。其中目标图片的显示属性指的是目标图片的显示尺寸和/或显示位置信息。当确定缩放属性信息后，可以根据缩放比例和缩放方向，更新原生图像视图组件渲染的目标图片的显示尺寸和/或显示位置信息。图2中示出了触摸前的页面效果示意图，图2中展示有原目标动态页面中的目标图片，图3示出了触摸后的页面效果示意图，拦截针对原目标动态页面中的目标图片的触摸事件，对原生图像视图组件渲染的目标图片进行放大，展示出的效果看起来像是对目标动态页面中的目标图片进行了放大，目标图片的显示尺寸以及目标图片中的内容被同步放大。
考虑到当触摸对象对原生图像视图组件渲染的目标图片进行触摸操作时，原目标动态页面中目标图片位置的目标图片依然是存在的，因为它始终是在目标动态页面中，而不会像正在被触摸对象缩放拖拽的原生图像视图组件渲染的目标图片那样可以随意移动。为了实现原目标动态页面中的目标图片看起来像是被触摸对象进行缩放、拖拽移动的效果，需要当原生图像视图组件渲染的目标图片被缩放拖拽时，在目标图片位置处，创建一个视图(view)组件，利用view组件渲染一个与目标动态页面中的目标图片大小一致的占位图片，占位图片可以是灰色的图片，添加在原生图像视图组件渲染的目标图片下方且目标动态页面中的目标图片上方，保证该占位图片的位置和大小完全能够覆盖目标动态页面中的目标图片。当触摸对象开始触摸原生图像视图组件渲染的目标图片时，将该占位图片显示出来，由于原生图像视图组件渲染的目标图片正处于目标动态页面中的目标图片的正上方，随着触摸对象的触摸位置变化，原生图像视图组件渲染的目标图片的显示属性实时地变化，同时目标动态页面中的目标图片已经被占位图片遮挡住，实际效果就好像触摸对象把目标动态页面中的目标图片给拖动出来并且能缩放了。
检测到触摸操作停止时，可以基于原生图像视图组件对目标图片进行动画渲染，以使原生图像视图组件渲染的目标图片恢复至原来的图片位置处，且与原来的图片的大小一致。也就是原生图像视图组件渲染的目标图片从触摸操作停止的位置，移动到目标动态页面中的目标图片所在的位置，并且将原生图像视图组件渲染的目标图片的尺寸恢复到目标动态页面中的目标图片的尺寸，示例性地，动画时长可以设定为200ms。当动画结束时，也就是原生图像视图组件渲染的目标图片恢复至目标动态页面中的目标图片位置处，且与目标动态页面中的目标图片的大小一致之后，删除原生图像视图组件渲染的目标图片以及占位图片，此时目标动态页面中的目标图片显示在终端界面，但是实际视觉效果是触摸对象通过触摸操作把目标动态页面中的目标图片进行了缩放、拖拽等动作，并且目标动态页面中的目标图片会跟随触摸对象在终端界面上物理移动了，触摸操作停止时目标动态页面中的目标图片再自动还原回去。需要说明的是，本公开中原生图像视图组件不仅支持缩放、拖拽等触摸操作，还可以支持任意的触摸交互操作，比如单击、双击、长按、手写输入等操作。
为了更清楚地描述本公开实施例提供的页面处理方法，图4中示出了一种具体的页面处理过程的流程图，如图所示，在启动安装在终端设备上的目标应用程序，并打开目标应用程序中的目标动态页面后，终端设备上可以显示目标动态页面中的各个图片，Java脚本(javascript)可以检测目标动态页面中的各个图片的图片位置信息。
当有手指在终端界面上进行触摸操作时，可以响应于作用在终端界面上的触摸操作，获取各个手指在终端界面上的触摸位置信息，然后根据各个手指的触摸位置信息以及各个图片的图片位置信息，判断是否有手指触摸到图片；在手指触摸到图片的情况下，进一步判断在同一个图片对应的图片区域内是否存在多个触摸位置点；当在同一个图片对应的图片区域内存在的触摸位置点为一个时，可以检测是否为长按操作；如果是长按操作，可以在终端界面展示下载图片或者分享图片的提示信息，如果不是长按操作，则可以不响应当前的触摸操作，认为是普通的滑动过程中的触摸。当在同一个图片对应的图片区域内存在的触摸位置点为多个时，则可以将图片区域包含多个触摸位置点的图片作为目标图片。
然后，可以在目标图片位置信息指示的目标图片位置处，创建一个原生的ImageView组件，并基于ImageView组件渲染目标图片，手指对目标图片的各个触摸操作可以被屏幕触摸事件传递机制拦截下来，然后作用到原生图像视图组件上。
还可以创建一个简单的原生view组件并基于view组件渲染一个与目标图片的大小一致的灰色占位图片。灰色占位图片添加在原生图像视图组件渲染的目标图片下方且目标动态页面中的目标图片上方，保证该占位图片的位置和大小完全能够覆盖目标动态页面中的目标图片。
接下来，判断是否在屏幕执行了缩放拖拽等操作，当没有在屏幕执行缩放拖拽等操作，可以不进行响应，并继续监测是否有手指触摸到图片。当手指执行缩放拖拽操作时，随着触摸对象的触摸位置变化，原生图像视图组件渲染的目标图片的显示属性实时地变化。同时目标动态页面中的目标图片被占位图片遮挡住，实际效果就好像触摸对象把目标动态页面中的目标图片给拖动出来并且缩放了。
当手指停止触摸操作时，原生图像视图组件渲染的目标图片通过动画的形式，从触摸操作停止的位置恢复至原来目标图片所在的位置，且与原来的图片的大小一致，最后删除原生图像视图组件渲染的目标图片以及占位图片，此时目标动态页面中的目标图片重新显示在终端界面。
本领域技术人员可以理解，在具体实施方式的上述方法中，各步骤的撰写顺序并不意味着严格的执行顺序而对实施过程构成任何限定，各步骤的具体执行顺序应当以其功能和可能的内在逻辑确定。
基于同一发明构思，本公开实施例中还提供了与页面处理方法对应的页面处理装置，由于本公开实施例中的装置解决问题的原理与本公开实施例上述页面处理方法相似，因此装置的实施可以参见方法的实施，重复之处不再赘述。
参照图5所示，为本公开实施例提供的一种页面处理装置的架构示意图，所述装置包括：获取模块501、第一确定模块502、渲染模块503、处理模块504；其中，
获取模块501，用于响应于作用在终端界面上的触摸操作，获取触摸位置信息，以及获取在所述终端界面上显示的目标动态页面中的各个图片的图片位置信息；
第一确定模块502，用于基于所述触摸位置信息和所述各个图片的图片位置信息，确定所述各个图片中被触摸的目标图片，以及所述目标图片在所述终端界面中的目标图片位置信息；
渲染模块503，用于在所述目标图片位置信息指示的目标图片位置处，创建原生图像视图组件并基于所述原生图像视图组件渲染所述目标图片，以及，启动屏幕触摸事件拦截机制；
处理模块504，用于当拦截到针对所述目标图片的触摸事件时，根据所述目标图片的触摸事件中指示的触摸操作对所述原生图像视图组件渲染的所述目标图片进行相应处理。
本公开实施例通过在目标图片位置处创建原生图像视图组件并基于原生图像视图组件渲染所述目标图片，触摸事件中指示的触摸操作对原生图像视图组件渲染的所述目标图片进行相应处理，无需点击目标动态页面中的目标图片跳转到查看大图页面后再进行图片的相关操作，直接在目标动态页面中就可以实现对图片的缩放、拖拽等查看操作，节省了操作步骤，提高了交互效率。
一种可能的实施方式中，第一确定模块502，具体用于：基于所述各个图片在所述目标动态页面中的图片位置信息，以及所述目标动态页面与所述终端界面之间的坐标系转换关系，确定所述各个图片在所述终端界面中的图片位置信息；
基于所述触摸位置信息以及确定的所述各个图片在所述终端界面中的图片位置信息，确定所述各个图片中被触摸的目标图片，以及所述目标图片在所述终端界面中的目标图片位置信息。
一种可能的实施方式中，第一确定模块502，具体用于：在所述触摸位置信息指示的触摸位置点为多个触摸位置点的情况下，基于所述各个图片在所述终端界面中的图片位置信息，从所述各个图片中，选择对应的图片区域包含所述多个触摸位置点的图片作为所述目标图片。
一种可能的实施方式中，处理模块504，具体用于根据所述目标图片的触摸事件中指示的触摸操作，确定对所述目标图片的缩放属性信息；所述缩放属性信息包括缩放比例和缩放方向；
按照所述缩放属性信息，基于所述原生图像视图组件对所述目标图片进行渲染更新，以更新所述目标图片的显示属性。
一种可能的实施方式中，还包括：添加模块，用于在所述目标图片位置处，添加与所述目标动态页面中的目标图片大小一致的占位图片；所述占位图片位于所述原生图像视图组件渲染的目标图片下方且位于所述目标动态页面中的目标图片上方。
一种可能的实施方式中，处理模块504，具体用于检测到所述触摸操作停止时，基于所述原生图像视图组件对所述目标图片进行动画渲染，以使所述目标图片恢复至所述目标图片位置处，且与所述目标动态页面中的目标图片的大小一致。
一种可能的实施方式中，还包括：第二确定模块，用于基于所述触摸位置信息，判断在所述终端界面上是否存在多个触摸位置点；
所述渲染模块503，具体用于当确定存在多个触摸位置点的情况下，在所述目标图片位置信息指示的目标图片位置处，创建原生图像视图组件，并基于所述原生图像视图组件渲染所述目标图片，以及，启动屏幕触摸事件拦截机制。
关于装置中的各模块的处理流程、以及各模块之间的交互流程的描述可以参照上述方法实施例中的相关说明，这里不再详述。
基于同一技术构思，本公开实施例还提供了一种计算机设备。参照图6所示，为本公开实施例提供的计算机设备600的结构示意图，包括处理器601、存储器602、和总线603。其中，存储器602用于存储执行指令，包括内存6021和外部存储器6022；这里的内存6021也称内存储器，用于暂时存放处理器601中的运算数据，以及与硬盘等外部存储器6022交换的数据，处理器601通过内存6021与外部存储器6022进行数据交换，当计算机设备600运行时，处理器601与存储器602之间通过总线603通信，使得处理器601在执行以下指令：
响应于作用在终端界面上的触摸操作，获取触摸位置信息，以及获取在所述终端界面上显示的目标动态页面中的各个图片的图片位置信息；
基于所述触摸位置信息和所述各个图片的图片位置信息，确定所述各个图片中被触摸的目标图片，以及所述目标图片在所述终端界面中的目标图片位置信息；
在所述目标图片位置信息指示的目标图片位置处，创建原生图像视图组件并基于所述原生图像视图组件渲染所述目标图片，以及，启动屏幕触摸事件拦截机制；
当拦截到针对所述目标图片的触摸事件时，根据所述目标图片的触摸事件中指示的触摸操作对所述原生图像视图组件渲染的所述目标图片进行相应处理。
本公开实施例还提供一种计算机可读存储介质，该计算机可读存储介质上存储有计算机程序，该计算机程序被处理器运行时执行上述方法实施例中所述的页面处理方法的步骤。其中，该存储介质可以是易失性或非易失的计算机可读取存储介质。
本公开实施例还提供一种计算机程序产品，该计算机产品承载有程序代码，所述程序代码包括的指令可用于执行上述方法实施例中所述的页面处理方法的步骤，具体可参见上述方法实施例，在此不再赘述。
其中，上述计算机程序产品可以具体通过硬件、软件或其结合的方式实现。在一个可选实施例中，所述计算机程序产品具体体现为计算机存储介质，在另一个可选实施例中，计算机程序产品具体体现为软件产品，例如软件开发包(Software Development Kit，SDK)等等。
所属领域的技术人员可以清楚地了解到，为描述的方便和简洁，上述描述的系统和装置的具体工作过程，可以参考前述方法实施例中的对应过程，在此不再赘述。在本公开所提供的几个实施例中，应该理解到，所揭露的系统、装置和方法，可以通过其它的方式实现。以上所描述的装置实施例仅仅是示意性的，例如，所述单元的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，又例如，多个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另一点，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些通信接口，装置或单元的间接耦合或通信连接，可以是电性，机械或其它的形式。
所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。
另外，在本公开各个实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以两个或两个以上单元集成在一个单元中。
所述功能如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个处理器可执行的非易失的计算机可读取存储介质中。基于这样的理解，本公开的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本公开各个实施例所述方法的全部或部分步骤。而前述的存储介质包括：U盘、移动硬盘、只读存储器(Read-OnlyMemory，ROM)、随机存取存储器(Random Access Memory，RAM)、磁碟或者光盘等各种可以存储程序代码的介质。
最后应说明的是：以上所述实施例，仅为本公开的具体实施方式，用以说明本公开的技术方案，而非对其限制，本公开的保护范围并不局限于此，尽管参照前述实施例对本公开进行了详细的说明，本领域的普通技术人员应当理解：任何熟悉本技术领域的技术人员在本公开揭露的技术范围内，其依然可以对前述实施例所记载的技术方案进行修改或可轻易想到变化，或者对其中部分技术特征进行等同替换；而这些修改、变化或者替换，并不使相应技术方案的本质脱离本公开实施例技术方案的精神和范围，都应涵盖在本公开的保护范围之内。因此，本公开的保护范围应以所述权利要求的保护范围为准。

Claims (9)

1.一种页面处理方法，其特征在于，包括：
响应于作用在终端界面上的触摸操作，获取触摸位置信息，以及获取在所述终端界面上显示的目标动态页面中的各个图片的图片位置信息；
基于所述触摸位置信息和所述各个图片的图片位置信息，确定所述各个图片中被触摸的目标图片，以及所述目标图片在所述终端界面中的目标图片位置信息；
基于所述触摸位置信息，判断在所述终端界面上是否存在多个触摸位置点；
当确定存在多个触摸位置点的情况下，在所述目标图片位置信息指示的目标图片位置处，创建原生图像视图组件，并基于所述原生图像视图组件渲染所述目标图片，以及，启动屏幕触摸事件拦截机制；
当拦截到针对所述目标图片的触摸事件时，根据所述目标图片的触摸事件中指示的触摸操作对所述原生图像视图组件渲染的所述目标图片进行相应处理。
2.根据权利要求1所述的方法，其特征在于，基于所述触摸位置信息和所述各个图片的图片位置信息，确定所述各个图片中被触摸的目标图片，以及所述目标图片在所述终端界面中的目标图片位置信息，包括：
基于所述各个图片在所述目标动态页面中的图片位置信息，以及所述目标动态页面与所述终端界面之间的坐标系转换关系，确定所述各个图片在所述终端界面中的图片位置信息；
基于所述触摸位置信息以及所述各个图片在所述终端界面中的图片位置信息，确定所述各个图片中被触摸的目标图片，以及所述目标图片在所述终端界面中的目标图片位置信息。
3.根据权利要求2所述的方法，其特征在于，基于所述触摸位置信息以及确定的所述各个图片在所述终端界面中的图片位置信息，确定所述各个图片中被触摸的目标图片，包括：
在所述触摸位置信息指示的触摸位置点为多个触摸位置点的情况下，基于所述各个图片在所述终端界面中的图片位置信息，从所述各个图片中，选择对应的图片区域包含所述多个触摸位置点的图片作为所述目标图片。
4.根据权利要求1所述的方法，其特征在于，根据所述目标图片的触摸事件中指示的触摸操作对所述原生图像视图组件渲染的所述目标图片进行相应处理，包括：
根据所述目标图片的触摸事件中指示的触摸操作，确定对所述目标图片的缩放属性信息；所述缩放属性信息包括缩放比例和缩放方向；
按照所述缩放属性信息，基于所述原生图像视图组件对所述目标图片进行渲染更新。
5.根据权利要求1所述的方法，其特征在于，基于所述触摸位置信息和所述各个图片的图片位置信息，确定所述各个图片中被触摸的目标图片，以及所述目标图片在所述终端界面中的目标图片位置信息之后，所述方法还包括：
在所述目标图片位置处，添加与所述目标动态页面中的目标图片大小匹配的占位图片；所述占位图片位于所述原生图像视图组件渲染的目标图片下方且位于所述目标动态页面中的目标图片上方。
6.根据权利要求1所述的方法，其特征在于，还包括：
检测到所述触摸操作停止时，基于所述原生图像视图组件对所述目标图片进行动画渲染，以使所述原生图像视图组件渲染的目标图片恢复至所述目标动态页面中的目标图片位置处，且与所述目标动态页面中的目标图片的大小一致。
7.一种页面处理装置，其特征在于，包括：
获取模块，用于响应于作用在终端界面上的触摸操作，获取触摸位置信息，以及获取在所述终端界面上显示的目标动态页面中的各个图片的图片位置信息；
第一确定模块，用于基于所述触摸位置信息和所述各个图片的图片位置信息，确定所述各个图片中被触摸的目标图片，以及所述目标图片在所述终端界面中的目标图片位置信息；
第二确定模块，用于基于所述触摸位置信息，判断在所述终端界面上是否存在多个触摸位置点；
渲染模块，用于当确定存在多个触摸位置点的情况下，在所述目标图片位置信息指示的目标图片位置处，创建原生图像视图组件并基于所述原生图像视图组件渲染所述目标图片，以及，启动屏幕触摸事件拦截机制；
处理模块，用于当拦截到针对所述目标图片的触摸事件时，根据所述目标图片的触摸事件中指示的触摸操作对所述原生图像视图组件渲染的所述目标图片进行相应处理。
8.一种计算机设备，其特征在于，包括：处理器、存储器和总线，所述存储器存储有所述处理器可执行的机器可读指令，当计算机设备运行时，所述处理器与所述存储器之间通过总线通信，所述机器可读指令被所述处理器执行时执行如权利要求1至6任一项所述的页面处理方法的步骤。
9.一种计算机可读存储介质，其特征在于，该计算机可读存储介质上存储有计算机程序，该计算机程序被处理器运行时执行如权利要求1至6任一项所述的页面处理方法的步骤。
CN202110796850.7A 2021-07-14 2021-07-14 一种页面处理方法、装置、电子设备及可读存储介质 Active CN113536173B (zh)

Priority Applications (3)

Application Number Priority Date Filing Date Title
CN202110796850.7A CN113536173B (zh) 2021-07-14 2021-07-14 一种页面处理方法、装置、电子设备及可读存储介质
EP22841082.5A EP4339808A1 (en) 2021-07-14 2022-06-07 Page processing method and apparatus, electronic device, and readable storage medium
PCT/CN2022/097301 WO2023284442A1 (zh) 2021-07-14 2022-06-07 一种页面处理方法、装置、电子设备及可读存储介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202110796850.7A CN113536173B (zh) 2021-07-14 2021-07-14 一种页面处理方法、装置、电子设备及可读存储介质

Publications (2)

Publication Number Publication Date
CN113536173A CN113536173A (zh) 2021-10-22
CN113536173B true CN113536173B (zh) 2024-01-16

Family

ID=78099122

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202110796850.7A Active CN113536173B (zh) 2021-07-14 2021-07-14 一种页面处理方法、装置、电子设备及可读存储介质

Country Status (3)

Country Link
EP (1) EP4339808A1 (zh)
CN (1) CN113536173B (zh)
WO (1) WO2023284442A1 (zh)

Families Citing this family (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN113536173B (zh) * 2021-07-14 2024-01-16 抖音视界有限公司 一种页面处理方法、装置、电子设备及可读存储介质
CN114491372B (zh) * 2022-02-08 2023-09-08 北京有竹居网络技术有限公司 页面处理方法、装置、电子设备及存储介质
CN116991528B (zh) * 2023-08-14 2024-03-19 腾讯科技（深圳）有限公司 一种页面切换方法、装置、存储介质和电子设备

Citations (10)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102012914A (zh) * 2010-11-22 2011-04-13 深圳市斯尔顿科技有限公司 一种网页图像的处理方法和装置
CN103279293A (zh) * 2013-04-27 2013-09-04 天脉聚源(北京)传媒科技有限公司 一种切换图片的方法、装置和终端
CN104077387A (zh) * 2014-06-27 2014-10-01 北京奇虎科技有限公司 一种网页内容显示方法和浏览器装置
CN106909354A (zh) * 2015-12-22 2017-06-30 北京奇虎科技有限公司 图片显示方法及装置
CN110221722A (zh) * 2019-05-27 2019-09-10 掌阅科技股份有限公司 图片处理方法、电子设备及存储介质
CN111459363A (zh) * 2020-03-31 2020-07-28 腾讯科技（深圳）有限公司 信息展示方法、装置、设备及存储介质
CN111736740A (zh) * 2020-03-24 2020-10-02 北京沃东天骏信息技术有限公司 图片热区生成方法、装置、设备和存储介质
CN112053286A (zh) * 2020-09-04 2020-12-08 北京字节跳动网络技术有限公司 图像处理方法、装置、电子设备和可读介质
CN112419137A (zh) * 2020-07-30 2021-02-26 上海幻电信息科技有限公司 遮罩图片显示方法、装置及遮罩图片显示方法、装置
CN112578971A (zh) * 2020-12-07 2021-03-30 腾讯科技（深圳）有限公司 页面内容展示方法、装置、计算机设备及存储介质

Family Cites Families (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US10795547B1 (en) * 2014-06-11 2020-10-06 Amazon Technologies, Inc. User-visible touch event queuing
CN105988702B (zh) * 2015-03-02 2019-08-06 阿里巴巴集团控股有限公司 查看对象图片的方法及系统
CN106406855A (zh) * 2016-08-26 2017-02-15 乐视控股（北京）有限公司 一种基于浏览器的图片处理方法及装置
CN108182021A (zh) * 2018-01-30 2018-06-19 腾讯科技（深圳）有限公司 多媒体信息展示方法、装置、存储介质及设备
CN108319414A (zh) * 2018-01-31 2018-07-24 北京小米移动软件有限公司 界面显示方法及装置
CN110413913A (zh) * 2019-07-04 2019-11-05 北京字节跳动网络技术有限公司 一种页面刷新方法、装置、终端及存储介质
CN113536173B (zh) * 2021-07-14 2024-01-16 抖音视界有限公司 一种页面处理方法、装置、电子设备及可读存储介质

Patent Citations (10)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102012914A (zh) * 2010-11-22 2011-04-13 深圳市斯尔顿科技有限公司 一种网页图像的处理方法和装置
CN103279293A (zh) * 2013-04-27 2013-09-04 天脉聚源(北京)传媒科技有限公司 一种切换图片的方法、装置和终端
CN104077387A (zh) * 2014-06-27 2014-10-01 北京奇虎科技有限公司 一种网页内容显示方法和浏览器装置
CN106909354A (zh) * 2015-12-22 2017-06-30 北京奇虎科技有限公司 图片显示方法及装置
CN110221722A (zh) * 2019-05-27 2019-09-10 掌阅科技股份有限公司 图片处理方法、电子设备及存储介质
CN111736740A (zh) * 2020-03-24 2020-10-02 北京沃东天骏信息技术有限公司 图片热区生成方法、装置、设备和存储介质
CN111459363A (zh) * 2020-03-31 2020-07-28 腾讯科技（深圳）有限公司 信息展示方法、装置、设备及存储介质
CN112419137A (zh) * 2020-07-30 2021-02-26 上海幻电信息科技有限公司 遮罩图片显示方法、装置及遮罩图片显示方法、装置
CN112053286A (zh) * 2020-09-04 2020-12-08 北京字节跳动网络技术有限公司 图像处理方法、装置、电子设备和可读介质
CN112578971A (zh) * 2020-12-07 2021-03-30 腾讯科技（深圳）有限公司 页面内容展示方法、装置、计算机设备及存储介质

Non-Patent Citations (1)

* Cited by examiner, † Cited by third party
Title
王海云，张颖峰.循序渐进学用Visual C++5.0.海洋出版社,1998,222-224. *

Also Published As

Publication number Publication date
WO2023284442A1 (zh) 2023-01-19
EP4339808A1 (en) 2024-03-20
CN113536173A (zh) 2021-10-22

Similar Documents

Publication Publication Date Title
CN113536173B (zh) 一种页面处理方法、装置、电子设备及可读存储介质
KR102118223B1 (ko) 크로스 윈도우 애니메이션
JP7032277B2 (ja) アイテム選択の曖昧性を解消するためのシステムおよび方法
US9792268B2 (en) Zoomable web-based wall with natural user interface
CN109669617B (zh) 用于切换页面的方法和装置
US11379112B2 (en) Managing content displayed on a touch screen enabled device
US10664155B2 (en) Managing content displayed on a touch screen enabled device using gestures
CN106485173B (zh) 敏感信息展示方法和装置
WO2014161347A1 (en) Method and device for relocating input box to target position in mobile terminal browser, and storage medium
CN114357345A (zh) 图片处理方法、装置、电子设备及计算机可读存储介质
CN113741763A (zh) 电子书的显示方法、装置及电子设备
CN107391914B (zh) 一种参数显示方法、装置及设备
CN110007831B (zh) 一种翻页控制方法、装置及终端设备
CN107491289B (zh) 一种窗口渲染方法及装置
US20140351745A1 (en) Content navigation having a selection function and visual indicator thereof
CN108108417B (zh) 跨平台自适应控制的交互方法、系统、设备及存储介质
JP2011086050A (ja) 情報処理端末及びコンピュータプログラム
CN116107531A (zh) 界面显示方法和装置
KR101294458B1 (ko) 모바일 디바이스에서의 텍스트 입력장치 및 그 방법
CN112181257B (zh) 思维导图的显示方法、装置、终端及存储介质
CN114895815A (zh) 数据处理方法和电子设备
CN112667931B (zh) 网页收藏方法、电子设备和存储介质
CN114491309A (zh) 图片处理方法和装置
CN111796736B (zh) 应用程序的分享方法、装置和电子设备
CN111506185B (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
CB02 Change of applicant information
CB02 Change of applicant information

Address after: 100041 B-0035, 2 floor, 3 building, 30 Shixing street, Shijingshan District, Beijing.

Applicant after: Douyin Vision Co.,Ltd.

Address before: 100041 B-0035, 2 floor, 3 building, 30 Shixing street, Shijingshan District, Beijing.

Applicant before: Tiktok vision (Beijing) Co.,Ltd.

Address after: 100041 B-0035, 2 floor, 3 building, 30 Shixing street, Shijingshan District, Beijing.

Applicant after: Tiktok vision (Beijing) Co.,Ltd.

Address before: 100041 B-0035, 2 floor, 3 building, 30 Shixing street, Shijingshan District, Beijing.

Applicant before: BEIJING BYTEDANCE NETWORK TECHNOLOGY Co.,Ltd.

GR01 Patent grant
GR01 Patent grant