Movatterモバイル変換


[0]ホーム

URL:


CN113157357A - Page display method, device, terminal and storage medium - Google Patents

Page display method, device, terminal and storage medium
Download PDF

Info

Publication number
CN113157357A
CN113157357ACN202010076679.8ACN202010076679ACN113157357ACN 113157357 ACN113157357 ACN 113157357ACN 202010076679 ACN202010076679 ACN 202010076679ACN 113157357 ACN113157357 ACN 113157357A
Authority
CN
China
Prior art keywords
target
background
foreground object
background image
page
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
Application number
CN202010076679.8A
Other languages
Chinese (zh)
Other versions
CN113157357B (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.)
Huawei Technologies Co Ltd
Original Assignee
Huawei Technologies 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 Huawei Technologies Co LtdfiledCriticalHuawei Technologies Co Ltd
Priority to CN202010076679.8ApriorityCriticalpatent/CN113157357B/en
Publication of CN113157357ApublicationCriticalpatent/CN113157357A/en
Application grantedgrantedCritical
Publication of CN113157357BpublicationCriticalpatent/CN113157357B/en
Activelegal-statusCriticalCurrent
Anticipated expirationlegal-statusCritical

Links

Images

Classifications

Landscapes

Abstract

The application is applicable to the technical field of image processing, and provides a page display method, a device, a terminal and a storage medium, wherein the method comprises the following steps: adjusting an original background image in a target page into a target background image corresponding to the current display mode; identifying associated background areas of each foreground object in the target page in the target background image; adjusting the foreground object to a target object corresponding to the display mode according to the background pixel value of the associated background area; and generating the target page according to all the target objects and the target background image. According to the technical scheme, when the foreground object is adjusted, the adjusting strategy can be determined according to the associated background area, the situation that the color of the adjusted background image is the same as or similar to that of the foreground object is avoided, and the display effect of the page is improved.

Description

Translated fromChinese
一种页面显示的方法、装置、终端以及存储介质A method, device, terminal and storage medium for page display

技术领域technical field

本申请属于图像处理技术领域,尤其涉及一种页面显示的方法、装置、终端以及存储介 质。The present application belongs to the technical field of image processing, and in particular, relates to a method, device, terminal and storage medium for page display.

背景技术Background technique

手机、平板电脑等终端设备,可以根据当前的显示模式调整页面内的各个显示对象的颜 色,以使页面与显示模式相匹配,例如在深色显示模式下,可以对文字、图标等前景对象进 行反色以及背景调暗,从而使得显示的页面与深色显示模式相匹配。由于页面背景与前景对 象的调整过程是分别进行的,有可能会出现调整后的页面背景与前景对象之间的颜色相同或 接近,降低了前景对象与背景之间的对比度,以及影响页面的显示效果。Terminal devices such as mobile phones and tablet computers can adjust the color of each display object in the page according to the current display mode, so that the page matches the display mode. For example, in the dark display mode, foreground objects such as text and icons can be displayed. Inverts the colors and darkens the background so that the displayed page matches the dark display mode. Since the adjustment process of the page background and the foreground object is carried out separately, it is possible that the color between the adjusted page background and the foreground object is the same or close to that, which reduces the contrast between the foreground object and the background, and affects the display of the page. Effect.

发明内容SUMMARY OF THE INVENTION

本申请实施例提供了一种页面显示的方法、装置、终端以及存储介质,可以解决现有的 页面显示技术,根据显示模式对页面内图像以及前景对象进行调整后,会出现颜色相同或相 似的问题。The embodiments of the present application provide a method, device, terminal, and storage medium for page display, which can solve the problem of existing page display technologies. question.

第一方面,本申请实施例提供了一种页面显示的方法,包括:In a first aspect, an embodiment of the present application provides a method for displaying a page, including:

将目标页面内的原始背景图像,调整为与当前的显示模式对应的目标背景图像;Adjust the original background image in the target page to the target background image corresponding to the current display mode;

识别所述目标页面内各个前景对象在所述目标背景图像内的关联背景区域;Identifying the associated background area of each foreground object in the target page in the target background image;

根据所述关联背景区域的背景像素值,将所述前景对象调整为与所述显示模式对应的目 标对象;Adjusting the foreground object to a target object corresponding to the display mode according to the background pixel value of the associated background area;

根据所有所述目标对象以及所述目标背景图像,生成所述目标页面。The target page is generated according to all the target objects and the target background image.

在第一方面的一种可能的实现方式中,所述识别所述目标页面内各个前景对象在所述目 标背景图像内的关联背景区域,包括:In a possible implementation manner of the first aspect, the identifying the associated background area of each foreground object in the target page in the target background image includes:

将所述目标背景图像划分为多个候选背景区域;dividing the target background image into multiple candidate background regions;

根据所述前景对象的中心坐标以及所述目标背景图像的边界坐标,从所述候选背景区域 中选取与所述前景对象对应的所述关联背景区域。According to the center coordinates of the foreground object and the boundary coordinates of the target background image, the associated background region corresponding to the foreground object is selected from the candidate background regions.

在第一方面的一种可能的实现方式中,所述将所述目标背景图像划分为多个候选背景区 域,包括:In a possible implementation manner of the first aspect, the described target background image is divided into multiple candidate background regions, including:

获取最小前景尺寸,将所述最小前景尺寸作为确定分块尺寸;Obtain the minimum foreground size, and use the minimum foreground size as the determined block size;

基于所述分块尺寸对所述目标背景图像进行划分,得到多个所述候选背景区域。The target background image is divided based on the block size to obtain a plurality of the candidate background regions.

在第一方面的一种可能的实现方式中,所述根据所述前景对象的中心坐标以及所述目标 背景图像的边界坐标,从所述候选背景区域中选取与所述前景对象对应的所述关联背景区域, 包括:In a possible implementation manner of the first aspect, according to the center coordinates of the foreground object and the boundary coordinates of the target background image, the selection of the foreground object corresponding to the foreground object is selected from the candidate background regions. Associated background areas, including:

根据各个候选背景区域的在所述目标背景图像的显示位置,为各个候选背景区域配置关 联的基准行列号;According to the display position of each candidate background region in the target background image, configure the associated reference row and column number for each candidate background region;

Figure BDA0002378659890000021
Figure BDA0002378659890000021

其中,Colunm0为所述候选背景区域的基准列序号;Row0为所述所述候选背景区域的基 准行序号;(SrcX0,SrcY0)为所述候选背景图像的边界坐标;(pX,pY)为所述候选背景区域的 中心坐标;(Sizex,Sizey)为所述候选背景区域的区域尺寸;Wherein, Colunm0 is the reference column sequence number of the candidate background region; Row0 is the reference row sequence number of the candidate background region; (SrcX0 , SrcY0 ) are the boundary coordinates of the candidate background image; (pX, pY) is the center coordinate of the candidate background area; (Sizex , Sizey ) is the area size of the candidate background area;

将所述前景对象中心坐标导入预设的行列转换模型,计算所述前景对象的目标行列号; 所述行列转换模型具体为:The center coordinates of the foreground object are imported into a preset row-column conversion model, and the target row-column number of the foreground object is calculated; the row-column conversion model is specifically:

Figure BDA0002378659890000022
Figure BDA0002378659890000022

其中,Colunm1为所述目标行列号内的列序号;Row1为所述目标行列号内的行序号;(SrcX1,SrcY1)为所述前景对象的中心坐标;(Sizex,Sizey)为所述候选背景区域的区域尺寸; (Targetx,Targety)为所述前景对象的对象尺寸;Wherein, Colunm1 is the column number in the target row and column number; Row1 is the row number in the target row and column number; (SrcX1 , SrcY1 ) is the center coordinate of the foreground object; (Sizex , Sizey ) is the area size of the candidate background area; (Targetx , Targety ) is the object size of the foreground object;

选取所述基准行列号与所述目标行列号匹配的所述候选背景区域作为所述前景对象的 关联背景区域。The candidate background area whose reference row and column number matches the target row and column number is selected as the associated background area of the foreground object.

在第一方面的一种可能的实现方式中,所述显示模式为深色显示模式,则所述根据所述 关联背景区域的背景像素值,将所述前景对象调整为与所述显示模式对应的目标对象,包括:In a possible implementation manner of the first aspect, the display mode is a dark display mode, and the foreground object is adjusted to correspond to the display mode according to the background pixel value of the associated background area target audience, including:

获取关联背景区域的中心坐标的像素值以及透明度;Get the pixel value and transparency of the center coordinate of the associated background area;

根据所述中心坐标的所述像素值以及所述透明度,确定所述关联背景区域的背景亮度值;Determine the background brightness value of the associated background area according to the pixel value of the center coordinate and the transparency;

若所述背景亮度值大于预设的亮度阈值,则对所述前景对象进行降低亮度处理,生成所 述目标对象;If the background brightness value is greater than a preset brightness threshold, then reduce the brightness of the foreground object to generate the target object;

若所述背景亮度值小于或等于所述亮度阈值,则对所述前景对象进行反色处理,生成所 述目标对象。If the background brightness value is less than or equal to the brightness threshold, the foreground object is subjected to inverse color processing to generate the target object.

在第一方面的一种可能的实现方式中,在所述根据所述中心坐标的所述像素值以及所述 透明度,确定所述关联背景区域的亮度值之后,还包括:In a possible implementation manner of the first aspect, after determining the brightness value of the associated background region according to the pixel value of the center coordinate and the transparency, the method further includes:

根据所述前景对象内各个像素点的所述像素值,确定所述前景对象对应的特征亮度值;According to the pixel value of each pixel in the foreground object, determine the characteristic brightness value corresponding to the foreground object;

若所述背景亮度值与所述特征亮度值之间的亮度差值大于预设的反色阈值,则对所述前 景对象进行降低亮度处理,生成所述目标对象;If the brightness difference between the background brightness value and the feature brightness value is greater than a preset inverse color threshold, then the foreground object is subjected to brightness reduction processing to generate the target object;

若所述亮度差值小于或等于所述反色阈值,则对所述前景对象进行反色处理,生成所述 目标对象。If the luminance difference value is less than or equal to the inverse color threshold, inverse color processing is performed on the foreground object to generate the target object.

在第一方面的一种可能的实现方式中,所述识别所述目标页面内各个前景对象在所述目 标背景图像内的关联背景区域,包括:In a possible implementation manner of the first aspect, the identifying the associated background area of each foreground object in the target page in the target background image includes:

确定所述前景对象在所述目标页面内的显示层级;determining the display level of the foreground object in the target page;

在所述目标页面内选取与所述显示层级相邻层级的目标背景图像作为所述前景对象的 关联背景图像;In the target page, the target background image of the adjacent level of the display level is selected as the associated background image of the foreground object;

确定所述前景对象在所述关联背景图像内的关联背景区域。An associated background region of the foreground object within the associated background image is determined.

在第一方面的一种可能的实现方式中,所述根据所述关联背景区域的背景像素值,将所 述前景对象调整为与所述显示模式对应的目标对象,包括:In a possible implementation manner of the first aspect, adjusting the foreground object to a target object corresponding to the display mode according to the background pixel value of the associated background area, includes:

根据所述关联背景区域的背景像素值以及所述前景对象的像素值,生成所述前景对象对 应的预览对象;Generate a preview object corresponding to the foreground object according to the background pixel value of the associated background area and the pixel value of the foreground object;

根据所述预览对象对应的所有关联对象的像素值以及所述预览对象的像素值,生成所述 前景对象对应的所述目标对象。The target object corresponding to the foreground object is generated according to the pixel values of all associated objects corresponding to the preview object and the pixel values of the preview object.

第二方面,本申请实施例提供了一种页面显示的装置,包括:In a second aspect, an embodiment of the present application provides a device for displaying pages, including:

背景图像调整单元,用于将目标页面内的原始背景图像,调整为与当前的显示模式对应 的目标背景图像;The background image adjustment unit is used to adjust the original background image in the target page to the target background image corresponding to the current display mode;

关联背景区域识别单元,用于识别所述目标页面内各个前景对象在所述目标背景图像内 的关联背景区域;An associated background area identification unit, for identifying the associated background area of each foreground object in the target background image in the target page;

前景对象调整单元,用于根据所述关联背景区域的背景像素值,将所述前景对象调整为 与所述显示模式对应的目标对象;A foreground object adjustment unit, for adjusting the foreground object to a target object corresponding to the display mode according to the background pixel value of the associated background area;

目标页面生成单元,用于根据所有所述目标对象以及所述目标背景图像,生成所述目标 页面。A target page generating unit, configured to generate the target page according to all the target objects and the target background image.

第三方面,本申请实施例提供了一种终端设备,存储器、处理器以及存储在所述存储器 中并可在所述处理器上运行的计算机程序,其特征在于,所述处理器执行所述计算机程序时 实现上述第一方面中任一项所述页面显示的方法。In a third aspect, embodiments of the present application provide a terminal device, a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the processor executes the A computer program implements the method for displaying a page according to any one of the above-mentioned first aspects.

第四方面,本申请实施例提供了一种计算机可读存储介质,所述计算机可读存储介质存 储有计算机程序,其特征在于,所述计算机程序被处理器执行时实现上述第一方面中任一项 所述页面显示的方法。In a fourth aspect, an embodiment of the present application provides a computer-readable storage medium, where a computer program is stored in the computer-readable storage medium, wherein, when the computer program is executed by a processor, any one of the above-mentioned first aspect is implemented. A method by which the page is displayed.

第五方面,本申请实施例提供了一种计算机程序产品,当计算机程序产品在终端设备上 运行时,使得终端设备执行上述第一方面中任一项所述页面显示的方法。In a fifth aspect, an embodiment of the present application provides a computer program product that, when the computer program product runs on a terminal device, enables the terminal device to execute the method for displaying a page in any one of the above-mentioned first aspect.

可以理解的是,上述第二方面至第五方面的有益效果可以参见上述第一方面中的相关描 述,在此不再赘述。It can be understood that, for the beneficial effects of the second aspect to the fifth aspect, reference may be made to the relevant description in the first aspect, which will not be repeated here.

本申请实施例与现有技术相比存在的有益效果是:The beneficial effects that the embodiments of the present application have compared with the prior art are:

本申请实施例通过对目标页面内的原始背景图像进行调整,得到目标背景图像,继而根 据各个前景对象在目标背景图像内的关联背景区域的亮度值,确定前景对象的调整策略,并 根据调整策略生成前景对象对应的目标对象,最后根据目标背景图像以及目标对象生成目标 页面,在调整前景对象时,根据关联的背景区域确定调整策略,避免了调整后的背景图像与 前景对象出现颜色相同或相似,提高了页面的显示效果。The embodiment of the present application obtains the target background image by adjusting the original background image in the target page, and then determines the adjustment strategy of the foreground object according to the brightness value of the associated background area of each foreground object in the target background image, and according to the adjustment strategy Generate the target object corresponding to the foreground object, and finally generate the target page according to the target background image and the target object. When adjusting the foreground object, determine the adjustment strategy according to the associated background area, so as to avoid the adjusted background image and the foreground object appearing in the same or similar color , which improves the display effect of the page.

附图说明Description of drawings

为了更清楚地说明本申请实施例中的技术方案,下面将对实施例或现有技术描述中所需 要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本申请的一些实施例, 对于本领域普通技术人员来讲,在不付出创造性劳动性的前提下,还可以根据这些附图获得 其他的附图。In order to illustrate the technical solutions in the embodiments of the present application more clearly, the following briefly introduces the accompanying drawings that need to be used in the description of the embodiments or the prior art. Obviously, the drawings in the following description are only for the present application. In some embodiments, for those of ordinary skill in the art, other drawings can also be obtained according to these drawings without any creative effort.

图1是本申请实施例提供的手机的部分结构的框图;1 is a block diagram of a partial structure of a mobile phone provided by an embodiment of the present application;

图2是本申请实施例的手机的软件结构示意图;2 is a schematic diagram of a software structure of a mobile phone according to an embodiment of the present application;

图3是本申请第一实施例提供的一种页面显示的方法的实现流程图;Fig. 3 is the realization flow chart of a kind of page display method provided by the first embodiment of the present application;

图4是本申请一实施例提供的深色显示模式的示意图;4 is a schematic diagram of a dark display mode provided by an embodiment of the present application;

图5是本申请一实施例提供的深色显示模式的示意图;5 is a schematic diagram of a dark display mode provided by an embodiment of the present application;

图6是本申请一实施例提供的关联背景区域的识别示意图;6 is a schematic diagram of identification of an associated background area provided by an embodiment of the present application;

图7是本申请另一实施例提供的关联背景区域的识别示意图;7 is a schematic diagram of identification of an associated background area provided by another embodiment of the present application;

图8是本申请第二实施例提供的一种页面显示的方法S302的具体实现流程图FIG. 8 is a flowchart of a specific implementation of a method S302 for page display provided by the second embodiment of the present application

图9是本申请一实施例提供的页面显示的过程中各处理单元的交互示意图;FIG. 9 is a schematic diagram of interaction of each processing unit in a page display process provided by an embodiment of the present application;

图10是本申请一实施例提供的基于深色显示模式的页面显示的流程示意图;10 is a schematic flowchart of page display based on a dark display mode provided by an embodiment of the present application;

图11是本申请第三实施例提供的一种页面显示的方法S801的具体实现流程图;FIG. 11 is a specific implementation flowchart of a method S801 for page display provided by the third embodiment of the present application;

图12是本申请一实施例提供的候选背景区域的划分示意图;FIG. 12 is a schematic diagram of the division of candidate background regions provided by an embodiment of the present application;

图13是本申请第四实施例提供的一种页面显示的方法S802的具体实现流程图;FIG. 13 is a specific implementation flowchart of a method S802 for page display provided by the fourth embodiment of the present application;

图14是本申请一实施例提供的目标行列号的选取示意图;14 is a schematic diagram of selection of target row and column numbers provided by an embodiment of the present application;

图15是本申请第五实施例提供的一种页面显示的方法S304的具体实现流程图;FIG. 15 is a specific implementation flowchart of a method S304 for page display provided by the fifth embodiment of the present application;

图16是本申请第六实施例提供的一种页面显示的方法的具体实现流程图;16 is a specific implementation flowchart of a method for displaying a page provided by the sixth embodiment of the present application;

图17是本申请第七实施例提供的一种页面显示的方法S302的具体实现流程图;FIG. 17 is a specific implementation flowchart of a method S302 for page display provided by the seventh embodiment of the present application;

图18是本申请第八实施例提供的一种页面显示的方法S303的具体实现流程图;18 is a specific implementation flowchart of a method S303 for page display provided by the eighth embodiment of the present application;

图19是本申请一实施例提供的目标对象的生成示意图;19 is a schematic diagram of generating a target object provided by an embodiment of the present application;

图20是本申请一实施例提供的一种页面显示的设备的结构框图;20 is a structural block diagram of a device for displaying pages provided by an embodiment of the present application;

图21本申请另一实施例提供的一种终端设备的示意图。FIG. 21 is a schematic diagram of a terminal device provided by another embodiment of the present application.

具体实施方式Detailed ways

以下描述中,为了说明而不是为了限定,提出了诸如特定系统结构、技术之类的具体细 节,以便透彻理解本申请实施例。然而,本领域的技术人员应当清楚,在没有这些具体细节 的其它实施例中也可以实现本申请。在其它情况中,省略对众所周知的系统、装置、电路以 及方法的详细说明,以免不必要的细节妨碍本申请的描述。In the following description, for the purpose of illustration rather than limitation, specific details, such as specific system structures and technologies, are provided so as to provide a thorough understanding of the embodiments of the present application. However, it will be apparent to those skilled in the art that the present application may be practiced in other embodiments without these specific details. In other instances, detailed descriptions of well-known systems, devices, circuits, and methods are omitted so as not to obscure the description of the present application with unnecessary detail.

应当理解,当在本申请说明书和所附权利要求书中使用时,术语“包括”指示所描述特 征、整体、步骤、操作、元素和/或组件的存在,但并不排除一个或多个其它特征、整体、步骤、操作、元素、组件和/或其集合的存在或添加。It is to be understood that, when used in this specification and the appended claims, the term "comprising" indicates the presence of the described feature, integer, step, operation, element and/or component, but does not exclude one or more other The presence or addition of features, integers, steps, operations, elements, components and/or sets thereof.

还应当理解,在本申请说明书和所附权利要求书中使用的术语“和/或”是指相关联列 出的项中的一个或多个的任何组合以及所有可能组合,并且包括这些组合。It should also be understood that, as used in this specification and the appended claims, the term "and/or" refers to and including any and all possible combinations of one or more of the associated listed items.

如在本申请说明书和所附权利要求书中所使用的那样,术语“如果”可以依据上下文被 解释为“当...时”或“一旦”或“响应于确定”或“响应于检测到”。类似地,短语“如果确定”或“如果检测到[所描述条件或事件]”可以依据上下文被解释为意指“一旦确定”或“响应于确定”或“一旦检测到[所描述条件或事件]”或“响应于检测到[所描述条件或事件]”。As used in the specification of this application and the appended claims, the term "if" may be contextually interpreted as "when" or "once" or "in response to determining" or "in response to detecting ". Similarly, the phrases "if it is determined" or "if the [described condition or event] is detected" may be interpreted, depending on the context, to mean "once it is determined" or "in response to the determination" or "once the [described condition or event] is detected. ]" or "in response to detection of the [described condition or event]".

另外,在本申请说明书和所附权利要求书的描述中,术语“第一”、“第二”、“第三”等仅用于区分描述,而不能理解为指示或暗示相对重要性。In addition, in the description of the specification of the present application and the appended claims, the terms "first", "second", "third", etc. are only used to distinguish the description, and should not be construed as indicating or implying relative importance.

在本申请说明书中描述的参考“一个实施例”或“一些实施例”等意味着在本申请的一 个或多个实施例中包括结合该实施例描述的特定特征、结构或特点。由此,在本说明书中的 不同之处出现的语句“在一个实施例中”、“在一些实施例中”、“在其他一些实施例中”、 “在另外一些实施例中”等不是必然都参考相同的实施例,而是意味着“一个或多个但不是 所有的实施例”,除非是以其他方式另外特别强调。术语“包括”、“包含”、“具有”及 它们的变形都意味着“包括但不限于”,除非是以其他方式另外特别强调。References in this specification to "one embodiment" or "some embodiments" and the like mean that a particular feature, structure or characteristic described in connection with the embodiment is included in one or more embodiments of this application. Thus, appearances of the phrases "in one embodiment," "in some embodiments," "in other embodiments," "in other embodiments," etc. in various places in this specification are not necessarily All refer to the same embodiment, but mean "one or more but not all embodiments" unless specifically emphasized otherwise. The terms "including", "including", "having" and their variants mean "including but not limited to" unless specifically emphasized otherwise.

本申请实施例提供的页面显示的方法可以应用于手机、平板电脑、可穿戴设备、车载设 备、增强现实(augmented reality,AR)/虚拟现实(virtual reality,VR)设备、笔记本电脑、超级 移动个人计算机(ultra-mobile personal computer,UMPC)、上网本、个人数字助理(personal digital assistant,PDA)等终端设备上,还可以应用于具有显示功能的数据库、服务器以及基 于终端人工智能的服务响应系统,本申请实施例对终端设备的具体类型不作任何限制。The page display method provided by the embodiments of the present application can be applied to mobile phones, tablet computers, wearable devices, in-vehicle devices, augmented reality (AR)/virtual reality (VR) devices, notebook computers, super mobile personal Computer (ultra-mobile personal computer, UMPC), netbook, personal digital assistant (personal digital assistant, PDA) and other terminal devices, can also be applied to databases with display functions, servers and service response systems based on terminal artificial intelligence. The embodiments of the application do not impose any restrictions on the specific type of the terminal device.

例如,所述终端设备可以是WLAN中的站点(STAION,ST),可以是蜂窝电话、无绳电话、会话启动协议(Session InitiationProtocol,SIP)电话、无线本地环路(WirelessLocal Loop, WLL)站、个人数字处理(Personal Digital Assistant,PDA)设备、具有无线通信功能的手持设 备、计算设备或连接到无线调制解调器的其它处理设备、电脑、膝上型计算机、手持式通信 设备、手持式计算设备、和/或用于在无线系统上进行通信的其它设备以及下一代通信系统, 例如,5G网络中的移动终端或者未来演进的公共陆地移动网络(Public Land Mobile Network, PLMN)网络中的移动终端等。For example, the terminal device may be a station (STAION, ST) in a WLAN, a cellular phone, a cordless phone, a Session Initiation Protocol (Session Initiation Protocol, SIP) phone, a Wireless Local Loop (WLL) station, a personal Digital Processing (Personal Digital Assistant, PDA) devices, handheld devices with wireless communication capabilities, computing devices or other processing devices connected to wireless modems, computers, laptop computers, handheld communication devices, handheld computing devices, and/or Or other devices for communicating on wireless systems and next-generation communication systems, for example, mobile terminals in a 5G network or mobile terminals in a future evolved public land mobile network (Public Land Mobile Network, PLMN) network, and the like.

作为示例而非限定,当所述终端设备为可穿戴设备时,该可穿戴设备还可以是应用穿戴 式技术对日常穿戴进行智能化设计、开发出可以穿戴的设备的总称,如具有拍摄功能的眼镜、 手套、手表、服饰及鞋等。可穿戴设备即直接穿在身上,或是整合到用户的衣服或配件的一 种便携式设备,通过附着与用户身上,用于记录用户行进过程中的图像或根据用户发起的拍 摄指令,采集环境图像等。可穿戴设备不仅仅是一种硬件设备,更是通过软件支持以及数据 交互、云端交互来实现强大的功能。广义穿戴式智能设备包括功能全、尺寸大、可不依赖智 能手机实现完整或者部分的功能,如智能手表或智能眼镜等,以及只专注于某一类应用功能, 需要和其它设备如智能手机配合使用,如各类进行具有显示屏的智能手表、智能手环等。As an example and not a limitation, when the terminal device is a wearable device, the wearable device may also be a general term for the intelligent design of daily wear and the development of wearable devices using wearable technology, such as a camera with a shooting function. Glasses, gloves, watches, clothing and shoes, etc. A wearable device is a portable device that is directly worn on the body or integrated into the user's clothes or accessories. By attaching to the user's body, it is used to record images during the user's journey or collect environmental images according to the shooting instructions initiated by the user. Wait. Wearable device is not only a hardware device, but also realizes powerful functions through software support, data interaction, and cloud interaction. In a broad sense, wearable smart devices include full functions, large sizes, and can achieve complete or partial functions without relying on smart phones, such as smart watches or smart glasses, and only focus on a certain type of application function, which needs to be used in conjunction with other devices such as smart phones. , such as various types of smart watches with display screens, smart bracelets, etc.

以所述终端设备为手机为例。图1示出的是与本申请实施例提供的手机的部分结构的框 图。参考图1,手机包括:射频(Radio Frequency,RF)电路110、存储器120、输入单元130、显示单元140、传感器150、音频电路160、近场通信模块170、处理器180、以及电源 190等部件。本领域技术人员可以理解,图1中示出的手机结构并不构成对手机的限定,可 以包括比图示更多或更少的部件,或者组合某些部件,或者不同的部件布置。Take the terminal device as a mobile phone as an example. Fig. 1 shows a block diagram of a partial structure of a mobile phone provided by an embodiment of the present application. Referring to FIG. 1 , the mobile phone includes: a radio frequency (RF)circuit 110 , amemory 120 , aninput unit 130 , adisplay unit 140 , asensor 150 , anaudio circuit 160 , a nearfield communication module 170 , aprocessor 180 , apower supply 190 and other components . Those skilled in the art can understand that the structure of the mobile phone shown in FIG. 1 does not constitute a limitation on the mobile phone, and may include more or less components than the one shown, or combine some components, or arrange different components.

下面结合图1对手机的各个构成部件进行具体的介绍:The following describes the various components of the mobile phone in detail with reference to Figure 1:

RF电路110可用于收发信息或通话过程中,信号的接收和发送,特别地,将基站的下 行信息接收后,给处理器180处理;另外,将设计上行的数据发送给基站。通常,RF电路包括但不限于天线、至少一个放大器、收发信机、耦合器、低噪声放大器(Low NoiseAmplifier, LNA)、双工器等。此外,RF电路110还可以通过无线通信与网络和其他设备通信。上述 无线通信可以使用任一通信标准或协议,包括但不限于全球移动通讯系统(Global System of Mobile communication,GSM)、通用分组无线服务(General PacketRadio Service,GPRS)、 码分多址(Code Division Multiple Access,CDMA)、宽带码分多址(Wideband Code Division Multiple Access,WCDMA)、长期演进(Long TermEvolution,LTE))、电子邮件、短消息服 务(Short Messaging Service,SMS)等,通过RF电路110接收服务器发送的关于目标页面 的页面数据,并根据页面数据生成目标页面。TheRF circuit 110 can be used for receiving and sending signals during sending and receiving of information or during a call, in particular, after receiving the downlink information of the base station, it is processed by theprocessor 180; in addition, it sends the designed uplink data to the base station. Typically, the RF circuit includes, but is not limited to, an antenna, at least one amplifier, a transceiver, a coupler, a Low Noise Amplifier (LNA), a duplexer, and the like. In addition, theRF circuitry 110 may also communicate with networks and other devices via wireless communication. The above-mentioned wireless communication can use any communication standard or protocol, including but not limited to Global System of Mobile Communication (GSM), General Packet Radio Service (General Packet Radio Service, GPRS), Code Division Multiple Access (Code Division Multiple Access) Access, CDMA), Wideband Code Division Multiple Access (Wideband Code Division Multiple Access, WCDMA), Long Term Evolution (Long Term Evolution, LTE)), email, Short Messaging Service (Short Messaging Service, SMS), etc., received through theRF circuit 110 The page data about the target page sent by the server, and the target page is generated according to the page data.

存储器120可用于存储软件程序以及模块,处理器180通过运行存储在存储器120的软 件程序以及模块,从而执行手机的各种功能应用以及数据处理,例如将目标页面的页面数据 存储于存储器120的缓存区域内,根据当前的显示模式对页面数据进行调整后,再生成目标 页面。存储器120可主要包括存储程序区和存储数据区,其中,存储程序区可存储操作系统、 至少一个功能所需的应用程序(比如声音播放功能、图像播放功能等)等;存储数据区可存 储根据手机的使用所创建的数据(比如音频数据、电话本等)等。此外,存储器120可以包 括高速随机存取存储器,还可以包括非易失性存储器,例如至少一个磁盘存储器件、闪存器 件、或其他易失性固态存储器件。Thememory 120 can be used to store software programs and modules, and theprocessor 180 executes various functional applications and data processing of the mobile phone by running the software programs and modules stored in thememory 120, such as storing page data of the target page in the cache of thememory 120. In the area, after adjusting the page data according to the current display mode, the target page is generated. Thememory 120 may mainly include a storage program area and a storage data area, wherein the storage program area may store an operating system, an application program (such as a sound playback function, an image playback function, etc.) required for at least one function, and the like; Data created by the use of the mobile phone (such as audio data, phone book, etc.), etc. Additionally,memory 120 may include high-speed random access memory, and may also include non-volatile memory, such as at least one magnetic disk storage device, flash memory device, or other volatile solid state storage device.

输入单元130可用于接收输入的数字或字符信息,以及产生与手机100的用户设置以及 功能控制有关的键信号输入。具体地,输入单元130可包括触控面板131以及其他输入设备 132。触控面板131,也称为触摸屏,可收集用户在其上或附近的触摸操作(比如用户使用手 指、触笔等任何适合的物体或附件在触控面板131上或在触控面板131附近的操作),并根 据预先设定的程式驱动相应的连接装置。Theinput unit 130 may be used to receive input numerical or character information, and generate key signal input related to user settings and function control of the mobile phone 100. Specifically, theinput unit 130 may include atouch panel 131 andother input devices 132. Thetouch panel 131, also referred to as a touch screen, can collect the user's touch operations on or near it (such as the user's finger, stylus, etc., any suitable objects or accessories on or near the touch panel 131 ). operation), and drive the corresponding connection device according to the preset program.

显示单元140可用于显示由用户输入的信息或提供给用户的信息以及手机的各种菜单, 例如输出调整后的校正图像。显示单元140可包括显示面板141,可选的,可以采用液晶显 示器(Liquid Crystal Display,LCD)、有机发光二极管(Organic Light-EmittingDiode,OLED) 等形式来配置显示面板141。进一步的,触控面板131可覆盖显示面板141,当触控面板131 检测到在其上或附近的触摸操作后,传送给处理器180以确定触摸事件的类型,随后处理器 180根据触摸事件的类型在显示面板141上提供相应的视觉输出。虽然在图1中,触控面板 131与显示面板141是作为两个独立的部件来实现手机的输入和输入功能,但是在某些实施 例中,可以将触控面板131与显示面板141集成而实现手机的输入和输出功能。Thedisplay unit 140 may be used to display information input by the user or information provided to the user and various menus of the mobile phone, such as outputting an adjusted correction image. Thedisplay unit 140 may include adisplay panel 141. Optionally, thedisplay panel 141 may be configured in the form of a liquid crystal display (LCD), an organic light-emitting diode (OLED), or the like. Further, thetouch panel 131 may cover thedisplay panel 141. When thetouch panel 131 detects a touch operation on or near it, it transmits it to theprocessor 180 to determine the type of the touch event, and then theprocessor 180 determines the type of the touch event according to the touch event. Type provides corresponding visual output ondisplay panel 141 . Although in FIG. 1, thetouch panel 131 and thedisplay panel 141 are used as two independent components to realize the input and input functions of the mobile phone, in some embodiments, thetouch panel 131 and thedisplay panel 141 can be integrated to form a Realize the input and output functions of the mobile phone.

手机100还可包括至少一种传感器150,比如光传感器、运动传感器以及其他传感器。 具体地,光传感器可包括环境光传感器及接近传感器,其中,环境光传感器可根据环境光线 的明暗来调节显示面板141的亮度,接近传感器可在手机移动到耳边时,关闭显示面板141 和/或背光。作为运动传感器的一种,加速计传感器可检测各个方向上(一般为三轴)加速 度的大小,静止时可检测出重力的大小及方向,可用于识别手机姿态的应用(比如横竖屏切 换、相关游戏、磁力计姿态校准)、振动识别相关功能(比如计步器、敲击)等;至于手机 还可配置的陀螺仪、气压计、湿度计、温度计、红外线传感器等其他传感器,在此不再赘述。The cell phone 100 may also include at least onesensor 150, such as a light sensor, a motion sensor, and other sensors. Specifically, the light sensor may include an ambient light sensor and a proximity sensor, wherein the ambient light sensor may adjust the brightness of thedisplay panel 141 according to the brightness of the ambient light, and the proximity sensor may turn off thedisplay panel 141 and/or when the mobile phone is moved to the ear. or backlight. As a kind of motion sensor, the accelerometer sensor can detect the magnitude of acceleration in all directions (usually three axes), and can detect the magnitude and direction of gravity when it is stationary. games, magnetometer attitude calibration), vibration recognition related functions (such as pedometer, tapping), etc.; as for other sensors such as gyroscope, barometer, hygrometer, thermometer, infrared sensor, etc. Repeat.

手机100还可以包括摄像头160。可选地,摄像头在手机100的上的位置可以为前置的, 也可以为后置的,本申请实施例对此不作限定。The cell phone 100 may also include acamera 160 . Optionally, the position of the camera on the mobile phone 100 may be front or rear, which is not limited in this embodiment of the present application.

可选地,手机100可以包括单摄像头、双摄像头或三摄像头等,本申请实施例对此不作 限定。Optionally, the mobile phone 100 may include a single camera, a dual camera, or a triple camera, etc., which is not limited in this embodiment of the present application.

例如,手机100可以包括三摄像头,其中,一个为主摄像头、一个为广角摄像头、一个 为长焦摄像头。For example, the mobile phone 100 may include three cameras, wherein one is a main camera, one is a wide-angle camera, and one is a telephoto camera.

可选地,当手机100包括多个摄像头时,这多个摄像头可以全部前置,或者全部后置, 或者一部分前置、另一部分后置,本申请实施例对此不作限定。Optionally, when the mobile phone 100 includes multiple cameras, the multiple cameras may be all front-facing, or all rear-facing, or a part of the front-facing camera and another part of the rear-facing camera, which is not limited in this embodiment of the present application.

终端设备可以通过近场通信模块170可以接收其他设备发送的设备信息页面,例如该近 场通信模块170集成有蓝牙通信模块,通过蓝牙通信模块与其他手机建立通信连接,并接收 其他手机反馈的设备信息,生成与该其他手机对应的设备信息页面。虽然图1示出了近场通 信模块170,但是可以理解的是,其并不属于手机100的必须构成,完全可以根据需要在不 改变申请的本质的范围内而省略。The terminal device can receive device information pages sent by other devices through the nearfield communication module 170. For example, the nearfield communication module 170 integrates a Bluetooth communication module, establishes a communication connection with other mobile phones through the Bluetooth communication module, and receives feedback from other mobile phones. information, and generate a device information page corresponding to the other mobile phone. Although FIG. 1 shows the nearfield communication module 170, it is understood that it does not belong to the essential structure of the mobile phone 100, and can be completely omitted as required within the scope of not changing the essence of the application.

处理器180是手机的控制中心,利用各种接口和线路连接整个手机的各个部分,通过运 行或执行存储在存储器120内的软件程序和/或模块,以及调用存储在存储器120内的数据, 执行手机的各种功能和处理数据,从而对手机进行整体监控。可选的,处理器180可包括一 个或多个处理单元;优选的,处理器180可集成应用处理器和调制解调处理器,其中,应用 处理器主要处理操作系统、用户界面和应用程序等,调制解调处理器主要处理无线通信。可 以理解的是,上述调制解调处理器也可以不集成到处理器180中。Theprocessor 180 is the control center of the mobile phone, and uses various interfaces and lines to connect various parts of the entire mobile phone, by running or executing the software programs and/or modules stored in thememory 120, and calling the data stored in thememory 120. Various functions of the mobile phone and processing data, so as to monitor the mobile phone as a whole. Optionally, theprocessor 180 may include one or more processing units; preferably, theprocessor 180 may integrate an application processor and a modem processor, wherein the application processor mainly processes the operating system, user interface, and application programs, etc. , the modem processor mainly deals with wireless communication. It can be understood that the above-mentioned modem processor may not be integrated into theprocessor 180.

手机100还包括给各个部件供电的电源190(比如电池),优选的,电源可以通过电源 管理系统与处理器180逻辑相连,从而通过电源管理系统实现管理充电、放电、以及功耗管 理等功能。The mobile phone 100 also includes a power supply 190 (such as a battery) for supplying power to various components. Preferably, the power supply can be logically connected to theprocessor 180 through a power management system, so that functions such as managing charging, discharging, and power consumption management are implemented through the power management system.

手机100还包括音频电路、扬声器,传声器可提供用户与手机之间的音频接口。音频电 路可将接收到的音频数据转换后的电信号,传输到扬声器,由扬声器转换为声音信号输出; 另一方面,传声器将收集的声音信号转换为电信号,由音频电路接收后转换为音频数据,再 将音频数据输出处理器180处理后,经RF电路110以发送给比如另一手机,或者将音频数 据输出至存储器120以便进一步处理。例如,用户可以通过音频电路采集用户的语音信号, 基于语音信号设置手机的显示模式,并基于当前配置的显示模式对前台显示的目标页面进行 调整,输出与当前显示模式相对应的目标页面。The mobile phone 100 also includes an audio circuit, a speaker, and a microphone to provide an audio interface between the user and the mobile phone. The audio circuit can convert the received audio data into an electrical signal, and transmit it to the speaker, and the speaker converts it into a sound signal for output; on the other hand, the microphone converts the collected sound signal into an electrical signal, which is received by the audio circuit and converted into audio. After the audio data is output to theprocessor 180 for processing, theRF circuit 110 is sent to, for example, another mobile phone, or the audio data is output to thememory 120 for further processing. For example, the user can collect the user's voice signal through the audio circuit, set the display mode of the mobile phone based on the voice signal, and adjust the target page displayed in the foreground based on the currently configured display mode, and output the target page corresponding to the current display mode.

图2是本申请实施例的手机100的软件结构示意图。以手机100操作系统为Android系 统为例,在一些实施例中,将Android系统分为四层,分别为应用程序层、应用程序框架层 (framework,FWK)、系统层以及硬件抽象层,层与层之间通过软件接口通信。FIG. 2 is a schematic diagram of a software structure of a mobile phone 100 according to an embodiment of the present application. Taking the operating system of the mobile phone 100 as an Android system as an example, in some embodiments, the Android system is divided into four layers, which are an application layer, an application framework layer (framework, FWK), a system layer, and a hardware abstraction layer. The layers communicate through software interfaces.

如图2所示,所述应用程序层可以一系列应用程序包,应用程序包可以包括短信息,日 历,相机,视频,导航,图库,通话等应用程序。As shown in Fig. 2, the application layer may include a series of application packages, and the application packages may include short message, calendar, camera, video, navigation, gallery, calling and other applications.

应用程序框架层为应用程序层的应用程序提供应用编程接口(applicationprogramming interface,API)和编程框架。应用程序框架层可以包括一些预先定义的函数,例如用于接收 应用程序框架层所发送的事件的函数。The application framework layer provides an application programming interface (application programming interface, API) and a programming framework for the applications of the application layer. The application framework layer may include some predefined functions, such as functions for receiving events sent by the application framework layer.

如图2所示,应用程序框架层可以包括窗口管理器、资源管理器以及通知管理器等。As shown in FIG. 2, the application framework layer may include a window manager, a resource manager, a notification manager, and the like.

窗口管理器用于管理窗口程序。窗口管理器可以获取显示屏大小,判断是否有状态栏, 锁定屏幕,截取屏幕等。内容提供器用来存放和获取数据,并使这些数据可以被应用程序访 问。所述数据可以包括视频,图像,音频,拨打和接听的电话,浏览历史和书签,电话簿等。A window manager is used to manage window programs. The window manager can get the size of the display screen, determine whether there is a status bar, lock the screen, take screenshots, etc. Content providers are used to store and retrieve data, and make these data accessible to applications. The data may include video, images, audio, calls made and received, browsing history and bookmarks, phone book, etc.

资源管理器为应用程序提供各种资源,比如本地化字符串,图标,图片,布局文件,视 频文件等等。The resource manager provides various resources for the application, such as localization strings, icons, pictures, layout files, video files, etc.

通知管理器使应用程序可以在状态栏中显示通知信息,可以用于传达告知类型的消息, 可以短暂停留后自动消失,无需用户交互。比如通知管理器被用于告知下载完成,消息提醒 等。通知管理器还可以是以图表或者滚动条文本形式出现在系统顶部状态栏的通知,例如后 台运行的应用程序的通知,还可以是以对话窗口形式出现在屏幕上的通知。例如在状态栏提 示文本信息,发出提示音,电子设备振动,指示灯闪烁等。The notification manager enables applications to display notification information in the status bar, which can be used to convey notification-type messages, and can disappear automatically after a brief pause without user interaction. For example, the notification manager is used to notify download completion, message reminders, etc. The notification manager can also display notifications in the status bar at the top of the system in the form of graphs or scroll bar text, such as notifications from applications running in the background, and notifications on the screen in the form of dialog windows. For example, text messages are prompted in the status bar, beep sounds, electronic devices vibrate, indicator lights flash, etc.

应用程序框架层还可以包括:The application framework layer can also include:

视图系统,所述视图系统包括可视控件,例如显示文字的控件,显示图片的控件等。视 图系统可用于构建应用程序。显示界面可以由一个或多个视图组成的。例如,包括短信通知 图标的显示界面,可以包括显示文字的视图以及显示图片的视图。本申请实施例可以运行与 应用程序框架层中,通过文字控件对于目标页面内的文字类型的对象进行调整,并且通过显 示图片的控件,对目标页面内的背景图像进行调整,并将调整后的所有页面数据进行封装, 生成目标页面。The view system includes visual controls, such as controls for displaying text, controls for displaying pictures, and the like. View systems can be used to build applications. A display interface can consist of one or more views. For example, a display interface that includes a text message notification icon may include a view that displays text and a view that displays pictures. This embodiment of the present application can run in the application framework layer, adjust the text-type object in the target page through the text control, and adjust the background image in the target page through the control that displays the picture, and adjust the adjusted image. All page data is encapsulated to generate the target page.

电话管理器用于提供手机100的通信功能。例如通话状态的管理(包括接通,挂断等)。The phone manager is used to provide the communication function of the mobile phone 100 . For example, the management of call status (including connecting, hanging up, etc.).

系统层可以包括多个功能模块。例如:传感器服务模块,物理状态识别模块,三维图形 处理库(例如:OpenGL ES)等。The system layer can include multiple functional modules. For example: sensor service module, physical state recognition module, 3D graphics processing library (eg: OpenGL ES), etc.

传感器服务模块,用于对硬件层各类传感器上传的传感器数据进行监测,确定手机100 的物理状态;The sensor service module is used to monitor the sensor data uploaded by various sensors at the hardware layer and determine the physical state of the mobile phone 100;

物理状态识别模块,用于对用户手势、人脸等进行分析和识别;The physical state recognition module is used to analyze and recognize user gestures, faces, etc.;

三维图形处理库用于实现三维图形绘图,图像渲染,合成,和图层处理等。The 3D graphics processing library is used to implement 3D graphics drawing, image rendering, compositing, and layer processing.

系统层还可以包括:The system layer can also include:

表面管理器用于对显示子系统进行管理,并且为多个应用程序提供了2D和3D图层的 融合。The Surface Manager is used to manage the display subsystem and provides a fusion of 2D and 3D layers for multiple applications.

媒体库支持多种常用的静态图像文件,视频格式回放和录制,以及音频等。媒体库可以 支持多种音视频编码格式,例如:MPEG4,H.264,MP3,AAC,AMR,JPG,PNG等。The media library supports a variety of commonly used still image files, video format playback and recording, and audio. The media library can support a variety of audio and video encoding formats, such as: MPEG4, H.264, MP3, AAC, AMR, JPG, PNG, etc.

硬件抽象层是硬件和软件之间的层。硬件抽象层可以包括显示驱动、摄像头驱动、传感 器驱动、麦克风驱动等,用于驱动硬件层的相关硬件,如显示屏、摄像头、传感器以及麦克 风等。The hardware abstraction layer is the layer between hardware and software. The hardware abstraction layer can include display drivers, camera drivers, sensor drivers, microphone drivers, etc., which are used to drive related hardware at the hardware layer, such as display screens, cameras, sensors, and microphones.

在本申请实施例中,流程的执行主体为安装有页面显示的程序的设备。作为示例而非限 定,页面显示的程序的设备具体可以为终端设备,该终端设备可以为用户使用的智能手机、 平板电脑、笔记本电脑等,在接收到显示请求时,根据当前的显示模式对显示请求对应的目 标页面进行调整,并使得显示的目标页面与显示模式相匹配。图3示出了本申请第一实施例 提供的页面显示的方法的实现流程图,详述如下:In this embodiment of the present application, the execution body of the process is a device installed with a program for page display. As an example and not a limitation, the device of the program displayed on the page may be a terminal device, and the terminal device may be a smart phone, a tablet computer, a notebook computer, etc. used by the user. The corresponding target page is requested to be adjusted so that the displayed target page matches the display mode. Fig. 3 shows the realization flow chart of the method for page display provided by the first embodiment of the present application, which is described in detail as follows:

在S301中,将目标页面内的原始背景图像,调整为与当前的显示模式对应的目标背景 图像。In S301, the original background image in the target page is adjusted to the target background image corresponding to the current display mode.

在本实施例中,终端设备配置有显示屏,可以通过显示屏响应用户发起的显示请求,例 如显示应用程序内的操作界面,又或者通过相册应用显示存储于数据库内的图像等。在执行 上述显示操作之前,终端设备均可以通过本实施例提供的页面显示的方法,对待显示的目标 页面的内容进行调整,以使输出的目标页面与当前的显示模式相匹配,从而能够提高整体页 面与显示模式之间的一致性,提高了终端设备的显示效果。In this embodiment, the terminal device is configured with a display screen, which can respond to a display request initiated by a user through the display screen, such as displaying an operation interface in an application, or displaying an image stored in a database through a photo album application. Before performing the above display operation, the terminal device can adjust the content of the target page to be displayed by using the page display method provided in this embodiment, so that the output target page matches the current display mode, so as to improve the overall The consistency between the page and the display mode improves the display effect of the terminal device.

在一种可能的实现方式中,该显示模式可以为深色显示模式,也可以称为“夜间模式”, 即在显示环境较暗的情况下或者根据用户的实际显示需求,可以将终端设备的显示界面内的 控件以及图片等显示对象,设置为整体亮度值较低的显示模式。需要说明的是,该深色显示 模式并非将页面内的所有对象的亮度值均调整至低亮度值,而是整个页面的整体视觉效果属 于低亮度模式,即页面的平均亮度值低于预设的亮度阈值。例如,可以将页面内的背景图像 设置为低亮度图像或者设置为黑色背景,此时为了使得页面内的文字以及控件等对于用户而 言是可见的,可以将文字或控件等对象的颜色配置为白色或亮度较高的颜色,但由于上述对 象在整个页面内的显示区域相对于背景图像而言相对较少,因此,页面整体的视觉效果依然 输出低亮度的显示模式,与当前的显示效果相匹配。In a possible implementation manner, the display mode may be a dark display mode, which may also be called a "night mode", that is, when the display environment is dark or according to the actual display requirements of the user, the Controls in the display interface and display objects such as pictures are set to a display mode with a lower overall brightness value. It should be noted that this dark display mode does not adjust the brightness values of all objects in the page to low brightness values, but the overall visual effect of the entire page belongs to the low brightness mode, that is, the average brightness value of the page is lower than the preset value. brightness threshold. For example, the background image in the page can be set as a low-brightness image or a black background. In this case, in order to make the text and controls in the page visible to the user, the color of the text or controls and other objects can be configured as White or high-brightness colors, but because the display area of the above objects in the entire page is relatively small compared to the background image, the overall visual effect of the page still outputs a low-brightness display mode, which is consistent with the current display effect. match.

示例性地,图4示出了本申请一实施例提供的深色显示模式的示意图。其中,图4的(a) 为调整为深色显示模式前,某一目标页面的显示效果;图4的(b)为调整为深色显示模式 后,该目标页面的显示效果。参见图4所示,该目标页面的背景图像为一单色图像,其颜色 为白色,属于亮度较高的颜色,此时,需要将背景图像进行反色处理,调整为黑色背景,并 而由于原本页面内的其他前景对象的颜色为黑色,为了使得内容可见,需要对前景图像对应 地进行反色处理,将前景对象的颜色调整为白色,从而使得整体页面的色调为暗色调。Exemplarily, FIG. 4 shows a schematic diagram of a dark display mode provided by an embodiment of the present application. Wherein, Fig. 4(a) is the display effect of a certain target page before being adjusted to the dark display mode; Fig. 4(b) is the display effect of the target page after being adjusted to the dark display mode. Referring to Fig. 4, the background image of the target page is a monochrome image, and its color is white, which belongs to the color with high brightness. The color of other foreground objects in the original page is black. In order to make the content visible, the foreground image needs to be correspondingly inverted, and the color of the foreground object is adjusted to white, so that the overall page tone is dark.

示例性地,图5示出了本申请一实施例提供的深色显示模式的示意图。其中,图5的(a) 为调整为深色显示模式前,某一目标页面的显示效果;图5的(b)为调整为深色显示模式 后,该目标页面的显示效果。参见图5所示,该目标页面的背景图像为一多色混合图像,由 于对于多色混合图像无法通过反色来进行深色处理(由于反色处理会影响原本图片的显示效 果,甚至无法表现出该图像原本所需表达的内容,因此不会直接对多色图像进行反色处理), 该深色处理主要是降低背景图像的对比度以及亮度值。现有技术中,由于对页面内的各个显 示对象进行单独处理,并不会考虑对象之间的关联性,因此,对于文字以及图标等内容,依 然是采用反色的调整手段,因此会使得反色后的文字以及图像与深色处理后的背景图像之间 的颜色相同或相似,使得文字以及图标等内容的可见度降低,影响整体的显示效果。由此可 见,现有的页面显示技术,对各个显示对象均是单独处理,而在页面中,不同显示对象之间 是相互重叠显示的,合并显示时可能会出现颜色相同或相似的情况,为了避免上述情况发生, 终端设备可以在调整页面时,首先对背景图像进行处理,并根据前景图像在背景图像的关联 背景区域,再确定对应的调整策略,进行与显示模式相匹配的颜色调整,保证前景对象与背 景图像之间的对比度的同时,使得调整后的前景对象与当前的显示模式相匹配,避免了生成 的目标页面出现部分对象因颜色相同或相似而不可见的情况。Exemplarily, FIG. 5 shows a schematic diagram of a dark display mode provided by an embodiment of the present application. Wherein, Fig. 5(a) is the display effect of a certain target page before being adjusted to the dark display mode; Fig. 5(b) is the display effect of the target page after being adjusted to the dark display mode. As shown in Figure 5, the background image of the target page is a multi-color mixed image, because the multi-color mixed image cannot be processed by inverting the dark color (because the inverting process will affect the display effect of the original image, and it cannot even be displayed. The original content of the image needs to be expressed, so the multi-color image will not be directly inverted), and the dark color processing mainly reduces the contrast and brightness value of the background image. In the prior art, since each display object in the page is processed separately, the correlation between the objects is not considered. Therefore, for the content such as text and icons, the adjustment method of inverse color is still used, which will cause the reverse color. The color of the colored text and image and the darkened background image are the same or similar, which reduces the visibility of the text and icons and affects the overall display effect. It can be seen that in the existing page display technology, each display object is processed separately, and in the page, different display objects are displayed overlapping each other, and the same or similar colors may appear when combined display. In order to To avoid the above situation, the terminal device can first process the background image when adjusting the page, and then determine the corresponding adjustment strategy according to the foreground image in the associated background area of the background image, and perform color adjustment that matches the display mode to ensure that At the same time, the contrast between the foreground object and the background image makes the adjusted foreground object match the current display mode, avoiding the situation that some objects are invisible due to the same or similar colors on the generated target page.

在一种可能的实现方式中,该显示模式还可以包括:强对比度显示模式以及高亮度模式 等,若该显示模式为强对比度模式,则要求背景图像与前景对象之间的对比度较强,终端设 备在后续的操作中可以调整背景图像以及前景对象的饱和度、对比度以及锐度等参数值,以 使页面的对比度较强,与显示模式相匹配;对应地,当显示模式为高亮度模式下,终端设备 可以通过对背景图像以及前景对象的高光色区进行调整,提高高光色区的比例,并减少阴影 色区的比例,提高整体页面的亮度值。终端设备可以根据不同的显示模式确定页面调整策略, 并基于页面调整策略对页面内的各个显示对象进行调整,以使调整后的目标页面与当前的显 示模式相匹配。In a possible implementation manner, the display mode may further include: a strong contrast display mode and a high brightness mode, etc. If the display mode is a strong contrast mode, the contrast between the background image and the foreground object is required to be strong, and the terminal In subsequent operations, the device can adjust the saturation, contrast, and sharpness of the background image and foreground objects to make the page contrast stronger and match the display mode; correspondingly, when the display mode is high brightness mode , the terminal device can increase the proportion of the highlight color area and reduce the proportion of the shadow color area by adjusting the background image and the highlight color area of the foreground object to improve the brightness value of the overall page. The terminal device may determine a page adjustment strategy according to different display modes, and adjust each display object in the page based on the page adjustment strategy, so that the adjusted target page matches the current display mode.

在本实施例中,终端设备可以配置有默认显示模式,各个目标页面的原始页面数据可以 是基于默认显示模式生成的数据,即默认显示模式下是根据原始页面数据生成目标页面,而 不对原始页面数据进行调整。该默认显示模式可以称为常规显示模式。终端设备若检测到当 前的显示模式为默认显示模式,则可以将接收到的目标页面的页面数据进行输出显示,无需 对页面内的显示对象的颜色或亮度等参数进行调整;反之,终端设备若检测到当前的显示模 式为非默认显示模式,则获取当前的显示模式对应的页面调整策略,并通过该页面调整策略 对目标页面内的显示对象进行调整,以及执行S301至S304的相关操作。In this embodiment, the terminal device may be configured with a default display mode, and the original page data of each target page may be data generated based on the default display mode, that is, in the default display mode, the target page is generated according to the original page data, and the original page data is not data is adjusted. This default display mode may be referred to as a normal display mode. If the terminal device detects that the current display mode is the default display mode, it can output and display the received page data of the target page without adjusting parameters such as the color or brightness of the display objects in the page; When it is detected that the current display mode is a non-default display mode, the page adjustment policy corresponding to the current display mode is acquired, and the display objects in the target page are adjusted through the page adjustment policy, and the related operations of S301 to S304 are performed.

在一种可能的实现方式中,终端设备在检测到用户输入显示模式变更指令时,会检测当 前前台显示的页面是否与变更后的显示模式相匹配,若是,则无需对当前显示的页面进行调 整;反之,若当前显示的页面与变更后的显示模式不匹配,则将当前显示的页面作为目标页 面,并执行S301至S304的相关操作。In a possible implementation manner, when the terminal device detects that the user inputs a display mode change instruction, it will detect whether the page currently displayed in the foreground matches the changed display mode, and if so, there is no need to adjust the currently displayed page ; On the contrary, if the currently displayed page does not match the changed display mode, the currently displayed page is taken as the target page, and the related operations of S301 to S304 are performed.

在一种可能的实现方式中,终端设备在检测到显示模式发生变更后,会获取当前后台运 行的应用程序,并获取各个应用程序对应的操作页面。将各个操作页面与当前的显示模式进 行匹配,若任一操作页面与当前的显示模式不匹配,则通过S301至S304的方式对该页面进 行调整。In a possible implementation manner, after detecting that the display mode is changed, the terminal device will acquire the applications currently running in the background, and acquire the operation pages corresponding to each application. Match each operation page with the current display mode, and if any operation page does not match the current display mode, adjust the page by means of S301 to S304.

在一种可能的实现方式中,终端设备还可以在本地的存储器中存储有目标页面在不同显 示模式下的页面数据,或者该目标页面对应的服务器可以根据显示模式配置有对应的页面数 据,终端设备可以通过从本地的存储器或页面服务器处获取与当前显示模式匹配的页面数据, 并基于获取得到的页面数据输出目标页面;若本地存储器或页面服务器并没有存储有与当前 的显示模式相匹配的页面数据,则通过S301至S304的操作对目标页面内的显示对象进行调 整,从而生成与显示模式对应的目标页面。In a possible implementation manner, the terminal device may also store page data of the target page in different display modes in the local memory, or the server corresponding to the target page may be configured with corresponding page data according to the display mode, and the terminal The device can obtain page data matching the current display mode from the local storage or page server, and output the target page based on the obtained page data; page data, the display objects in the target page are adjusted through the operations of S301 to S304, so as to generate a target page corresponding to the display mode.

在本实施例中,目标页面可以包含多个显示对象,分别背景图像以及前景对象。其中, 背景图像的个数可以为一个,也可以为多个,即目标页面可以有多个不同的背景图像拼接得 到,每个背景图像的图像尺寸也可以不同,也可以与终端设备的显示尺寸相匹配,还可以根 据实际的显示内容调整显示尺寸,在此不做限定。需要说明的是,背景图像之间可以相互叠 加,根据多个背景图像之间相互重叠,构成目标页面的背景。不同的背景图像可以通过配置 对应的透明度,以使处于底层的背景图像与处于上层的背景图像相互叠加,构成目标页面的 页面背景。在该情况下,终端设备在对原始背景图像调整至与当前实现模式相匹配的目标背 景图像时,可以首先对最底层的原始背景图像进行调整,并基于最底层的目标背景图像的亮 度值,确定相邻上一层级的原始背景图像的调整策略,若该最底层的目标背景图像的亮度值 与相邻上一层级的原始背景图像的亮度值之间的亮度差值小于预设的调整阈值,则对该上一 层级的原始背景图像采用第一调整算法进行处理(例如对相邻上一层级的原始背景图像进行 反色处理);反之,若该最底层的目标背景图像的亮度值与相邻上一层级的原始背景图像的 亮度值之间的亮度差值大于或等于预设的调整阈值,则对上一层级的原始背景图像采用第二 调整算法进行处理(例如对相邻上一层级的原始背景图像进行降低亮度处理)。In this embodiment, the target page may contain a plurality of display objects, respectively a background image and a foreground object. The number of background images may be one or multiple, that is, the target page may be obtained by splicing multiple different background images, and the image size of each background image may also be different, and may also be different from the display size of the terminal device. Matching, the display size can also be adjusted according to the actual display content, which is not limited here. It should be noted that the background images can be superimposed on each other, and the background of the target page is formed according to the overlapping of multiple background images. Different background images can be configured with corresponding transparency, so that the background image at the bottom layer and the background image at the upper layer overlap each other to form the page background of the target page. In this case, when adjusting the original background image to the target background image matching the current implementation mode, the terminal device may first adjust the original background image at the bottom layer, and based on the brightness value of the target background image at the bottom layer, Determine the adjustment strategy of the original background image of the adjacent upper level, if the brightness difference between the brightness value of the target background image of the lowest level and the brightness value of the original background image of the adjacent upper level is less than the preset adjustment threshold , then use the first adjustment algorithm to process the original background image of the upper level (for example, perform inverse color processing on the original background image of the adjacent upper level); The brightness difference between the brightness values of the original background images of the adjacent upper level is greater than or equal to the preset adjustment threshold, then the original background image of the upper level is processed by the second adjustment algorithm (for example, the adjacent upper level of the original background image is processed by the second adjustment algorithm. The original background image of the level is reduced in brightness).

在本实施例中,不同的显示模式对应不同的调整算法。终端设备可以根据当前的显示模 式获取与之关联的调整算法。该调整算法可以根据显示对象类型的不同,配置有不同的调整 模型,例如对于背景图像采用第一调整模型、对于文字对象采用第二调整模型,而对于图标 对象则采用第三调整模型。当然,对于同一类型的显示对象的调整模型,还可以根据对象属 性区分不同的调整模型,例如对于背景图像为单色背景图像时,则采用第一调整模型;而对 于多色背景图像,则采用第二调整模型;还可以根据原始背景图像的原始颜色,确定对应的 调整模型,举例性地,若检测到原始背景图像的平均像素值在(255,125)之间,则采用第一 调整模型;若检测到原始背景图像的平均像素值在(125,0)之间,则采用第二调整模型,具 体采用的调整方式可以根据显示模式、图像层级、对象类型以及图像的色度多个维度进行确 定。In this embodiment, different display modes correspond to different adjustment algorithms. The terminal device can obtain the adjustment algorithm associated with the current display mode. The adjustment algorithm can be configured with different adjustment models according to different types of display objects, for example, a first adjustment model is used for background images, a second adjustment model is used for text objects, and a third adjustment model is used for icon objects. Of course, for the adjustment model of the same type of display object, different adjustment models can also be distinguished according to the object attributes. For example, when the background image is a monochrome background image, the first adjustment model is used; for a multi-color background image, the first adjustment model is used. The second adjustment model; the corresponding adjustment model can also be determined according to the original color of the original background image. For example, if the average pixel value of the original background image is detected to be between (255, 125), the first adjustment model is used; if If it is detected that the average pixel value of the original background image is between (125,0), the second adjustment model is adopted, and the specific adjustment method can be determined according to the display mode, image level, object type and the chromaticity of the image. .

举例性地,当前的显示模式为深色显示模式,某一原始背景图像为一单色黑色图像。终 端设备获取深色显示模式对应的页面调整策略。该页面调整策略根据背景图像与前景图像分 为两个不同的调整算法,分别为第一调整算法以及第二调整算法。在检测到当前所需的调整 对象为背景图像时,则采用第一调整算法对原始背景图像进行调整,该第一调整算法需要识 别得到该原始背景图像为单色图像,且颜色为黑色,则不对该原始背景图像进行调整,只需 降低终端设备显示屏的背光亮度。For example, the current display mode is a dark display mode, and a certain original background image is a monochrome black image. The terminal device obtains the page adjustment policy corresponding to the dark display mode. The page adjustment strategy is divided into two different adjustment algorithms according to the background image and the foreground image, namely the first adjustment algorithm and the second adjustment algorithm. When it is detected that the currently required adjustment object is the background image, the first adjustment algorithm is used to adjust the original background image. The first adjustment algorithm needs to recognize that the original background image is a monochrome image and the color is black, then No adjustments are made to this original background image, just the backlight brightness of the terminal's display is reduced.

在S302中,识别所述目标页面内各个前景对象在所述目标背景图像内的关联背景区域。In S302, the associated background area of each foreground object in the target page in the target background image is identified.

在本实施例中,目标页面包含有背景图像以及前景对象。上述前景对象具体为显示于背 景图像上层的显示对象,该前景对象包括但不限于:前景图标、文字、控件、触控动画以及 弹窗等显示对象。In this embodiment, the target page includes a background image and a foreground object. The above-mentioned foreground objects are specifically display objects displayed on the upper layer of the background image, and the foreground objects include, but are not limited to, display objects such as foreground icons, text, controls, touch animations, and pop-up windows.

在本实施例中,每个前景对象的对象信息中可以包含有在目标页面的中心坐标以及该前 景对象的对象尺寸。终端设备可以根据上述两个参数,即显示位置以及对象尺寸,识别得到 与该前景对象对应的关联背景区域。In this embodiment, the object information of each foreground object may include the center coordinates of the target page and the object size of the foreground object. The terminal device can identify the associated background area corresponding to the foreground object according to the above two parameters, that is, the display position and the size of the object.

在一种可能的实现方式中,确定关联背景区域的方式可以为:若目标页面内的背景图像 的个数为多个,则终端设备根据该各个目标背景图像的背景区域,将前景对象的中心坐标所 落入的背景区域所对应的目标背景图像,作为该前景对象关联的目标背景图像;终端设备根 据该前景对象的对象尺寸以及中心区域,确定该前景对象在目标背景图像中的覆盖区域,并 将该覆盖区域识别为该前景对象在目标背景图像内的关联背景区域。In a possible implementation manner, the method of determining the associated background area may be as follows: if the number of background images in the target page is multiple, the terminal device, according to the background area of each target background image, assigns the center of the foreground object to the center of the foreground object. The target background image corresponding to the background area where the coordinates fall, as the target background image associated with the foreground object; the terminal device determines the coverage area of the foreground object in the target background image according to the object size and the center area of the foreground object, The coverage area is identified as the associated background area of the foreground object in the target background image.

示例性地,图6示出了本申请一实施例提供的关联背景区域的识别示意图。参见图6所 示,该目标页面内包含有3个背景图像,分别为背景图像1、背景图像2以及背景图像3,该目标页面还包含有一前景对象即为图标1,终端设备可以通过读取图标1的对象信息,确定该前景对象的中心坐标,而该中心坐标落入了背景图像1的背景区域内,则识别背景图像1为图标1的关联背景图像。终端设备并根据该图标1的对象尺寸,在关联背景图像内提取出对应的关联背景区域。Exemplarily, FIG. 6 shows a schematic diagram of identifying an associated background region provided by an embodiment of the present application. Referring to FIG. 6 , the target page contains 3 background images, namely background image 1,background image 2 and background image 3, and the target page also includes a foreground object, namely icon 1, which can be read by the terminal device by reading The object information of icon 1 determines the center coordinates of the foreground object, and if the center coordinates fall within the background area of background image 1, then background image 1 is identified as the associated background image of icon 1. The terminal device extracts the corresponding associated background area in the associated background image according to the object size of the icon 1 .

在一种可能的实现方式中,目标页面内包含有多个目标背景图像,且不同的目标背景图 像可以通过调整透明度,使得底层背景图像与上层背景图像相互叠加,构成目标页面的页面 背景,在该情况下,某一坐标点可以同时对应两个不同的目标背景图像。在该情况下,终端 设备可以对目标页面的所有目标背景图像进行可见图层合并,即根据各个目标背景图像的透 明度将多个处于不同图层的目标背景图像进行合并,生成合并背景图像,继而从合并背景图 像中确定前景对象对应的关联背景区域。In a possible implementation manner, the target page contains multiple target background images, and the transparency of different target background images can be adjusted so that the underlying background image and the upper background image are superimposed on each other to form the page background of the target page. In this case, a certain coordinate point may correspond to two different target background images at the same time. In this case, the terminal device can perform visible layer merging on all target background images of the target page, that is, merging multiple target background images in different layers according to the transparency of each target background image to generate a merged background image, and then The associated background region corresponding to the foreground object is determined from the merged background image.

示例性地,图7示出了本申请另一实施例提供的关联背景区域的识别示意图。参见图7 所示,该目标图像包含有背景图像1以及背景图像2。并且背景图像1位于背景图像2的下 一显示层级,前景对象则位于背景图像2的上一显示层级,在该情况下,前景对象对应的目 标背景图像为背景图像1以及背景图像2。因此,终端设备可以将背景图像1以及背景图像 2合并,得到合并背景图像,并根据前景对象的中心坐标以及对象尺寸,在合并背景图像中 确定出对应的关联背景区域。Exemplarily, FIG. 7 shows a schematic diagram of identifying an associated background region provided by another embodiment of the present application. Referring to FIG. 7 , the target image includes a background image 1 and abackground image 2 . And the background image 1 is located at the next display level of thebackground image 2, and the foreground object is located at the upper display level of thebackground image 2. In this case, the target background images corresponding to the foreground objects are the background image 1 and thebackground image 2. Therefore, the terminal device can combine the background image 1 and thebackground image 2 to obtain a combined background image, and determine the corresponding associated background area in the combined background image according to the center coordinates of the foreground object and the size of the object.

在S303中,根据所述关联背景区域的背景像素值,将所述前景对象调整为与所述显示 模式对应的目标对象。In S303, the foreground object is adjusted to a target object corresponding to the display mode according to the background pixel value of the associated background area.

在本实施例中,终端设备在确定了关联背景区域后,可以计算该关联背景区域对应的背 景像素值。该背景像素值可以为该关联背景区域的像素均值,在该情况下,终端设备可以将 关联背景区域内的各个像素点的像素值进行叠加,并根据累加值计算得到关联背景区域对应 的像素均值,将该像素均值作为关联背景区域的背景像素值。可选地,终端设备可以根据各 个像素点与关联背景区域的中心坐标之间的距离值,确定各个像素点对应的加权权重,其中, 距离中心坐标的距离越小,则对应的加权权重的数值越大,基于各个像素点的加权权重以及 像素值进行加权累加,得到加权累加值,并根据加权累加值进行平均,将加权均值作为关联 区域的背景像素值。In this embodiment, after determining the associated background area, the terminal device may calculate the background pixel value corresponding to the associated background area. The background pixel value may be the pixel average value of the associated background area. In this case, the terminal device may superimpose the pixel values of each pixel in the associated background area, and calculate the pixel average value corresponding to the associated background area according to the accumulated value. , the pixel mean value is taken as the background pixel value of the associated background area. Optionally, the terminal device can determine the weighting weight corresponding to each pixel point according to the distance value between each pixel point and the center coordinate of the associated background area, wherein, the distance from the center coordinate is smaller, then the value of the corresponding weighting weight is smaller. If the value is larger, weighted accumulation is performed based on the weighted weight and pixel value of each pixel to obtain a weighted accumulated value, and averaged according to the weighted accumulated value, and the weighted average value is used as the background pixel value of the associated area.

在一种可能的实现方式中,终端设备可以对目标背景图像进行降采样,即通过预设网格 将目标背景图像划分为多个网格区域,并根据各个网格区域的中心坐标点的像素值,作为各 个网格区域的像素值,从而生成关于目标背景图像的降采样图像。终端设备根据关联背景区 域在降采样图像内对应的网格区域的像素值,确定该关联背景区域的背景像素值。若该前景 对象的显示区域覆盖了两个或以上的网格区域,则将覆盖的网格区域的作为前景对象的关联 背景区域,又或者将前景对象的中心坐标所在的网格区域作为该前景区域对应的关联背景区 域。若关联背景区域对应多个网格区域,则可以根据各个网格区域的像素值的均值,作为该 关联背景区域的背景像素值。In a possible implementation manner, the terminal device may down-sample the target background image, that is, divide the target background image into multiple grid areas by using a preset grid, and select pixels according to the center coordinate point of each grid area. value, as the pixel value of each grid area, thereby generating a downsampled image with respect to the target background image. The terminal device determines the background pixel value of the associated background area according to the pixel value of the grid area corresponding to the associated background area in the down-sampled image. If the display area of the foreground object covers two or more grid areas, take the covered grid area as the associated background area of the foreground object, or take the grid area where the center coordinates of the foreground object are located as the foreground The associated background region corresponding to the region. If the associated background area corresponds to multiple grid areas, the average value of the pixel values of each grid area can be used as the background pixel value of the associated background area.

在本实施例中,终端设备对前景对象进行调整的方式可以为:终端设备获取前景对象的 前景像素值,根据前景像素值、背景像素值以及当前的显示模式对应的颜色色调,对前景对 象进行调整。In this embodiment, the method for the terminal device to adjust the foreground object may be as follows: the terminal device obtains the foreground pixel value of the foreground object, and adjusts the foreground object according to the foreground pixel value, the background pixel value and the color tone corresponding to the current display mode. Adjustment.

在一种可能的实现方式中,若该显示模式的深色显示模式,即夜间显示模式,终端设备 可以若检测到前景像素值与背景像素值之间的像素差值小于预设的对比阈值,则对前景对象 进行反色处理;反之,若检测到前景像素值与背景像素值之间的像素差值大于或等于预设的 对比阈值,则表示在调整前,前景对象叠加在目标背景图像上进行显示时,已经具有较高的 可见度,此时若继续对前景对象进行反色处理,则反而会导致前景对象叠加在目标背景区域 后降低可见度,因此,终端设备并不会对前景对象进行反色处理,而是降低前景对象的亮度 值,以使与深色显示模式相匹配。In a possible implementation manner, if the display mode is a dark display mode, that is, a night display mode, the terminal device may detect that the pixel difference between the foreground pixel value and the background pixel value is smaller than a preset contrast threshold, On the other hand, if the pixel difference between the foreground pixel value and the background pixel value is detected to be greater than or equal to the preset contrast threshold, it means that the foreground object is superimposed on the target background image before adjustment. When displaying, it already has high visibility. If you continue to invert the foreground object at this time, it will cause the foreground object to be superimposed on the target background area and reduce the visibility. Therefore, the terminal device will not invert the foreground object. color processing, but reduces the brightness value of foreground objects to match the dark display mode.

在一种可能的实现方式中,若该显示模式为高对比度模式,终端设备若检测到前景像素 值与背景像素值之间的像素差值小于预设的对比阈值,则对前景对象进行反色处理,并提高 反色处理后的前景对象以及目标背景图像的对比度;反之,若检测到前景像素值与背景像素 值之间的像素差值大于或等于预设的对比阈值,则表示前景对象与目标背景对象在调整之间 已经具有较高的对比度,此时可以无需对前景对象进行反色处理,而是增加前景对象的对比 度,得到目标对象。In a possible implementation manner, if the display mode is the high contrast mode, if the terminal device detects that the pixel difference between the foreground pixel value and the background pixel value is smaller than a preset contrast threshold, the terminal device will invert the foreground object. processing, and improve the contrast of the foreground object and the target background image after inversion processing; on the contrary, if the pixel difference between the foreground pixel value and the background pixel value is detected to be greater than or equal to the preset contrast threshold, it means that the foreground object and The target background object already has a high contrast between adjustments. In this case, the target object can be obtained by increasing the contrast of the foreground object without performing inverse color processing on the foreground object.

在本实施例中,目标页面内可以包含有多个前景对象,对各个前景对象执行S302以及S303的操作,生成关于各个前景对象的目标对象,若检测到各个前景对象均调整完毕,此 时可以执行S304的操作。In this embodiment, the target page may contain multiple foreground objects, and the operations of S302 and S303 are performed on each foreground object to generate a target object about each foreground object. If it is detected that each foreground object has been adjusted, then the The operation of S304 is performed.

在S304中,根据所有所述目标对象以及所述目标背景图像,生成所述目标页面。In S304, the target page is generated according to all the target objects and the target background image.

在本实施例中,终端设备可以根据调整后各个前景对象对应的目标对象以及原始背景图 像对应的目标背景图像进行封装,生成与当前显示模式相匹配的目标页面。在该情况下,终 端设备记录有各个前景对象在目标页面内的显示坐标以及对象层级,同样地,终端设备也记 录有各个原始背景图像在目标页面内的显示坐标以及对象层级,终端设备基于上述参数,可 以确定各个显示对象(即目标对象以及目标背景图像)在目标页面内的显示区域,并进行拼 接以及叠加显示,从而得到目标页面。In this embodiment, the terminal device can package according to the target object corresponding to each foreground object after adjustment and the target background image corresponding to the original background image, and generate a target page matching the current display mode. In this case, the terminal device records the display coordinates and object levels of each foreground object in the target page. Similarly, the terminal device also records the display coordinates and object levels of each original background image in the target page. Based on the above The parameters can determine the display area of each display object (ie, the target object and the target background image) in the target page, and perform splicing and overlay display to obtain the target page.

以上可以看出,本申请实施例提供的一种页面显示的方法通过对目标页面内的原始背景 图像进行调整,得到目标背景图像,继而根据各个前景对象在目标背景图像内的关联背景区 域的亮度值,确定前景对象的调整策略,并根据调整策略生成前景对象对应的目标对象,最 后根据目标背景图像以及目标对象生成目标页面,在调整前景对象时,根据关联的背景区域 确定调整策略,避免了调整后的背景图像与前景对象出现颜色相同或相似,提高了页面的显 示效果。It can be seen from the above that the method for displaying a page provided by the embodiment of the present application obtains the target background image by adjusting the original background image in the target page, and then obtains the target background image according to the brightness of the associated background area of each foreground object in the target background image. value, determine the adjustment strategy of the foreground object, and generate the target object corresponding to the foreground object according to the adjustment strategy, and finally generate the target page according to the target background image and the target object. The adjusted background image has the same or similar color as the foreground object, which improves the display effect of the page.

图8示出了本申请第二实施例提供的一种页面显示的方法S302的具体实现流程图。参 见图8,相对于图3所述实施例,本实施例提供的一种页面显示的方法中S302包括:S801~S802,具体详述如下:FIG. 8 shows a specific implementation flowchart of a page display method S302 provided by the second embodiment of the present application. Referring to FIG. 8 , with respect to the embodiment shown in FIG. 3 , in a method for displaying a page provided in this embodiment, S302 includes: S801 to S802, which are described in detail as follows:

进一步地,所述识别所述目标页面内各个前景对象在所述目标背景图像内的关联背景区 域,包括:Further, the described identification of the associated background area of each foreground object in the target background image in the target page includes:

在S801中,将所述目标背景图像划分为多个候选背景区域。In S801, the target background image is divided into multiple candidate background regions.

在本实施例中,终端设备可以对目标背景图像进行区域划分,从而将一个面积较大的目 标背景图像划分为多个面积较小的候选背景区域,从而能够便于后续对前景对象调整的过程 中,确定关联背景区域。由于根据前景对象的对象形状,从目标背景图像中截取与对象形状 相匹配的背景区域作为前景对象的关联背景区域,则运算量较大,不仅需要获取前景对象的 轮廓信息,并需要根据轮廓信息从目标背景区域内进行区域框取,不仅提取得到的各个候选 背景区域的区域大小不一致,并且在前景对象较多以及轮廓较为复杂的情况下,则消耗较多 的运算资源进行关联背景区域的识别操作,从而降低了目标页面的生成效率,延长了页面生 成的耗时,降低了用户的使用体验。因此,终端设备可以根据预先的划分规则,将目标背景 图像划分为多个候选背景区域,从而在确定关联背景区域时,可以从候选背景区域中进行选 取,无需根据前景对象的对象轮廓,在目标背景图像内进行截取,减少了终端设备的运算量, 从而提高了目标页面的生成效率。In this embodiment, the terminal device can perform region division on the target background image, so that a target background image with a large area is divided into a plurality of candidate background regions with a small area, so as to facilitate the subsequent adjustment of the foreground object in the process of , to determine the associated background area. Because according to the object shape of the foreground object, the background area that matches the shape of the object is intercepted from the target background image as the associated background area of the foreground object, which requires a large amount of computation. Not only the contour information of the foreground object, but also the contour information The area frame extraction from the target background area, not only the area sizes of the extracted candidate background areas are inconsistent, but also in the case of many foreground objects and complex contours, it consumes more computing resources to identify the associated background area. operation, thereby reducing the generation efficiency of the target page, prolonging the time-consuming of page generation, and reducing the user experience. Therefore, the terminal device can divide the target background image into a plurality of candidate background areas according to the pre-set division rules, so that when determining the associated background area, it can select from the candidate background areas, and it is not necessary to select the target background area according to the object outline of the foreground object. The interception is performed in the background image, which reduces the calculation amount of the terminal device, thereby improving the generation efficiency of the target page.

在一种可能的实现方式中,终端设备可以通过预设的区域形状,生成以上述区域形状为 单位的网格线,基于上述的网格线对目标背景图像进行划分,从而生成得到多个候选背景区 域。其中,该区域形状可以为矩形、正方形、三角形等多边形。In a possible implementation manner, the terminal device may generate grid lines with the above-mentioned area shape as a unit by using a preset area shape, and divide the target background image based on the above-mentioned grid lines, so as to generate a plurality of candidate candidates. background area. The shape of the area may be a polygon such as a rectangle, a square, or a triangle.

在一种可能的实现方式中,终端设备可以识别目标页面内各个前景对象的对象尺寸,选 取数值最小的对象尺寸作为目标尺寸,并基于目标尺寸配置网格,并基于上述网格将目标背 景图像划分为多个候选背景区域。根据前景对象的对象尺寸的最小值配置网格,能够使得每 个前景对象均能够选取得到与之形状大小相匹配的候选背景区域,避免因候选背景区域过大 而导致多个前景对象对应同一关联背景区域,也能够尽可能减少候选背景区域的分块数量, 提高了选取的效率。由于对图像进行区域划分,实际上是一个降采样的过程,因此降采样的 比例越高,对于运算速度的提升越大,而根据前景对象的尺寸最小值进行网格划分,不仅能 够提高运算速率的同时,也能够保证关联背景区域与前景对象之间吻合度,提高了后续调整 操作的准确性。In a possible implementation manner, the terminal device may identify the object size of each foreground object in the target page, select the object size with the smallest value as the target size, configure a grid based on the target size, and set the target background image based on the above grid Divide into multiple candidate background regions. The grid is configured according to the minimum object size of the foreground object, so that each foreground object can select a candidate background area matching its shape and size, and avoid multiple foreground objects corresponding to the same association due to the large candidate background area. In the background area, the number of blocks of the candidate background area can also be reduced as much as possible, which improves the selection efficiency. Since the area division of the image is actually a process of downsampling, the higher the ratio of downsampling, the greater the improvement of the operation speed, and the mesh division according to the minimum size of the foreground object can not only improve the operation rate At the same time, the degree of agreement between the associated background area and the foreground object can also be ensured, and the accuracy of subsequent adjustment operations can be improved.

在S802中,根据所述前景对象的中心坐标以及所述目标背景图像的边界坐标,从所述 候选背景区域中选取与所述前景对象对应的所述关联背景区域。In S802, according to the center coordinates of the foreground object and the boundary coordinates of the target background image, the associated background region corresponding to the foreground object is selected from the candidate background regions.

在本实施例中,终端设备在配置各个前景对象的显示位置时,该显示位置是前景对象相 对于显示屏的位置。但由于每个目标背景图像有对应的显示区域,在需要确定前景对象在目 标背景图像中的关联背景区域时,需要考虑目标背景图像内各个候选背景区域相对于显示屏 的显示区域,才能够识别得到前景对象的关联背景背景区域。基于此,终端设备需要获取目 标背景图像的边界坐标,根据任一边界坐标以及目标背景图像的图像尺寸,则可以确定该目 标背景区域的显示区域。并根据各个候选背景区域在目标背景图像上的显示位置,则可以确 定各个候选背景区域对应的显示区域,识别前景对象的中心坐标所落入的显示区域,即可以 确定该前景对象在目标背景图像中的关联背景区域。In this embodiment, when the terminal device configures the display position of each foreground object, the display position is the position of the foreground object relative to the display screen. However, since each target background image has a corresponding display area, when it is necessary to determine the associated background area of the foreground object in the target background image, it is necessary to consider the display area of each candidate background area in the target background image relative to the display area of the display screen. Get the associated background background area of the foreground object. Based on this, the terminal device needs to obtain the boundary coordinates of the target background image, and according to any boundary coordinates and the image size of the target background image, the display area of the target background area can be determined. And according to the display position of each candidate background area on the target background image, the display area corresponding to each candidate background area can be determined, and the display area where the center coordinates of the foreground object fall can be identified, and then the foreground object can be determined in the target background image. The associated background area in .

在一种可能的实现方式中,识别关联背景区域的方式可以为:根据目标背景图像的边界 坐标以及图像尺寸,确定目标背景图像的显示区域,基于各个候选背景区域的位置,确定各 个候选背景区域的显示区域,基于各个候选背景区域的显示区域,确定各个候选背景区域的 区域坐标,计算所述区域坐标与前景对象的中心坐标的距离值,选取该距离值小于预设的距 离阈值的候选背景区域作为关联背景区域。In a possible implementation manner, the method of identifying the associated background area may be: determining the display area of the target background image according to the boundary coordinates and the image size of the target background image, and determining each candidate background area based on the position of each candidate background area based on the display area of each candidate background area, determine the area coordinates of each candidate background area, calculate the distance value between the area coordinate and the center coordinate of the foreground object, and select the candidate background whose distance value is less than the preset distance threshold region as the associated background region.

示例性地,图9示出了本申请一实施例提供的页面显示的过程中各处理单元的交互示意 图。参见图9所示,终端设备包括有显示模式调整单元,位图处理单元、背景图像调整单元、 历史图层颜色库以及前景对象处理单元。具体实现过程如下:Exemplarily, FIG. 9 shows a schematic diagram of interaction of each processing unit in the process of page display provided by an embodiment of the present application. Referring to Fig. 9, the terminal device includes a display mode adjustment unit, a bitmap processing unit, a background image adjustment unit, a historical layer color library, and a foreground object processing unit. The specific implementation process is as follows:

1.显示模块调整单元可以用于解析目标页面内包含的显示对象,将目标页面内的原始背 景图像交由位图处理单元进行处理;1. the display module adjustment unit can be used to parse the display object contained in the target page, and the original background image in the target page is handed over to the bitmap processing unit for processing;

2.显示模块调整单元可以将解析得到的前景对象导入到前景对象处理单元,其中,导入 前景对象处理单元之前,显示模块调整单元可以确定各个前景对象的中心坐标以及对象颜色; 需要说明的是,上述步骤1以及2可以同时执行;2. The display module adjustment unit can import the parsed foreground object into the foreground object processing unit, wherein, before importing the foreground object processing unit, the display module adjustment unit can determine the center coordinates and object color of each foreground object; It should be noted that, Theabove steps 1 and 2 can be performed simultaneously;

3.位图处理模块在获取得到原始背景图像后,可以解析该原始背景图像对应的至少一个 边界坐标以及图像尺寸,特别地,可以确定该背景图像的像素信息,例如可以通过平均像素 值、特征像素值以及背景图像包含的颜色种类等信息。3. After the bitmap processing module obtains the original background image, it can analyze at least one boundary coordinate and image size corresponding to the original background image. Information such as pixel values and the kinds of colors contained in the background image.

4.将包含像素信息以及坐标信息的原始背景图像导入到背景图像调整单元,根据像素信 息以及与当前的显示模式相匹配的调整算法对原始背景图像进行调整,得到目标背景图像, 将目标背景图像导入到预处理单元,通过预处理单元对目标背景图像进行区域划分得到多个 候选背景区域;4. Import the original background image containing pixel information and coordinate information into the background image adjustment unit, adjust the original background image according to the pixel information and the adjustment algorithm matching the current display mode, obtain the target background image, and convert the target background image Imported into the preprocessing unit, and the target background image is divided into regions by the preprocessing unit to obtain multiple candidate background regions;

5.历史图层颜色库在对目标背景图像进行划分操作后,可以对各个图层的颜色进行存储 并记录,生成对应的数据库,具体地,该历史图层颜色库可以额识别各个目标背景区域对应 的背景像素值,并将各个背景像素值返回给背景图像调整单元;5. After the historical layer color library divides the target background image, it can store and record the color of each layer to generate a corresponding database. Specifically, the historical layer color library can identify each target background area. The corresponding background pixel value, and each background pixel value is returned to the background image adjustment unit;

6.背景图像调整单元可以将分块后的目标背景图像以及各个候选背景区域的背景像素值 发送给前景对象处理单元;6. the background image adjustment unit can send the target background image after the segmentation and the background pixel value of each candidate background area to the foreground object processing unit;

7.前景图像处理单元可以根据各个候选背景区域的像素值以及对应的显示区域,对各个 前景对象进行调整,生成目标对象;7. The foreground image processing unit can adjust each foreground object to generate a target object according to the pixel value of each candidate background region and the corresponding display region;

8.前进图像处理单元见输出的目标对象返回给显示模式调整单元,通过显示模式调整单 元对目标对象以及目标背景图像进行合并,生成目标页面。8. The forward image processing unit sees the output target object and returns it to the display mode adjustment unit, and merges the target object and the target background image through the display mode adjustment unit to generate the target page.

示例性地,图10示出了本申请一实施例提供的基于深色显示模式的页面显示的流程示 意图。参见图10所示,该目标页面包含有四个不同的显示对象,分别为根视图Rootview、 背景图层ImageView、第一前景文本TextView1以及第二前景文本TextView2。终端设备将 上述四个显示对象同时导入到预处理单元,确定对应的预处理方式,其中,预处理单元可以 根据各个显示对象的显示层级的次序依次确定各个待显示对象的调整方式,由于Rootview 处于最底显示层级,因此预处理单元首先确定Rootview的调整方式,该Rootview为单色图 像,则在进行深色显示模式调整时,需要将单色图像进行反色处理;而ImageView为第二层 级的显示对象,并且为多色背景图像,则在进行深色显示模式调整时,将ImageView的亮度 值降低,而无需执行反色处理;最后,对于TextView1以及TextView2为第三层级的显示对 象,且上一层级的背景图像为ImageView,执行的是亮度降低处理,此时,若对TextView1 以及TextView2进行反色处理,则会导致反色后的文本对象与关联背景区域的颜色相同或相 似,因此,终端设备改变原本的反色处理策略,采用亮度降低处理。终端设备通过预处理单 元识别各个显示对象的调整策略,并将各个调整策略以及显示对象通过调整单元进行调整, 输出目标背景图像以及目标对象,基于目标背景对象以及目标对象生成目标页面。Exemplarily, FIG. 10 shows a schematic flowchart of page display based on the dark display mode provided by an embodiment of the present application. Referring to FIG. 10 , the target page contains four different display objects, namely the root view Rootview, the background layer ImageView, the first foreground text TextView1 and the second foreground text TextView2. The terminal device imports the above four display objects into the preprocessing unit at the same time, and determines the corresponding preprocessing method. The bottom display level, so the preprocessing unit first determines the adjustment method of the Rootview. The Rootview is a monochrome image. When adjusting the dark display mode, the monochrome image needs to be inverted; and ImageView is the second level. If the display object is a multi-color background image, when adjusting the dark display mode, reduce the brightness value of ImageView without performing inverse color processing; finally, for TextView1 and TextView2, which are the third-level display objects, and the upper The background image of the first level is ImageView, and the brightness reduction process is performed. At this time, if TextView1 and TextView2 are inversely processed, the color of the text object after inversion will be the same or similar to the color of the associated background area. Therefore, the terminal The device changes the original inverse color processing strategy and adopts brightness reduction processing. The terminal device identifies the adjustment strategy of each display object through the preprocessing unit, adjusts each adjustment strategy and display object through the adjustment unit, outputs the target background image and the target object, and generates the target page based on the target background object and the target object.

在本申请实施例中,通过对目标背景图像进行分块,得到多个候选背景区域,并根据各 个前景对象的中心坐标,从候选背景区域中选取关联的目标背景区域,从而能够提高关联背 景区域的选取效率,继而减少了目标页面的构建时长。In the embodiment of the present application, a plurality of candidate background regions are obtained by segmenting the target background image, and the associated target background region is selected from the candidate background regions according to the center coordinates of each foreground object, so that the associated background region can be improved. The selection efficiency is improved, which in turn reduces the construction time of the target page.

图11示出了本申请第三实施例提供的一种页面显示的方法S801的具体实现流程图。参 见图11,相对于图8所述实施例,本实施例提供的一种页面显示的方法中S801包括:S1101~S1102,具体详述如下:FIG. 11 shows a specific implementation flowchart of a method S801 for displaying a page provided by the third embodiment of the present application. Referring to FIG. 11 , with respect to the embodiment shown in FIG. 8 , in a method for displaying a page provided in this embodiment, S801 includes: S1101 to S1102, which are described in detail as follows:

进一步地,所述将所述目标背景图像划分为多个候选背景区域,包括:Further, dividing the target background image into multiple candidate background regions, including:

在S1101中,获取最小前景尺寸,将所述最小前景尺寸作为确定分块尺寸。In S1101, the minimum foreground size is obtained, and the minimum foreground size is used as the determined block size.

在本实施例中,终端设备在对目标背景图像进行区域划分时,需要获取基础区域的大小, 即上述的分块尺寸。终端设备可以通过检测目标页面内的包含的前景对象的最小尺寸确定分 块尺寸,也可以根据行业标准的最小前景尺寸,确定上述分块尺寸。In this embodiment, when the terminal device performs region division on the target background image, it needs to acquire the size of the base region, that is, the above-mentioned block size. The terminal device may determine the block size by detecting the minimum size of the foreground object contained in the target page, or may determine the above-mentioned block size according to the industry standard minimum foreground size.

在S1102中,基于所述分块尺寸对所述目标背景图像进行划分,得到多个所述候选背景 区域。In S1102, the target background image is divided based on the block size to obtain a plurality of candidate background regions.

在本实施例中,在确定了每个网格对应的分块尺寸后,可以基于该分块尺寸将显示屏划 分为多个区域,并根据目标背景图像在显示屏内所覆盖的网格,得到多个候选背景区域。示 例性地,图12示出了本申请一实施例提供的候选背景区域的划分示意图。参见图12所示, 目标页面包含有两个背景图像,分别为背景图像1以及背景图像2,其中,背景图像1的边 界坐标并非与显示屏的边界重叠,终端设备在获取了分块尺寸后,可以基于分块尺寸对整个 显示屏进行划分,得到多个分块,背景图像1以及背景图像2可以根据已生成的网格线,进 行区域划分,得到多个候选背景区域。其中,背景图像1包含有3*2个候选背景区域,其第 一个候选背景区域相对于显示屏的所有背景区域而言,其行列号为第一行,第二列,与屏幕 边界之间具有一定的偏移量。In this embodiment, after the block size corresponding to each grid is determined, the display screen can be divided into multiple regions based on the block size, and according to the grid covered by the target background image in the display screen, Get multiple candidate background regions. Exemplarily, FIG. 12 shows a schematic diagram of division of candidate background regions provided by an embodiment of the present application. Referring to FIG. 12 , the target page contains two background images, namely background image 1 andbackground image 2, wherein the boundary coordinates of background image 1 do not overlap with the boundary of the display screen. After the terminal device obtains the block size , the entire display screen can be divided based on the block size to obtain multiple blocks. The background image 1 and thebackground image 2 can be divided according to the generated grid lines to obtain multiple candidate background areas. Among them, the background image 1 contains 3*2 candidate background areas, and the first candidate background area is relative to all the background areas of the display screen, and its row and column numbers are the first row, the second column, and the screen boundary. with a certain offset.

在本申请实施例中,通过识别显示器的分辨率,确定分块尺寸,并基于分块尺寸对目标 背景图像进行区域划分,从而得到多个候选背景区域,提高了分块的准确性,避免了前景对 象的关联背景区域重叠。In the embodiment of the present application, by identifying the resolution of the display, determining the size of the block, and dividing the target background image based on the size of the block, multiple candidate background regions are obtained, the accuracy of the block is improved, and the The associated background area of the foreground object overlaps.

图13示出了本申请第四实施例提供的一种页面显示的方法S802的具体实现流程图。参 见图13,相对于图8所述实施例,本实施例提供的一种页面显示的方法中S802包括:S1301~S1303,具体详述如下:FIG. 13 shows a specific implementation flowchart of a page display method S802 provided by the fourth embodiment of the present application. Referring to FIG. 13 , with respect to the embodiment shown in FIG. 8 , in a method for displaying a page provided in this embodiment, S802 includes: S1301 to S1303, which are described in detail as follows:

进一步地,所述根据所述前景对象的中心坐标以及所述目标背景图像的边界坐标,从所 述候选背景区域中选取与所述前景对象对应的所述关联背景区域,包括:Further, according to the center coordinates of the foreground object and the boundary coordinates of the target background image, from the candidate background region, select the associated background region corresponding to the foreground object, including:

在S1301中,根据各个候选背景区域的在所述目标背景图像的显示位置,为各个候选背 景区域配置关联的基准行列号;In S1301, according to the display position of each candidate background region in the target background image, configure the associated reference row and column number for each candidate background region;

Figure BDA0002378659890000161
Figure BDA0002378659890000161

其中,Colunm0为所述候选背景区域的基准列序号;Row0为所述所述候选背景区域的基 准行序号;(SrcX0,SrcY0)为所述候选背景图像的边界坐标;(pX,pY)为所述候选背景区域的 中心坐标;(Sizex,Sizey)为所述候选背景区域的区域尺寸。Wherein, Colunm0 is the reference column sequence number of the candidate background region; Row0 is the reference row sequence number of the candidate background region; (SrcX0 , SrcY0 ) are the boundary coordinates of the candidate background image; (pX, pY) is the center coordinate of the candidate background area; (Sizex , Sizey ) is the area size of the candidate background area.

在本实施例中,终端设备在对目标背景图像划分为多个候选背景区域后,可以根据各个 候选背景区域在目标背景图像内的显示位置,配置对应的基准行列号,通过网格坐标来确定 各个候选背景区域的位置,实现了对目标背景图像的降采样处理。In this embodiment, after the terminal device divides the target background image into multiple candidate background regions, it can configure the corresponding reference row and column numbers according to the display positions of each candidate background region in the target background image, and determine by grid coordinates The position of each candidate background region realizes down-sampling processing of the target background image.

需要说明的是,若目标页面内包含有多个前景对象,则只需执行一次S1301的操作,即 确定各个候选背景区域的基准行列号即可,由于通过对目标背景区域进行网格化,在识别关 联背景区域时只需确定前景对象的大致位置即可,从而减少了关联背景区域的选取时的运算 量,从而能够提高关联背景区域的选取效率。It should be noted that if the target page contains multiple foreground objects, the operation of S1301 only needs to be performed once, that is, the reference row and column numbers of each candidate background area can be determined. When identifying the associated background area, only the approximate position of the foreground object needs to be determined, thereby reducing the amount of computation when selecting the associated background area, thereby improving the selection efficiency of the associated background area.

在S1302中,将所述前景对象中心坐标导入预设的行列转换模型,计算所述前景对象的 目标行列号;所述行列转换模型具体为:In S1302, the center coordinates of the foreground object are imported into a preset row-column conversion model, and the target row-column number of the foreground object is calculated; the row-column conversion model is specifically:

将所述前景对象中心坐标导入预设的行列转换模型,计算所述前景对象的目标行列号; 所述行列转换模型具体为:The center coordinates of the foreground object are imported into a preset row-column conversion model, and the target row-column number of the foreground object is calculated; the row-column conversion model is specifically:

Figure BDA0002378659890000171
Figure BDA0002378659890000171

其中,Colunm1为所述目标行列号内的列序号;Row1为所述目标行列号内的行序号;(SrcX1,SrcY1)为所述前景对象的中心坐标;(Sizex,Sizey)为所述候选背景区域的区域尺寸; (Targetx,Targety)为所述前景对象的对象尺寸。Wherein, Colunm1 is the column number in the target row and column number; Row1 is the row number in the target row and column number; (SrcX1 , SrcY1 ) is the center coordinate of the foreground object; (Sizex , Sizey ) is the area size of the candidate background area; (Targetx , Targety ) is the object size of the foreground object.

在本实施例中,终端设备在计算上述行列号的过程中,可以统一采用向下取整的方式计 算目标行列号以及基准行列号,在该情况下,上述的转换公式可以变更为:In the present embodiment, in the process of calculating the above-mentioned row and column number, the terminal equipment can uniformly adopt the round-down mode to calculate the target row and column number and the reference row and column number, in this case, the above-mentioned conversion formula can be changed to:

Figure BDA0002378659890000172
Figure BDA0002378659890000172

其中,

Figure BDA0002378659890000173
为取整函数。in,
Figure BDA0002378659890000173
is the rounding function.

举例性地,若某一前景对象的中心坐标为(25,25),而该前景对象的对象尺寸为3*3 像素,上述每个候选背景区域的区域尺寸为5*5,则上述目标行编号通过上述公式计算得到 的数值为:(25+3/2)/5=5.3,通过取整函数进行向下取整,则为5。For example, if the center coordinate of a foreground object is (25, 25), and the object size of the foreground object is 3*3 pixels, and the area size of each of the above candidate background areas is 5*5, then the above target row The numerical value calculated by the above formula is: (25+3/2)/5=5.3, and it is 5 if it is rounded down by the rounding function.

在本实施例中,由于目标背景图像与显示屏之间具有一定的偏移量,为了能够确定前景 对象与目标背景图像之间的相对位置,在计算前景对象在目标背景图像内对应的目标行列号 时,需要考虑目标背景图像的边界坐标对应的偏移量。其中,该边界坐标具体为与显示屏对 应的坐标原点距离最近的边界点。举例性地,若该显示屏的原点坐标为左上角的屏幕边界点, 则上述目标背景图像的边界坐标即为目标背景图像的左上角的在显示屏的坐标系内的对应 的边界坐标。In this embodiment, since there is a certain offset between the target background image and the display screen, in order to determine the relative position between the foreground object and the target background image, the target row and column corresponding to the foreground object in the target background image are calculated. number, the offset corresponding to the boundary coordinates of the target background image needs to be considered. Wherein, the boundary coordinate is specifically the boundary point that is closest to the coordinate origin corresponding to the display screen. For example, if the origin coordinate of the display screen is the screen boundary point in the upper left corner, then the boundary coordinates of the target background image are the corresponding boundary coordinates of the upper left corner of the target background image in the coordinate system of the display screen.

图14示出了本申请一实施例提供的目标行列号的选取示意图。参见图14所示,目标背 景图像并非与终端设备的屏幕边界完全重合,具有一定的偏移量,即(SrcX0,SrcY0)。在确定 该前景对象相对于目标背景区域的目标行列号时,需要考虑上述的偏移量,避免因上述偏移 量而导致关联背景区域的选取错位,如图14所示,若不考虑上述的偏移量,前景对象相当 于整个显示屏而言,对应的行列号为(3,1),而相对于目标背景区域的行列号为(2,1), 因为目标背景图像的横坐标与显示屏的坐标原点之间具有一定的偏移量,若基于行列号为 (3,1)获取关联背景区域,则会导致背景区域错位,从而影响后续的调整效果。FIG. 14 shows a schematic diagram of selection of target row and column numbers provided by an embodiment of the present application. Referring to FIG. 14 , the target background image does not completely coincide with the screen boundary of the terminal device, but has a certain offset, namely (SrcX0 , SrcY0 ). When determining the target row and column numbers of the foreground object relative to the target background area, the above offsets need to be considered to avoid the selection of the associated background area due to the above offsets. As shown in Figure 14, if the above offsets are not considered Offset, the foreground object is equivalent to the entire display screen, the corresponding row and column number is (3,1), and the row and column number relative to the target background area is (2,1), because the abscissa of the target background image and the display There is a certain offset between the coordinate origins of the screen. If the associated background area is obtained based on the row and column numbers of (3,1), the background area will be dislocated, thereby affecting the subsequent adjustment effect.

在S1303中,选取所述基准行列号与所述目标行列号匹配的所述候选背景区域作为所述 前景对象的关联背景区域。In S1303, the candidate background region whose reference row and column number matches the target row and column number is selected as the associated background region of the foreground object.

在本实施例中,终端设备可以从候选背景区域中,选取基准行列号与目标行列号相匹配 的候选背景区域作为关联背景区域。In this embodiment, the terminal device may select, from the candidate background regions, the candidate background regions whose reference row and column numbers match the target row and column numbers as the associated background regions.

在本申请实施例中,通过对候选背景区域进行行列编码,并根据行列号为每个前景对象 配置对应的关联背景区域,能够提高关联背景区域的选取效率。In the embodiment of the present application, by performing row and column coding on the candidate background area, and configuring the corresponding associated background area for each foreground object according to the row and column number, the selection efficiency of the associated background area can be improved.

图15示出了本申请第五实施例提供的一种页面显示的方法S304的具体实现流程图。参 见图15,相对于图3所述实施例,本实施例提供的一种页面显示的方法中S304包括:S1501~S1504,具体详述如下:FIG. 15 shows a specific implementation flowchart of a page display method S304 provided by the fifth embodiment of the present application. Referring to FIG. 15 , with respect to the embodiment shown in FIG. 3 , in a method for displaying a page provided in this embodiment, S304 includes: S1501 to S1504, which are described in detail as follows:

进一步地,所述显示模式为深色显示模式,则所述根据所述关联背景区域的背景像素值, 将所述前景对象调整为与所述显示模式对应的目标对象,包括:Further, if the display mode is a dark display mode, the adjusting the foreground object to a target object corresponding to the display mode according to the background pixel value of the associated background area includes:

在S1501中,获取关联背景区域的中心坐标的像素值以及透明度。In S1501, the pixel value and transparency of the center coordinate of the associated background area are acquired.

在本实施例中,为了提高调整的效率,终端设备可以根据目标背景图像的各个候选背景 区域的中心坐标的像素值,作为整个候选背景区域的特征像素值,从而在进行前景图像的调 整过程中,可以将目标背景图像降采样为一网格图像,每个网格图像的像素值以及透明度可 以根据中心坐标的像素值以及透明度进行确定,从而能够减少目标背景图像在缓存区域内的 存储空间,并且能够提高后续操作的处理效率。In this embodiment, in order to improve the efficiency of adjustment, the terminal device can use the pixel value of the center coordinate of each candidate background area of the target background image as the characteristic pixel value of the entire candidate background area, so that during the adjustment process of the foreground image , the target background image can be downsampled into a grid image, and the pixel value and transparency of each grid image can be determined according to the pixel value and transparency of the center coordinate, thereby reducing the storage space of the target background image in the cache area, And can improve the processing efficiency of subsequent operations.

在S1502中,根据所述中心坐标的所述像素值以及所述透明度,确定所述关联背景区域 的背景亮度值。In S1502, the background brightness value of the associated background region is determined according to the pixel value of the center coordinate and the transparency.

在本实施例中,背景亮度值除了与像素值相关外,还与目标背景图像的透明度相关,根 据透明度的大小,可以确定下一层级图层对于当前目标背景图像的颜色贡献比例,例如目标 背景图像的下一层级的图像为白色图像,且当前的透明度并不为0,则在原有的像素值的基 础上,叠加增加白色的比重,从而提高整体图像的亮度值,基于此,为了准确确定目标背景 图像的像素值,以便确定前景对象的调整策略,终端设备可以根据中心坐标的像素值以及透 明度,计算得到关联背景区域的背景亮度值。In this embodiment, the background brightness value is not only related to the pixel value, but also related to the transparency of the target background image. According to the size of the transparency, the color contribution ratio of the next layer layer to the current target background image can be determined. The image of the next level of the image is a white image, and the current transparency is not 0. On the basis of the original pixel value, the proportion of white is superimposed to increase the brightness value of the overall image. Based on this, in order to accurately determine The pixel value of the target background image is used to determine the adjustment strategy of the foreground object. The terminal device can calculate the background brightness value of the associated background area according to the pixel value and transparency of the center coordinate.

在S1503中,若所述背景亮度值大于预设的亮度阈值,则对所述前景对象进行降低亮度 处理,生成所述目标对象。In S1503, if the background brightness value is greater than a preset brightness threshold, the foreground object is subjected to brightness reduction processing to generate the target object.

在本实施例中,由于当前的显示模式为深色显示模式,因此需要使得整体画面的亮度值, 此时若检测到关联背景区域的亮度值大于预设的亮度阈值,则表示当前的关联背景区域的处 于较高亮度,而前景对象在调整前的默认颜色往往是黑色等低亮度颜色,此时若对上述颜色 进行反色,则会变更为高亮度的颜色,从而导致了调整后的关联背景图像与调整后的前景对 象的颜色相同或相似,为了避免上述情况发生,终端设备则不对前景对象进行反色,而是对 前景对象进行降低亮度处理,从而生成亮度较低的目标对象。In this embodiment, since the current display mode is the dark display mode, it is necessary to make the brightness value of the overall screen. At this time, if the brightness value of the associated background area is detected to be greater than the preset brightness threshold, it means the current associated background The area is in high brightness, and the default color of the foreground object before adjustment is often a low-brightness color such as black. At this time, if the above color is reversed, it will be changed to a high-brightness color, resulting in the adjusted association. The background image has the same or similar color as the adjusted foreground object. In order to avoid the above situation, the terminal device does not invert the foreground object, but reduces the brightness of the foreground object, thereby generating a target object with lower brightness.

其中,进行降低亮度处理的方式可以为:终端设备将前景对象转换为HSV格式的图像, 并对亮度V图层的数值进行调整,基于调整后的V图层与其余两个图像进行合并,从而实 现了降低前景对象的亮度的目的。The manner of performing the brightness reduction process may be as follows: the terminal device converts the foreground object into an image in HSV format, adjusts the value of the brightness V layer, and combines the adjusted V layer with the remaining two images, thereby The purpose of reducing the brightness of foreground objects is achieved.

在S1504中,若所述背景亮度值小于或等于所述亮度阈值,则对所述前景对象进行反色 处理,生成所述目标对象。In S1504, if the background luminance value is less than or equal to the luminance threshold, the foreground object is subjected to inverse color processing to generate the target object.

在本实施例中,终端设备若检测到当前的关联背景区域的亮度值小于或等于亮度阈值, 则可以对前景对象进行反色处理,由于前景对象在调整前的默认颜色往往是黑色等低亮度颜 色,因此通过反色处理以后会变更为亮度较高的颜色,此时与关联背景之间存在较高的颜色 对比度,使得前景对象清晰可见,提高了前景对象的可见度。In this embodiment, if the terminal device detects that the brightness value of the current associated background area is less than or equal to the brightness threshold, it can perform inverse color processing on the foreground object, because the default color of the foreground object before adjustment is often low brightness such as black. Therefore, after inversion processing, it will be changed to a color with higher brightness. At this time, there is a higher color contrast with the associated background, which makes the foreground object clearly visible and improves the visibility of the foreground object.

在本申请实施例中,通过识别获取关联背景区域的中心坐标的像素值以及透明度,将确 定关联背景区域的亮度值,基于亮度值确定前景对象的调整策略,避免背景与前景对象之间 颜色相同或相似,提高了调整效果。In the embodiment of the present application, by identifying and obtaining the pixel value and the transparency of the center coordinate of the associated background area, the brightness value of the associated background area will be determined, and the adjustment strategy of the foreground object will be determined based on the brightness value, so as to avoid the background and the foreground object having the same color or similar, which improves the adjustment effect.

图16示出了本申请第六实施例提供的一种页面显示的方法的具体实现流程图。参见图 16,相对于图15所述实施例,本实施例提供的一种页面显示的方法在所述根据所述中心坐 标的所述像素值以及所述透明度,确定所述关联背景区域的亮度值之后,还包括:S1601~S1603,具体详述如下:FIG. 16 shows a specific implementation flowchart of a page display method provided by the sixth embodiment of the present application. Referring to FIG. 16 , compared to the embodiment shown in FIG. 15 , in a method for page display provided by this embodiment, the brightness of the associated background area is determined according to the pixel value of the center coordinate and the transparency. After the value, it also includes: S1601~S1603, the details are as follows:

进一步地,在所述根据所述中心坐标的所述像素值以及所述透明度,确定所述关联背景 区域的亮度值之后,还包括:Further, after determining the brightness value of the associated background area according to the pixel value and the transparency of the center coordinates, it also includes:

在S1601中,根据所述前景对象内各个像素点的所述像素值,确定所述前景对象对应的 特征亮度值。In S1601, the characteristic brightness value corresponding to the foreground object is determined according to the pixel value of each pixel in the foreground object.

在本实施例中,终端设备除了可以根据亮度值直接确定前景图像的调整策略外,还可以 根据前景对象的实际亮度值,确定调整策略。在该情况下,终端设备可以根据前景对象内各 个像素点的像素值,计算该前景对象的像素均值,并基于该像素均值确定前景对象的特征亮 度值。在一种可能的实现方式中,终端设备可以选取前景对象的中心坐标的像素值,作为前 景对象的特征像素值,并基于中心坐标的特征像素值计算得到前景对象的特征亮度值。In this embodiment, in addition to directly determining the adjustment strategy of the foreground image according to the brightness value, the terminal device may also determine the adjustment strategy according to the actual brightness value of the foreground object. In this case, the terminal device may calculate the pixel mean value of the foreground object according to the pixel value of each pixel in the foreground object, and determine the characteristic brightness value of the foreground object based on the pixel mean value. In a possible implementation manner, the terminal device may select the pixel value of the center coordinate of the foreground object as the feature pixel value of the foreground object, and calculate the feature brightness value of the foreground object based on the feature pixel value of the center coordinate.

在S1602中,若所述背景亮度值与所述特征亮度值之间的亮度差值大于预设的反色阈值, 则对所述前景对象进行降低亮度处理,生成所述目标对象。In S1602, if the brightness difference between the background brightness value and the feature brightness value is greater than a preset inverse color threshold, the foreground object is subjected to brightness reduction processing to generate the target object.

在本实施例中,终端设备若检测到背景亮度值与前景对象在调整前的特征亮度值之间的 亮度差值大于预设的反色阈值,则表示调整前的对比度已经满足显示要求,无需对前景对象 进行反色处理,只需调整亮度即可。In this embodiment, if the terminal device detects that the brightness difference between the background brightness value and the characteristic brightness value of the foreground object before adjustment is greater than the preset inverse color threshold, it means that the contrast before adjustment has met the display requirements, and no need Invert foreground objects, just adjust the brightness.

在S1603中,若所述亮度差值小于或等于所述反色阈值,则对所述前景对象进行反色处 理,生成所述目标对象。In S1603, if the luminance difference value is less than or equal to the inverse color threshold, inverse color processing is performed on the foreground object to generate the target object.

在本实施例中,终端设备若检测到背景亮度值与前景对象在调整前的特征亮度值之间的 亮度差值小于或等于预设的反色阈值,则表示调整前的对比度相差较少,此时对前景对象进 行反色处理,则可以提高前景对象与背景图像之间的对比度,因此进行反色处理。In this embodiment, if the terminal device detects that the brightness difference between the background brightness value and the characteristic brightness value of the foreground object before adjustment is less than or equal to the preset inverse color threshold, it means that the contrast difference before adjustment is small, At this time, performing inverse color processing on the foreground object can improve the contrast between the foreground object and the background image, so the inverse color processing is performed.

在本申请实施例中,通过获取前景对象的特征亮度值,根据特征亮度值与背景亮度值之 间的差值确定调整策略,能够提高调整操作的准确性。In the embodiment of the present application, by acquiring the characteristic brightness value of the foreground object, and determining the adjustment strategy according to the difference between the characteristic brightness value and the background brightness value, the accuracy of the adjustment operation can be improved.

图17示出了本申请第七实施例提供的一种页面显示的方法S302的具体实现流程图。参 见图17,相对于图3、图8、图11、图13、图15以及图16任一所述实施例,本实施例提供的一种页面显示的方法在S302包括:S1701~S1703,具体详述如下:FIG. 17 shows a specific implementation flowchart of a method S302 for displaying a page provided by the seventh embodiment of the present application. Referring to FIG. 17 , with respect to any of the embodiments described in FIG. 3 , FIG. 8 , FIG. 11 , FIG. 13 , FIG. 15 , and FIG. 16 , a page display method provided in this embodiment includes in S302 : S1701 to S1703 , specifically Details are as follows:

进一步地,所述识别所述目标页面内各个前景对象在所述目标背景图像内的关联背景区 域,包括:Further, the described identification of the associated background area of each foreground object in the target background image in the target page includes:

在S1701中,确定所述前景对象在所述目标页面内的显示层级。In S1701, the display level of the foreground object in the target page is determined.

在本实施例中,目标页面内可以包含有多个图层,每个图层对应一个显示层级,前景对 象往往处于较高的显示层级,而背景图像往往处于较低的显示层级,从而实现了以背景图像 为底,前景对象覆盖与背景图像之上的显示效果。在该情况下,一个页面可以通过多个背景 图像进行叠加构成整个页面的背景,即一个前景对象可以在不同的显示层级对应不同的背景 图像,而影响前景对象的可见度以及是否会出现颜色相同或相似的情况时,往往是受相邻层 级的背景图像影响。在该情况下,终端设备需要确定与前景对象处于相邻显示层级的背景图 像,因此需要识别该前景对象在目标页面内的显示层级。In this embodiment, the target page may contain multiple layers, each layer corresponds to a display level, the foreground object is often at a higher display level, and the background image is often at a lower display level, thereby realizing The display effect of the foreground object overlaid on the background image with the background image as the base. In this case, a page can be superimposed with multiple background images to form the background of the entire page, that is, a foreground object can correspond to different background images at different display levels, which affects the visibility of the foreground object and whether it will appear with the same color or not. In similar situations, it is often affected by the background images of adjacent layers. In this case, the terminal device needs to determine the background image at the display level adjacent to the foreground object, and therefore needs to identify the display level of the foreground object in the target page.

在S1702中,在所述目标页面内选取与所述显示层级相邻层级的目标背景图像作为所述 前景对象的关联背景图像。In S1702, a target background image of a level adjacent to the display level is selected in the target page as the associated background image of the foreground object.

在本实施例中,终端设备可以获取得到各个目标背景图像的显示层级,并选取显示层级 与前景对象的显示层级相邻的目标背景图像作为前景对象的关联背景图像。In this embodiment, the terminal device can obtain the display level of each target background image, and select the target background image whose display level is adjacent to the display level of the foreground object as the associated background image of the foreground object.

在S1703中,确定所述前景对象在所述关联背景图像内的关联背景区域。In S1703, an associated background area of the foreground object within the associated background image is determined.

在本实施例中,终端设备在确定了前进对象的关联背景对象后,可以根据前景对象的显 示位置,从关联背景图像中确定出对应的关联背景区域。其中,确定关联背景区域的方式可 以参见S302的相关描述,还可以采用第二至四实施例提供的方式进行确定,在此不再赘述。In this embodiment, after determining the associated background object of the advancing object, the terminal device may determine the corresponding associated background area from the associated background image according to the display position of the foreground object. Wherein, reference may be made to the relevant description of S302 for the manner of determining the associated background region, and the manners provided in the second to fourth embodiments may also be used for determination, which will not be repeated here.

在本申请实施例中,通过确定与前景对象层级相邻的目标背景图像作为关联背景图像, 从而在多个背景图像叠加的情况下,能够准确确定关联的背景区域,提高了后续调整方式确 定的准确性。In the embodiment of the present application, the target background image adjacent to the foreground object level is determined as the associated background image, so that in the case of overlapping multiple background images, the associated background area can be accurately determined, which improves the accuracy of the subsequent adjustment method. accuracy.

图18示出了本申请第八实施例提供的一种页面显示的方法S303的具体实现流程图。参 见图18,相对于图3、图8、图11、图13、图15以及图16任一所述实施例,本实施例提供的一种页面显示的方法在S303包括:S1801~S1802,具体详述如下:FIG. 18 shows a specific implementation flowchart of a page display method S303 provided by the eighth embodiment of the present application. Referring to FIG. 18 , with respect to any of the embodiments described in FIG. 3 , FIG. 8 , FIG. 11 , FIG. 13 , FIG. 15 , and FIG. 16 , a page display method provided in this embodiment includes in S303 : S1801 to S1802 , specifically Details are as follows:

进一步地,所述根据所述关联背景区域的背景像素值,将所述前景对象调整为与所述显 示模式对应的目标对象,包括:Further, according to the background pixel value of the associated background area, the foreground object is adjusted to the target object corresponding to the display mode, including:

在S1801中,根据所述关联背景区域的背景像素值以及所述前景对象的像素值,生成所 述前景对象对应的预览对象。In S1801, a preview object corresponding to the foreground object is generated according to the background pixel value of the associated background region and the pixel value of the foreground object.

在本实施例中,终端设备除了根据上下层级确定前景对象的调整方式外,还可以根据统 一层级相邻的前景对象的调整方式,确定自身的调整方式,从而保证了整体显示效果的一致 性。在该情况下,终端设备可以根据关联背景区域的背景像素值以及前景对象的像素值,生 成前景对象的预览对象。对所有前景对象均执行上述方式,此时,该预览对象并非最后输出 的调整后的前景对象的显示效果。In this embodiment, in addition to determining the adjustment method of the foreground objects according to the upper and lower levels, the terminal device can also determine its own adjustment method according to the adjustment methods of the adjacent foreground objects at the same level, thereby ensuring the consistency of the overall display effect. In this case, the terminal device may generate a preview object of the foreground object according to the background pixel value of the associated background area and the pixel value of the foreground object. The above method is performed for all foreground objects, and at this time, the preview object is not the display effect of the last outputted foreground object after adjustment.

在S1802中,根据所述预览对象对应的所有关联对象的像素值以及所述预览对象的像素 值,生成所述前景对象对应的所述目标对象。In S1802, the target object corresponding to the foreground object is generated according to the pixel values of all associated objects corresponding to the preview object and the pixel values of the preview object.

在本实施例中,终端设备可以根据所有预览对象生成对应的预览页面,终端设备可以根 据各个预览对象的显示位置,确定每个预览对象对应的关联对象。其中,该关联对象为通过 S1801处理后,与预览对象存在关联关系的其他预览对象。上述关联关系可以为两个预览对 象之间的显示位置相邻;还可以两个预览对象的对象类型相同;特别地,若两个预览对象为 文本对象,且上述两个预览对象位于同一语句或段落,则可以识别上述两个预览对象存在关 联关系。In this embodiment, the terminal device may generate a corresponding preview page according to all the preview objects, and the terminal device may determine the associated object corresponding to each preview object according to the display position of each preview object. Wherein, the associated object is another preview object that has an associated relationship with the preview object after being processed in S1801. The above-mentioned association relationship may be that the display positions between the two preview objects are adjacent; the object types of the two preview objects may also be the same; in particular, if the two preview objects are text objects, and the two preview objects are located in the same statement or paragraph, it can be recognized that the above two preview objects are associated.

在本实施例中,终端设备可以识别预览对象的像素值与关联对象的像素值之间的差值是 否小于预设的关联阈值,若是,则识别预览对象与关联对象之间的显示效果统一,将预览对 象作为目标对象;反之,若检测到预览对象与关联对象之间的像素差值大于或等于关联阈值, 则识别预览对象与关联对象之间的显示效果不统一,此时可以根据预览对象以及关联对象的 像素均值,调整预览对象以及关联对象,将调整后的预览对象作为目标对象,进行显示。In this embodiment, the terminal device can identify whether the difference between the pixel value of the preview object and the pixel value of the associated object is smaller than a preset association threshold, and if so, identify that the display effect between the preview object and the associated object is unified, Take the preview object as the target object; on the contrary, if it is detected that the pixel difference between the preview object and the associated object is greater than or equal to the associated threshold, it is recognized that the display effect between the preview object and the associated object is not uniform. and the pixel mean value of the associated object, adjust the preview object and the associated object, and display the adjusted preview object as the target object.

图19示出了本申请一实施例提供的目标对象的生成示意图。参见图19的(a)为基于 各个预览对象生成的预览页面;而图19的(b)为基于关联对象对预览对象进行调整后的目 标页面。参见图19可以确定,该预览页面内包含有四个前景对象,分别为文本“前”、“景”、 “对”以及“像”,其中,根据关联背景区域进行调整后,文本“前”的预览对象调整为白色,而其他文本的预览对象调整为黑色。而由于上述四个对象之间为关联对象,因此需要统一显示效果,因此可以将文本“前”调整为与其他关联对象的调整方式一致的显示效果,即调整为黑色,从而保证关联文本显示效果的一致性。FIG. 19 shows a schematic diagram of generating a target object provided by an embodiment of the present application. Refer to Fig. 19(a) for the preview page generated based on each preview object; and Fig. 19(b) for the target page after adjusting the preview object based on the associated object. Referring to FIG. 19, it can be determined that the preview page contains four foreground objects, which are the texts "front", "scene", "pair" and "image", wherein, after adjustment according to the associated background area, the text "front" The preview object of the text is adjusted to white, and the preview object of other text is adjusted to black. Since the above four objects are related objects, the display effect needs to be unified. Therefore, the text "front" can be adjusted to the display effect consistent with the adjustment method of other related objects, that is, adjusted to black, so as to ensure the display effect of the related text. consistency.

在本申请实施例中,通过各个前景对象在同一层级的关联对象,根据关联对象确定前景 对象的调整策略,保证了同一层级的关联对象之间显示效果的统一性,提高了显示效果。In the embodiment of the present application, through the associated objects of each foreground object at the same level, the adjustment strategy of the foreground object is determined according to the associated object, which ensures the unity of the display effect between the associated objects at the same level, and improves the display effect.

应理解,上述实施例中各步骤的序号的大小并不意味着执行顺序的先后,各过程的执行 顺序应以其功能和内在逻辑确定,而不应对本申请实施例的实施过程构成任何限定。It should be understood that the size of the sequence number of each step in the above-mentioned embodiment does not mean the order of execution, and the execution order of each process should be determined by its function and internal logic, and should not constitute any limitation to the implementation process of the embodiments of the present application.

对应于上文实施例所述的页面显示的方法,图20示出了本申请实施例提供的页面显示 的装置的结构框图,为了便于说明,仅示出了与本申请实施例相关的部分。Corresponding to the page display method described in the above embodiment, FIG. 20 shows a structural block diagram of the page display apparatus provided by the embodiment of the present application. For the convenience of description, only the part related to the embodiment of the present application is shown.

参照图20,该页面显示的装置包括:Referring to Figure 20, the devices displayed on this page include:

背景图像调整单元201,用于将目标页面内的原始背景图像,调整为与当前的显示模式 对应的目标背景图像;The backgroundimage adjustment unit 201 is used to adjust the original background image in the target page to the target background image corresponding to the current display mode;

关联背景区域识别单元202,用于识别所述目标页面内各个前景对象在所述目标背景图 像内的关联背景区域;The associated backgroundarea identification unit 202 is used to identify the associated background area of each foreground object in the target background image in the target page;

前景对象调整单元203,用于根据所述关联背景区域的背景像素值,将所述前景对象调 整为与所述显示模式对应的目标对象;Foregroundobject adjustment unit 203, for adjusting the foreground object to a target object corresponding to the display mode according to the background pixel value of the associated background area;

目标页面生成单元204,用于根据所有所述目标对象以及所述目标背景图像,生成所述 目标页面。The targetpage generating unit 204 is configured to generate the target page according to all the target objects and the target background image.

可选地,所述关联背景区域识别单元202包括:Optionally, the associated backgroundarea identification unit 202 includes:

候选背景区域划分单元,用于将所述目标背景图像划分为多个候选背景区域;a candidate background area dividing unit, used for dividing the target background image into a plurality of candidate background areas;

候选背景区域选取单元,用于根据所述前景对象的中心坐标以及所述目标背景图像的边 界坐标,从所述候选背景区域中选取与所述前景对象对应的所述关联背景区域。A candidate background area selection unit, configured to select the associated background area corresponding to the foreground object from the candidate background area according to the center coordinates of the foreground object and the boundary coordinates of the target background image.

可选地,所述候选背景区域划分单元包括:Optionally, the candidate background area division unit includes:

分块尺寸确定单元,用于获取最小前景尺寸,将所述最小前景尺寸作为确定分块尺寸;a block size determination unit, configured to obtain the minimum foreground size, and use the minimum foreground size as the determined block size;

网格划分单元,用于基于所述分块尺寸对所述目标背景图像进行划分,得到多个所述候 选背景区域。A grid dividing unit, configured to divide the target background image based on the block size to obtain a plurality of the candidate background regions.

可选地,所述候选背景区域选取单元包括:Optionally, the candidate background region selection unit includes:

基准行列号获取单元,用于根据各个候选背景区域的在所述目标背景图像的显示位置, 为各个候选背景区域配置关联的基准行列号;a reference row and column number acquiring unit, configured to configure associated reference row and column numbers for each candidate background region according to the display position of each candidate background region in the target background image;

Figure BDA0002378659890000221
Figure BDA0002378659890000221

其中,Colunm0为所述候选背景区域的基准列序号;Row0为所述所述候选背景区域的基 准行序号;(SrcX0,SrcY0)为所述候选背景图像的边界坐标;(pX,pY)为所述候选背景区域的 中心坐标;(Sizex,Sizey)为所述候选背景区域的区域尺寸;Wherein, Colunm0 is the reference column sequence number of the candidate background region; Row0 is the reference row sequence number of the candidate background region; (SrcX0 , SrcY0 ) are the boundary coordinates of the candidate background image; (pX, pY) is the center coordinate of the candidate background area; (Sizex , Sizey ) is the area size of the candidate background area;

目标行列号获取单元,用于将所述前景对象中心坐标导入预设的行列转换模型,计算所 述前景对象的目标行列号;所述行列转换模型具体为:The target row and column number acquisition unit is used to import the preset row and column conversion model of the foreground object center coordinates, and calculates the target row and column number of the foreground object; The row and column conversion model is specifically:

将所述前景对象中心坐标导入预设的行列转换模型,计算所述前景对象的目标行列号; 所述行列转换模型具体为:The center coordinates of the foreground object are imported into a preset row-column conversion model, and the target row-column number of the foreground object is calculated; the row-column conversion model is specifically:

Figure BDA0002378659890000222
Figure BDA0002378659890000222

其中,Colunm1为所述目标行列号内的列序号;Row1为所述目标行列号内的行序号;(SrcX1,SrcY1)为所述前景对象的中心坐标;(Sizex,Sizey)为所述候选背景区域的区域尺寸; (Targetx,Targety)为所述前景对象的对象尺寸;Wherein, Colunm1 is the column number in the target row and column number; Row1 is the row number in the target row and column number; (SrcX1 , SrcY1 ) is the center coordinate of the foreground object; (Sizex , Sizey ) is the area size of the candidate background area; (Targetx , Targety ) is the object size of the foreground object;

关联背景区域确定单元,用于选取所述基准行列号与所述目标行列号匹配的所述候选背 景区域作为所述前景对象的关联背景区域。an associated background area determination unit, configured to select the candidate background area whose reference row and column number matches the target row and column number as the associated background area of the foreground object.

可选地,所述显示模式为深色显示模式,所述前景对象调整单元203包括:Optionally, the display mode is a dark display mode, and the foregroundobject adjustment unit 203 includes:

中心坐标获取单元,用于获取关联背景区域的中心坐标的像素值以及透明度;The center coordinate obtaining unit is used to obtain the pixel value and transparency of the center coordinate of the associated background area;

背景亮度值确定单元,用于根据所述中心坐标的所述像素值以及所述透明度,确定所述 关联背景区域的背景亮度值;A background brightness value determination unit, for determining the background brightness value of the associated background area according to the pixel value and the transparency of the center coordinate;

第一降低亮度处理单元,用于若所述背景亮度值大于预设的亮度阈值,则对所述前景对 象进行降低亮度处理,生成所述目标对象;The first brightness reduction processing unit is used to reduce the brightness of the foreground object if the background brightness value is greater than a preset brightness threshold to generate the target object;

第一反色处理单元,用于若所述背景亮度值小于或等于所述亮度阈值,则对所述前景对 象进行反色处理,生成所述目标对象。A first inversion processing unit, configured to perform inversion processing on the foreground object if the background brightness value is less than or equal to the brightness threshold to generate the target object.

可选地,所述页面显示单元还包括:Optionally, the page display unit further includes:

特征亮度值获取单元,用于根据所述前景对象内各个像素点的所述像素值,确定所述前 景对象对应的特征亮度值;A characteristic brightness value acquisition unit, for determining the characteristic brightness value corresponding to the foreground object according to the pixel value of each pixel in the foreground object;

第二降低亮度处理单元,用于若所述背景亮度值与所述特征亮度值之间的亮度差值大于 预设的反色阈值,则对所述前景对象进行降低亮度处理,生成所述目标对象;A second brightness reduction processing unit, configured to perform brightness reduction processing on the foreground object if the brightness difference between the background brightness value and the characteristic brightness value is greater than a preset inverse color threshold to generate the target object object;

第二反色处理单元,用于若所述亮度差值小于或等于所述反色阈值,则对所述前景对象 进行反色处理,生成所述目标对象。A second inversion processing unit, configured to perform inversion processing on the foreground object if the luminance difference value is less than or equal to the inversion threshold to generate the target object.

可选地,所述关联背景区域识别单元202包括:Optionally, the associated backgroundarea identification unit 202 includes:

显示层级确定单元,用于确定所述前景对象在所述目标页面内的显示层级;a display level determination unit, configured to determine the display level of the foreground object in the target page;

关联背景图像确定单元,用于在所述目标页面内选取与所述显示层级相邻层级的目标背 景图像作为所述前景对象的关联背景图像;An associated background image determination unit, for selecting the target background image of the adjacent level of the display hierarchy as the associated background image of the foreground object in the target page;

关联背景区域确定单元,用于确定所述前景对象在所述关联背景图像内的关联背景区域。An associated background area determination unit, configured to determine an associated background area of the foreground object in the associated background image.

可选地,所述前景对象调整单元203包括:Optionally, the foregroundobject adjustment unit 203 includes:

预览对象生成单元,用于根据所述关联背景区域的背景像素值以及所述前景对象的像素 值,生成所述前景对象对应的预览对象;A preview object generation unit, for generating a preview object corresponding to the foreground object according to the background pixel value of the associated background area and the pixel value of the foreground object;

关联对象调整单元,用于根据所述预览对象对应的所有关联对象的像素值以及所述预览 对象的像素值,生成所述前景对象对应的所述目标对象。An associated object adjustment unit, configured to generate the target object corresponding to the foreground object according to pixel values of all associated objects corresponding to the preview object and pixel values of the preview object.

因此,本申请实施例提供的页面显示的装置同样可以通过对目标页面内的原始背景图像 进行调整,得到目标背景图像,继而根据各个前景对象在目标背景图像内的关联背景区域的 亮度值,确定前景对象的调整策略,并根据调整策略生成前景对象对应的目标对象,最后根 据目标背景图像以及目标对象生成目标页面,在调整前景对象时,根据关联的背景区域确定 调整策略,避免了调整后的背景图像与前景对象出现颜色相同或相似,提高了页面的显示效 果。Therefore, the device for displaying pages provided by the embodiments of the present application can also obtain the target background image by adjusting the original background image in the target page, and then determine the brightness value of the associated background area of each foreground object in the target background image. The adjustment strategy of the foreground object, and the target object corresponding to the foreground object is generated according to the adjustment strategy. Finally, the target page is generated according to the target background image and the target object. When adjusting the foreground object, the adjustment strategy is determined according to the associated background area to avoid the adjusted The background image appears the same or similar color as the foreground object, which improves the display effect of the page.

图21为本申请一实施例提供的终端设备的结构示意图。如图21所示,该实施例的终端 设备21包括:至少一个处理器210(图21中仅示出一个)处理器、存储器211以及存储在所述存储器211中并可在所述至少一个处理器210上运行的计算机程序212,所述处理器210执行所述计算机程序212时实现上述任意各个页面显示的方法实施例中的步骤。FIG. 21 is a schematic structural diagram of a terminal device provided by an embodiment of the application. As shown in FIG. 21 , the terminal device 21 of this embodiment includes: at least one processor 210 (only one is shown in FIG. 21 ), a processor, amemory 211 , and a processor stored in thememory 211 and available for processing in the at least one processor Thecomputer program 212 running on theprocessor 210, when theprocessor 210 executes thecomputer program 212, implements the steps in any of the foregoing method embodiments for displaying various pages.

所述终端设备21可以是桌上型计算机、笔记本、掌上电脑及云端服务器等计算设备。 该终端设备可包括,但不仅限于,处理器210、存储器211。本领域技术人员可以理解,图21仅仅是终端设备21的举例,并不构成对终端设备21的限定,可以包括比图示更多或更少的部件,或者组合某些部件,或者不同的部件,例如还可以包括输入输出设备、网络接入设备等。The terminal device 21 may be a computing device such as a desktop computer, a notebook, a palmtop computer, and a cloud server. The terminal device may include, but is not limited to, theprocessor 210 and thememory 211 . Those skilled in the art can understand that FIG. 21 is only an example of the terminal device 21, and does not constitute a limitation on the terminal device 21. It may include more or less components than the one shown, or combine some components, or different components , for example, may also include input and output devices, network access devices, and the like.

所称处理器210可以是中央处理单元(Central Processing Unit,CPU),该处理器210还可 以是其他通用处理器、数字信号处理器(Digital Signal Processor,DSP)、专用集成电路 (Application Specific Integrated Circuit,ASIC)、现成可编程门阵列(Field-Programmable Gate Array,FPGA)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件等。 通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等。The so-calledprocessor 210 may be a central processing unit (Central Processing Unit, CPU), and theprocessor 210 may also be other general-purpose processors, digital signal processors (Digital Signal Processors, DSP), application specific integrated circuits (Application Specific Integrated Circuits) , ASIC), off-the-shelf programmable gate array (Field-Programmable Gate Array, FPGA) or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. A general purpose processor may be a microprocessor or the processor may be any conventional processor or the like.

所述存储器211在一些实施例中可以是所述终端设备21的内部存储单元,例如终端设 备21的硬盘或内存。所述存储器211在另一些实施例中也可以是所述终端设备21的外部存 储设备,例如所述终端设备21上配备的插接式硬盘,智能存储卡(Smart Media Card,SMC), 安全数字(Secure Digital,SD)卡,闪存卡(Flash Card)等。进一步地,所述存储器211还 可以既包括所述终端设备21的内部存储单元也包括外部存储设备。所述存储器211用于存 储操作系统、应用程序、引导装载程序(BootLoader)、数据以及其他程序等,例如所述计算 机程序的程序代码等。所述存储器211还可以用于暂时地存储已经输出或者将要输出的数据。Thememory 211 may be an internal storage unit of the terminal device 21 in some embodiments, such as a hard disk or a memory of the terminal device 21. In other embodiments, thememory 211 may also be an external storage device of the terminal device 21, such as a plug-in hard disk equipped on the terminal device 21, a smart memory card (Smart Media Card, SMC), a secure digital (Secure Digital, SD) card, flash memory card (Flash Card), etc. Further, thememory 211 may also include both an internal storage unit of the terminal device 21 and an external storage device. Thememory 211 is used to store an operating system, an application program, a boot loader (BootLoader), data, and other programs, such as program codes of the computer program, and the like. Thememory 211 may also be used to temporarily store data that has been output or will be output.

需要说明的是,上述装置/单元之间的信息交互、执行过程等内容,由于与本申请方法 实施例基于同一构思,其具体功能及带来的技术效果,具体可参见方法实施例部分,此处不 再赘述。It should be noted that the information exchange, execution process and other contents between the above-mentioned devices/units are based on the same concept as the method embodiments of the present application. For specific functions and technical effects, please refer to the method embodiments section. It is not repeated here.

所属领域的技术人员可以清楚地了解到,为了描述的方便和简洁,仅以上述各功能单元、 模块的划分进行举例说明,实际应用中,可以根据需要而将上述功能分配由不同的功能单元、 模块完成,即将所述装置的内部结构划分成不同的功能单元或模块,以完成以上描述的全部 或者部分功能。实施例中的各功能单元、模块可以集成在一个处理单元中,也可以是各个单 元单独物理存在,也可以两个或两个以上单元集成在一个单元中,上述集成的单元既可以采 用硬件的形式实现,也可以采用软件功能单元的形式实现。另外,各功能单元、模块的具体 名称也只是为了便于相互区分,并不用于限制本申请的保护范围。上述系统中单元、模块的 具体工作过程,可以参考前述方法实施例中的对应过程,在此不再赘述。Those skilled in the art can clearly understand that, for the convenience and brevity of description, only the division of the above-mentioned functional units and modules is used as an example for illustration. In practical applications, the above-mentioned functions can be allocated by different functional units, Module completion, that is, dividing the internal structure of the device into different functional units or modules to complete all or part of the functions described above. Each functional unit and module in the embodiment may be integrated in one processing unit, or each unit may exist physically alone, or two or more units may be integrated in one unit, and the above-mentioned integrated units may adopt hardware. It can also be realized in the form of software functional units. In addition, the specific names of each functional unit and module are only for the convenience of distinguishing from each other, and are not used to limit the protection scope of the present application. For the specific working processes of the units and modules in the above system, reference may be made to the corresponding processes in the foregoing method embodiments, and details are not described herein again.

本申请实施例还提供了一种网络设备,该网络设备包括:至少一个处理器、存储器以及 存储在所述存储器中并可在所述至少一个处理器上运行的计算机程序,所述处理器执行所述 计算机程序时实现上述任意各个方法实施例中的步骤。An embodiment of the present application also provides a network device, the network device includes: at least one processor, a memory, and a computer program stored in the memory and executable on the at least one processor, the processor executing The computer program implements the steps in any of the foregoing method embodiments.

本申请实施例还提供了一种计算机可读存储介质,所述计算机可读存储介质存储有计算 机程序,所述计算机程序被处理器执行时实现可实现上述各个方法实施例中的步骤。Embodiments of the present application further provide a computer-readable storage medium, where a computer program is stored in the computer-readable storage medium, and when the computer program is executed by a processor, the steps in the foregoing method embodiments can be implemented.

本申请实施例提供了一种计算机程序产品,当计算机程序产品在移动终端上运行时,使 得移动终端执行时实现可实现上述各个方法实施例中的步骤。The embodiments of the present application provide a computer program product, when the computer program product runs on a mobile terminal, the steps in the above method embodiments can be implemented when the mobile terminal is executed.

所述集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时,可以 存储在一个计算机可读取存储介质中。基于这样的理解,本申请实现上述实施例方法中的全 部或部分流程,可以通过计算机程序来指令相关的硬件来完成,所述的计算机程序可存储于 一计算机可读存储介质中,该计算机程序在被处理器执行时,可实现上述各个方法实施例的 步骤。其中,所述计算机程序包括计算机程序代码,所述计算机程序代码可以为源代码形式、 对象代码形式、可执行文件或某些中间形式等。所述计算机可读介质至少可以包括:能够将 计算机程序代码携带到拍照装置/终端设备的任何实体或装置、记录介质、计算机存储器、 只读存储器(ROM,Read-Only Memory)、随机存取存储器(RAM,Random Access Memory)、 电载波信号、电信信号以及软件分发介质。例如U盘、移动硬盘、磁碟或者光盘等。在某些 司法管辖区,根据立法和专利实践,计算机可读介质不可以是电载波信号和电信信号。The integrated unit, if implemented in the form of a software functional unit and sold or used as a stand-alone product, may be stored in a computer-readable storage medium. Based on this understanding, the present application realizes all or part of the processes in the methods of the above embodiments, which can be completed by instructing the relevant hardware through a computer program, and the computer program can be stored in a computer-readable storage medium. When executed by a processor, the steps of each of the above method embodiments can be implemented. Wherein, the computer program includes computer program code, and the computer program code may be in the form of source code, object code, executable file or some intermediate form, and the like. The computer-readable medium may include at least: any entity or device capable of carrying the computer program code to the photographing device/terminal device, recording medium, computer memory, read-only memory (ROM, Read-Only Memory), random access memory (RAM, Random Access Memory), electrical carrier signal, telecommunication signal, and software distribution medium. For example, U disk, mobile hard disk, disk or CD, etc. In some jurisdictions, under legislation and patent practice, computer readable media may not be electrical carrier signals and telecommunications signals.

在上述实施例中,对各个实施例的描述都各有侧重,某个实施例中没有详述或记载的部 分,可以参见其它实施例的相关描述。In the above-mentioned embodiments, the description of each embodiment has its own emphasis. For the parts that are not described or recorded in detail in a certain embodiment, reference may be made to the relevant descriptions of other embodiments.

本领域普通技术人员可以意识到,结合本文中所公开的实施例描述的各示例的单元及算 法步骤,能够以电子硬件、或者计算机软件和电子硬件的结合来实现。这些功能究竟以硬件 还是软件方式来执行,取决于技术方案的特定应用和设计约束条件。专业技术人员可以对每 个特定的应用来使用不同方法来实现所描述的功能,但是这种实现不应认为超出本申请的范 围。Those of ordinary skill in the art can realize that the units and algorithm steps of each example described in conjunction with the embodiments disclosed herein can be implemented by electronic hardware, or a combination of computer software and electronic hardware. Whether these functions are performed in hardware or software depends on the specific application and design constraints of the technical solution. Skilled artisans may implement the described functionality using different methods for each particular application, but such implementations should not be considered beyond the scope of this application.

在本申请所提供的实施例中,应该理解到,所揭露的装置/网络设备和方法,可以通过 其它的方式实现。例如,以上所描述的装置/网络设备实施例仅仅是示意性的,例如,所述 模块或单元的划分,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式,例如多 个单元或组件可以结合或者可以集成到另一个系统,或一些特征可以忽略,或不执行。另一 点,所显示或讨论的相互之间的耦合或直接耦合或通讯连接可以是通过一些接口,装置或单 元的间接耦合或通讯连接,可以是电性,机械或其它的形式。In the embodiments provided in this application, it should be understood that the disclosed apparatus/network device and method may be implemented in other manners. For example, the apparatus/network device embodiments described above are only illustrative. For example, the division of the modules or units is only a logical function division. In actual implementation, there may be other division methods, such as multiple units. Or components may be combined or may be integrated into another system, or some features may be omitted, or not implemented. On the other hand, the shown or discussed mutual coupling or direct coupling or communication connection may be through some interfaces, indirect coupling or communication connection of devices or units, and may be in electrical, mechanical or other forms.

所述作为分离部件说明的单元可以是或者也可以不是物理上分开的,作为单元显示的部 件可以是或者也可以不是物理单元,即可以位于一个地方,或者也可以分布到多个网络单元 上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。The units described as separate components may or may not be physically separated, and components shown as units may or may not be physical units, that is, may be located in one place, or may be distributed to multiple network units. Some or all of the units may be selected according to actual needs to achieve the purpose of the solution in this embodiment.

以上所述实施例仅用以说明本申请的技术方案,而非对其限制;尽管参照前述实施例对 本申请进行了详细的说明,本领域的普通技术人员应当理解:其依然可以对前述各实施例所 记载的技术方案进行修改,或者对其中部分技术特征进行等同替换;而这些修改或者替换, 并不使相应技术方案的本质脱离本申请各实施例技术方案的精神和范围,均应包含在本申请 的保护范围之内。The above-mentioned embodiments are only used to illustrate the technical solutions of the present application, but not to limit them; although the present application has been described in detail with reference to the above-mentioned embodiments, those of ordinary skill in the art should understand that: it can still be used for the above-mentioned implementations. The technical solutions described in the examples are modified, or some technical features thereof are equivalently replaced; and these modifications or replacements do not make the essence of the corresponding technical solutions deviate from the spirit and scope of the technical solutions of the embodiments of the application, and should be included in the within the scope of protection of this application.

Claims (11)

Translated fromChinese
1.一种页面显示的方法,其特征在于,包括:1. a method for page display, characterized in that, comprising:将目标页面内的原始背景图像,调整为与当前的显示模式对应的目标背景图像;Adjust the original background image in the target page to the target background image corresponding to the current display mode;识别所述目标页面内各个前景对象在所述目标背景图像内的关联背景区域;Identifying the associated background area of each foreground object in the target page in the target background image;根据所述关联背景区域的背景像素值,将所述前景对象调整为与所述显示模式对应的目标对象;adjusting the foreground object to a target object corresponding to the display mode according to the background pixel value of the associated background area;根据所有所述目标对象以及所述目标背景图像,生成所述目标页面。The target page is generated according to all the target objects and the target background image.2.根据权利要求1所述的方法,其特征在于,所述识别所述目标页面内各个前景对象在所述目标背景图像内的关联背景区域,包括:2. The method according to claim 1, wherein the identifying the associated background area of each foreground object in the target page in the target background image comprises:将所述目标背景图像划分为多个候选背景区域;dividing the target background image into multiple candidate background regions;根据所述前景对象的中心坐标以及所述目标背景图像的边界坐标,从所述候选背景区域中选取与所述前景对象对应的所述关联背景区域。According to the center coordinates of the foreground object and the boundary coordinates of the target background image, the associated background region corresponding to the foreground object is selected from the candidate background regions.3.根据权利要求2所述的方法,其特征在于,所述将所述目标背景图像划分为多个候选背景区域,包括:3. The method according to claim 2, wherein the dividing the target background image into multiple candidate background regions comprises:获取最小前景尺寸,将所述最小前景尺寸作为分块尺寸;Obtain the minimum foreground size, and use the minimum foreground size as the block size;基于所述分块尺寸对所述目标背景图像进行划分,得到多个所述候选背景区域。The target background image is divided based on the block size to obtain a plurality of the candidate background regions.4.根据权利要求2所述的方法,所述根据所述前景对象的中心坐标以及所述目标背景图像的边界坐标,从所述候选背景区域中选取与所述前景对象对应的所述关联背景区域,包括:4. The method according to claim 2, wherein the associated background corresponding to the foreground object is selected from the candidate background region according to the center coordinates of the foreground object and the boundary coordinates of the target background image area, including:根据各个候选背景区域的在所述目标背景图像的显示位置,为各个候选背景区域配置关联的基准行列号;According to the display position of each candidate background area in the target background image, configure an associated reference row and column number for each candidate background area;
Figure FDA0002378659880000021
Figure FDA0002378659880000021
其中,Colunm0为所述候选背景区域的基准列序号;Row0为所述所述候选背景区域的基准行序号;(SrcX0,SrcY0)为所述候选背景图像的边界坐标;(pX,pY)为所述候选背景区域的中心坐标;(Sizex,Sizey)为所述候选背景区域的区域尺寸;Wherein, Colunm0 is the reference column sequence number of the candidate background region; Row0 is the reference row sequence number of the candidate background region; (SrcX0 , SrcY0 ) are the boundary coordinates of the candidate background image; (pX, pY) is the center coordinate of the candidate background area; (Sizex , Sizey ) is the area size of the candidate background area;将所述前景对象中心坐标导入预设的行列转换模型,计算所述前景对象的目标行列号;所述行列转换模型具体为:The center coordinates of the foreground object are imported into a preset row-column conversion model, and the target row-column number of the foreground object is calculated; the row-column conversion model is specifically:
Figure FDA0002378659880000022
Figure FDA0002378659880000022
其中,Colunm1为所述目标行列号内的列序号;Row1为所述目标行列号内的行序号;(SrcX1,SrcY1)为所述前景对象的中心坐标;(Sizex,Sizey)为所述候选背景区域的区域尺寸;(Targetx,Targety)为所述前景对象的对象尺寸;Wherein, Colunm1 is the column number in the target row and column number; Row1 is the row number in the target row and column number; (SrcX1 , SrcY1 ) is the center coordinate of the foreground object; (Sizex , Sizey ) is the area size of the candidate background area; (Targetx , Targety ) is the object size of the foreground object;选取所述基准行列号与所述目标行列号匹配的所述候选背景区域作为所述前景对象的关联背景区域。The candidate background area whose reference row and column number matches the target row and column number is selected as the associated background area of the foreground object.5.根据权利要求1所述的方法,其特征在于,所述显示模式为深色显示模式,则所述根据所述关联背景区域的背景像素值,将所述前景对象调整为与所述显示模式对应的目标对象,包括:5 . The method according to claim 1 , wherein, if the display mode is a dark display mode, the foreground object is adjusted to be consistent with the display according to the background pixel value of the associated background area. 6 . The target object corresponding to the mode, including:获取关联背景区域的中心坐标的像素值以及透明度;Get the pixel value and transparency of the center coordinate of the associated background area;根据所述中心坐标的所述像素值以及所述透明度,确定所述关联背景区域的背景亮度值;Determine the background brightness value of the associated background area according to the pixel value of the center coordinate and the transparency;若所述背景亮度值大于预设的亮度阈值,则对所述前景对象进行降低亮度处理,生成所述目标对象;If the background brightness value is greater than a preset brightness threshold, reducing the brightness of the foreground object to generate the target object;若所述背景亮度值小于或等于所述亮度阈值,则对所述前景对象进行反色处理,生成所述目标对象。If the background brightness value is less than or equal to the brightness threshold value, perform color inversion processing on the foreground object to generate the target object.6.根据权利要求5述的方法,其特征在于,在所述根据所述中心坐标的所述像素值以及所述透明度,确定所述关联背景区域的亮度值之后,还包括:6 . The method according to claim 5 , wherein after determining the brightness value of the associated background region according to the pixel value of the center coordinate and the transparency, the method further comprises: 6 .根据所述前景对象内各个像素点的所述像素值,确定所述前景对象对应的特征亮度值;According to the pixel value of each pixel in the foreground object, determine the characteristic brightness value corresponding to the foreground object;若所述背景亮度值与所述特征亮度值之间的亮度差值大于预设的反色阈值,则对所述前景对象进行降低亮度处理,生成所述目标对象;If the brightness difference between the background brightness value and the feature brightness value is greater than a preset inverse color threshold, reducing the brightness of the foreground object to generate the target object;若所述亮度差值小于或等于所述反色阈值,则对所述前景对象进行反色处理,生成所述目标对象。If the luminance difference value is less than or equal to the inverse color threshold, inverse color processing is performed on the foreground object to generate the target object.7.根据权利要求1-6任一所述的方法,其特征在于,所述识别所述目标页面内各个前景对象在所述目标背景图像内的关联背景区域,包括:7. The method according to any one of claims 1-6, wherein the identifying the associated background area of each foreground object in the target page in the target background image comprises:确定所述前景对象在所述目标页面内的显示层级;determining the display level of the foreground object in the target page;在所述目标页面内选取与所述显示层级相邻层级的目标背景图像作为所述前景对象的关联背景图像;Selecting a target background image at a level adjacent to the display level in the target page as the associated background image of the foreground object;确定所述前景对象在所述关联背景图像内的关联背景区域。An associated background region of the foreground object within the associated background image is determined.8.根据权利要求1-6任一所述的方法,其特征在于,所述根据所述关联背景区域的背景像素值,将所述前景对象调整为与所述显示模式对应的目标对象,包括:8. The method according to any one of claims 1-6, wherein the adjusting the foreground object to be a target object corresponding to the display mode according to the background pixel value of the associated background area, comprising: :根据所述关联背景区域的背景像素值以及所述前景对象的像素值,生成所述前景对象对应的预览对象;generating a preview object corresponding to the foreground object according to the background pixel value of the associated background area and the pixel value of the foreground object;根据所述预览对象对应的所有关联对象的像素值以及所述预览对象的像素值,生成所述前景对象对应的所述目标对象。The target object corresponding to the foreground object is generated according to pixel values of all associated objects corresponding to the preview object and pixel values of the preview object.9.一种页面显示的装置,其特征在于,包括:9. A device for displaying pages, comprising:背景图像调整单元,用于将目标页面内的原始背景图像,调整为与当前的显示模式对应的目标背景图像;The background image adjustment unit is used to adjust the original background image in the target page to the target background image corresponding to the current display mode;关联背景区域识别单元,用于识别所述目标页面内各个前景对象在所述目标背景图像内的关联背景区域;an associated background area identification unit, used to identify the associated background area of each foreground object in the target page in the target background image;前景对象调整单元,用于根据所述关联背景区域的背景像素值,将所述前景对象调整为与所述显示模式对应的目标对象;a foreground object adjustment unit, configured to adjust the foreground object to a target object corresponding to the display mode according to the background pixel value of the associated background area;目标页面生成单元,用于根据所有所述目标对象以及所述目标背景图像,生成所述目标页面。A target page generating unit, configured to generate the target page according to all the target objects and the target background image.10.一种终端设备,包括存储器、处理器以及存储在所述存储器中并可在所述处理器上运行的计算机程序,其特征在于,所述处理器执行所述计算机程序时实现如权利要求1至8任一项所述的方法。10. A terminal device, comprising a memory, a processor, and a computer program stored in the memory and running on the processor, characterized in that, when the processor executes the computer program, the implementation as claimed in the claims The method of any one of 1 to 8.11.一种计算机可读存储介质,所述计算机可读存储介质存储有计算机程序,其特征在于,所述计算机程序被处理器执行时实现如权利要求1至8任一项所述的方法。11. A computer-readable storage medium storing a computer program, wherein when the computer program is executed by a processor, the method according to any one of claims 1 to 8 is implemented.
CN202010076679.8A2020-01-232020-01-23 A method, device, terminal and storage medium for page displayActiveCN113157357B (en)

Priority Applications (1)

Application NumberPriority DateFiling DateTitle
CN202010076679.8ACN113157357B (en)2020-01-232020-01-23 A method, device, terminal and storage medium for page display

Applications Claiming Priority (1)

Application NumberPriority DateFiling DateTitle
CN202010076679.8ACN113157357B (en)2020-01-232020-01-23 A method, device, terminal and storage medium for page display

Publications (2)

Publication NumberPublication Date
CN113157357Atrue CN113157357A (en)2021-07-23
CN113157357B CN113157357B (en)2024-10-11

Family

ID=76881965

Family Applications (1)

Application NumberTitlePriority DateFiling Date
CN202010076679.8AActiveCN113157357B (en)2020-01-232020-01-23 A method, device, terminal and storage medium for page display

Country Status (1)

CountryLink
CN (1)CN113157357B (en)

Cited By (5)

* Cited by examiner, † Cited by third party
Publication numberPriority datePublication dateAssigneeTitle
CN113486216A (en)*2021-07-272021-10-08中国银行股份有限公司Page merging method, device, server, medium and product
CN113781959A (en)*2021-09-232021-12-10Oppo广东移动通信有限公司 Interface processing method and device
CN114138394A (en)*2021-12-062022-03-04北京得间科技有限公司Night display mode processing method, electronic device and computer storage medium
CN115294363A (en)*2022-08-192022-11-04腾讯科技(深圳)有限公司Picture processing method, related device, equipment and storage medium
CN116466952A (en)*2023-06-192023-07-21成都赛力斯科技有限公司Control visual effect element adjusting method and device, electronic equipment and storage medium

Citations (9)

* Cited by examiner, † Cited by third party
Publication numberPriority datePublication dateAssigneeTitle
CN102591848A (en)*2010-11-222012-07-18微软公司Selection of foreground characteristics based on background
CN105005461A (en)*2015-06-232015-10-28深圳市金立通信设备有限公司Icon display method and terminal
CN105677349A (en)*2016-01-052016-06-15努比亚技术有限公司Desktop icon display method and device
CN105809645A (en)*2016-03-282016-07-27努比亚技术有限公司Word display method and device and mobile terminal
CN106126214A (en)*2016-06-172016-11-16青岛海信移动通信技术股份有限公司The determination method and device of text color on a kind of interface
CN106851003A (en)*2017-02-272017-06-13努比亚技术有限公司The method and device of text color is adjusted according to wallpaper color
CN107291334A (en)*2017-06-272017-10-24努比亚技术有限公司A kind of icon font color determines method and apparatus
US9992450B1 (en)*2017-03-242018-06-05Apple Inc.Systems and methods for background concealment in video conferencing session
CN110609722A (en)*2019-08-092019-12-24华为技术有限公司 A kind of dark mode display interface processing method, electronic device and storage medium

Patent Citations (9)

* Cited by examiner, † Cited by third party
Publication numberPriority datePublication dateAssigneeTitle
CN102591848A (en)*2010-11-222012-07-18微软公司Selection of foreground characteristics based on background
CN105005461A (en)*2015-06-232015-10-28深圳市金立通信设备有限公司Icon display method and terminal
CN105677349A (en)*2016-01-052016-06-15努比亚技术有限公司Desktop icon display method and device
CN105809645A (en)*2016-03-282016-07-27努比亚技术有限公司Word display method and device and mobile terminal
CN106126214A (en)*2016-06-172016-11-16青岛海信移动通信技术股份有限公司The determination method and device of text color on a kind of interface
CN106851003A (en)*2017-02-272017-06-13努比亚技术有限公司The method and device of text color is adjusted according to wallpaper color
US9992450B1 (en)*2017-03-242018-06-05Apple Inc.Systems and methods for background concealment in video conferencing session
CN107291334A (en)*2017-06-272017-10-24努比亚技术有限公司A kind of icon font color determines method and apparatus
CN110609722A (en)*2019-08-092019-12-24华为技术有限公司 A kind of dark mode display interface processing method, electronic device and storage medium

Cited By (7)

* Cited by examiner, † Cited by third party
Publication numberPriority datePublication dateAssigneeTitle
CN113486216A (en)*2021-07-272021-10-08中国银行股份有限公司Page merging method, device, server, medium and product
CN113486216B (en)*2021-07-272024-02-09中国银行股份有限公司Page merging method, device, server, medium and product
CN113781959A (en)*2021-09-232021-12-10Oppo广东移动通信有限公司 Interface processing method and device
CN114138394A (en)*2021-12-062022-03-04北京得间科技有限公司Night display mode processing method, electronic device and computer storage medium
CN115294363A (en)*2022-08-192022-11-04腾讯科技(深圳)有限公司Picture processing method, related device, equipment and storage medium
CN116466952A (en)*2023-06-192023-07-21成都赛力斯科技有限公司Control visual effect element adjusting method and device, electronic equipment and storage medium
CN116466952B (en)*2023-06-192023-09-01成都赛力斯科技有限公司Control visual effect element adjusting method and device, electronic equipment and storage medium

Also Published As

Publication numberPublication date
CN113157357B (en)2024-10-11

Similar Documents

PublicationPublication DateTitle
CN113157357B (en) A method, device, terminal and storage medium for page display
CN113132704B (en)Image processing method, device, terminal and storage medium
CN109191549B (en)Method and device for displaying animation
CN108363569B (en)Image frame generation method, device, equipment and storage medium in application
CN110795007B (en)Method and device for acquiring screenshot information
CN108959361B (en)Form management method and device
CN114003321B (en)Display method and electronic equipment
CN113837920B (en) Image rendering method and electronic device
CN111275607A (en)Interface display method and device, computer equipment and storage medium
CN114816200A (en) A display method and electronic device
WO2023005751A1 (en)Rendering method and electronic device
CN115661912A (en) Image processing method, model training method, electronic device and readable storage medium
CN108492339B (en)Method and device for acquiring resource compression packet, electronic equipment and storage medium
CN114866641A (en)Icon processing method, terminal equipment and storage medium
CN111031377B (en)Mobile terminal and video production method
CN111479075B (en)Photographing terminal and image processing method thereof
WO2024244934A1 (en)Advertisement generation method, and electronic device, network device and computer storage medium
CN113038141A (en)Video frame processing method and electronic equipment
CN116700655B (en) Interface display method and electronic device
CN114968009B (en) Display mode switching method, device, electronic device and medium
CN116055627A (en) A screen off control method, electronic device and storage medium
CN117348953A (en)Display method and related device
CN115499577A (en) An image processing method and terminal equipment
CN116704928A (en) Display adjustment method and electronic device
CN114257755A (en) Image processing method, device, device and storage medium

Legal Events

DateCodeTitleDescription
PB01Publication
PB01Publication
SE01Entry into force of request for substantive examination
SE01Entry into force of request for substantive examination
GR01Patent grant
GR01Patent grant

[8]ページ先頭

©2009-2025 Movatter.jp