CN105808613A - 页面背景图片的处理方法及装置 - Google Patents

Abstract

本发明公开了页面背景图片的处理方法及装置，所述方法包括：由正常光源模式转换至弱光源模式后，根据页面在弱光源模式下的背景色以及正常光源模式下的背景色计算转换滤镜参数；根据所述转换滤镜参数对所述页面在正常光源模式下的背景图片进行处理，以得到所述页面在弱光源模式下的背景图片。本发明的方法在浏览器转换光源模式时，使页面的背景色和背景图片经过同样的处理，因此可以保证转换光源模式后的页面中的背景色和背景图片能够达到转换前的融合过度效果，避免了在弱光源下背景图片和背景色不搭配而使网页的视觉效果变差，以及由此引起的用户浏览体验降低的问题。

Description

页面背景图片的处理方法及装置

技术领域

本发明涉及计算机技术领域，特别是涉及页面背景图片的处理方法及装置。

背景技术

随着互联网技术的飞速发展，浏览器已不仅仅满足人们获取信息的需求，而是进一步优化和增加了一些更加人性化的功能。例如为了适应在弱光源环境下用户的浏览需求，在浏览器中增加了“夜间浏览模式”，在这种浏览模式下，通过将网页的背景亮度调暗，来避免终端屏幕的光线过于刺眼，以保护用户的视力。

在互联网上很多网页都采用多重背景样式，即由背景图片与背景色组合以形成页面的整体背景效果。在设计网页背景时，一般基于正常光源模式，即日间浏览模式对背景色和背景图片进行调配，以使网页呈现出较为美观的视觉效果。例如，在背景图片与背景色相结合的边缘区域，将这一区域的背景图片颜色调配成与背景色较为接近的颜色，以实现自然的融合过渡效果。当浏览器切换至“夜间浏览模式”时，需要对网页背景进行亮度调整，现有的方法大多是对背景图片和背景色分别进行处理。对于背景色，一般是将其转换到比较暗的色彩区间，而对于背景图片，则采用叠加灰度滤镜的方法，以降低其亮度。

然而这种对背景图片和背景色分别进行处理的方法，处理的效果虽然能将亮度降下来，却没有考虑到处理后的背景图片和背景色的融合效果，导致在弱光源环境下的页面背景由于背景图片和背景色不搭配而使视觉效果变差，降低用户的浏览体验。

发明内容

本发明实施例提供了页面背景图片的处理方法及装置，以解决现有技术中的在弱光源环境下的页面背景由于背景图片和背景色不搭配而使视觉效果变差，用户浏览体验差的问题。

为了解决上述技术问题，本发明实施例公开了如下技术方案：

一方面，提供了一种页面背景图片的处理方法，所述方法包括：

由正常光源模式转换至弱光源模式后，根据页面在弱光源模式下的背景色以及正常光源模式下的背景色计算转换滤镜参数；

根据所述转换滤镜参数对所述页面在正常光源模式下的背景图片进行处理，以得到所述页面在弱光源模式下的背景图片。

可选的，所述转换滤镜参数包括灰度参数与偏色参数，所述根据所述转换滤镜参数对所述页面在正常光源模式下的背景图片进行处理包括：

根据所述灰度参数降低所述页面在正常光源模式下的背景图片的像素值；

根据所述偏色参数对降低像素值后的背景图片进行调整，以获得所述页面在弱光源模式下的背景图片的像素值。

可选的，所述根据所述灰度参数降低所述页面在正常光源模式下的背景图片的像素值包括：

计算所述灰度参数与基准色像素值的比值，获得第一比例值；

将所述页面在正常光源模式下的背景图片的像素值乘以所述第一比例值，以降低所述页面在正常光源模式下的背景图片的像素值。

可选的，所述根据页面在弱光源模式下的背景色以及正常光源模式下的背景色计算切换滤镜参数包括：

获得所述页面在正常光源模式下的背景色的像素值C1和所述页面在弱光源模式下的背景色的像素值C2；

当C2>C1，或者C1＝0时，所述灰度参数即为所述基准色像素值，所述偏色参数为C2-C1，否则

所述灰度参数为C2与C1的比值与所述基准色像素值的乘积，所述偏色参数为0。

可选的，所述方法还包括：

根据预设的转换规则将所述正常光源模式下的背景色进行转换之后获得所述弱光源模式下的背景色。

另一方面，提供了一种页面背景图片的处理装置，所述装置包括：

计算单元，用于由正常光源模式转换至弱光源模式后，根据页面在弱光源模式下的背景色以及正常光源模式下的背景色计算转换滤镜参数；

处理单元，用于根据所述计算单元计算的所述转换滤镜参数对所述页面在正常光源模式下的背景图片进行处理，以得到所述页面在弱光源模式下的背景图片。

可选的，所述处理单元包括：

第一调整子单元，用于根据所述转换滤镜参数中包含的灰度参数降低所述页面在弱光源模式下的背景图片的像素值；

第二调整子单元，用于根据所述转换滤镜参数中包含的偏色参数对降低像素值后的背景图片进行调整，以获得所述页面在弱光源模式下的背景图片的像素值。

可选的，所述第一调整子单元包括：

第一计算子单元，用于计算所述灰度参数与基准色像素的比值，获得第一比例值；

第二计算子单元，用于将所述页面在弱光源模式下的背景图片的像素值乘以所述第一比值，以降低所述页面在弱光源模式下的背景图片的像素值。

可选的，所述计算单元包括：

获得子单元，用于获得所述网页在弱光源模式下的背景色的像素值C2和正常光源模式下的背景色的像素值C1；

第三计算子单元，用根据如下规则计算所述灰度参数和所述偏色参数：

当C2>C1，或者C1＝0时，所述灰度参数即为所述基准色像素值，所述偏色参数为C2-C1，否则

所述灰度参数为C2与C1的比值与所述基准色像素值的乘积，所述偏色参数为0。

可选的，所述装置还包括：转换单元，用于根据预设的转换规则将所述正常光源模式下的背景色进行转换以获得所述弱光源模式下的背景色。

本发明的页面背景图片的处理方法及装置，在浏览器转换光源模式时，使页面的背景色和背景图片经过同样的处理，因此可以保证转换光源模式后的页面中的背景色和背景图片能够达到转换前的融合过度效果，避免了在弱光源下背景图片和背景色不搭配而使网页的视觉效果变差，以及由此引起的用户浏览体验降低的问题。

附图说明

为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，对于本领域普通技术人员而言，在不付出创造性劳动性的前提下，还可以根据这些附图获得其他的附图。

图1为本发明一个实施例提供的页面背景图片的处理方法的流程示意图；

图2为本发明另一个实施例提供的页面背景图片的处理方法的流程示意图；

图3为本发明一个实施例提供的页面背景图片的处理装置的结构示意图；

图4为本发明另一个实施例提供的页面背景图片的处理装置的结构示意图。

具体实施方式

首先对本发明页面背景图片的处理方法的实施例进行说明，参见图1，为本发明一个实施例提供的页面背景图片的处理方法的流程示意图，所述方法包括如下步骤：

步骤101：由正常光源模式转换至弱光源模式后，根据页面在弱光源模式下的背景色以及正常光源模式下的背景色计算转换滤镜参数。

可以这样理解：根据所述转换滤镜参数对正常光源模式下的背景色进行处理，即可得到弱光源模式下的背景色。由于各个浏览器对于弱光源下的背景色的处理方法可能不一样，因此可能无法直接从浏览器中获取该处理方法。在这里我们采用反向推算的方法，根据转换后的背景色和转换前的背景色，即可计算出来该转换滤镜参数。

步骤102：根据所述转换滤镜参数对所述页面在正常光源模式下的背景图片进行处理，以得到所述页面在弱光源模式下的背景图片。

本实施例的技术方案在浏览器转换光源模式时，使页面的背景色和背景图片经过同样的处理，因此可以保证转换光源模式后的页面中的背景色和背景图片能够达到转换前的融合过度效果，避免了在弱光源下背景图片和背景色不搭配而使网页的视觉效果变差，以及由此引起的用户浏览体验降低的问题。

参见图2，为本发明另一个实施例提供的页面背景图片的处理方法的流程示意图，所述方法包括如下步骤：

步骤201：根据页面在弱光源模式下的背景色以及正常光源模式下的背景色计算转换滤镜参数中的灰度参数。

所述转换滤镜参数包括灰度参数与偏色参数，所述灰度参数，用来降低亮度，所述偏色参数，用来调整色差。

步骤202：根据页面在弱光源模式下的背景色以及正常光源模式下的背景色计算转换滤镜参数中的偏色参数。

优选的，步骤201和步骤201可具体采用如下计算方法：

获得所述页面在正常光源模式下的背景色的像素值C1和所述页面在弱光源模式下的背景色的像素值C2。

当C2>C1，或者C1＝0时，所述灰度参数即为所述基准色像素值，所述偏色参数为C2-C1，否则

所述灰度参数为C2与C1的比值与所述基准色像素值的乘积，所述偏色参数为0。

步骤203：根据所述灰度参数降低所述页面在正常光源模式下的背景图片的像素值。

优选的，所述步骤203可包括如下子步骤2031和2032。

步骤2031：计算所述灰度参数与基准色像素值的比值，获得第一比例值。

步骤2032：将所述页面在正常光源模式下的背景图片的像素值乘以所述第一比例值，以降低所述页面在正常光源模式下的背景图片的像素值。

步骤204：根据所述偏色参数对降低像素值后的背景图片进行调整，以获得所述页面在弱光源模式下的背景图片的像素值。

优选的，可以在所述降低像素值后的背景图片的像素值上叠加所述偏色参数，以调整所述背景图片的像素值。

下面以实际应用中基于RGB色彩模型的网页背景为例来介绍上述转换滤镜参数的计算方法及对背景图片的处理方法。

在RGB色彩模型中，R表示红色的像素值，G表示绿色的像素值，B表示蓝色的像素值，三个色彩的像素取值范围均为0至0XFF。假设C1_R、C1_G、C1_B分别为转换前即正常光源下的背景色的R、G、B值，C2_R、C2_G、C2_B分别为转换后即弱光源下的背景色的R、G、B值，所述转换滤镜的灰度参数包括三部分:M_R、M_G、M_B，偏度参数也包括三部分：A_R、A_G、A_B，则其计算方法采用如下公式：

$M_R=\left\{\begin{array}{cc}0\mathrm{xFF},& \mathrm{if}({C2}_R>{C1}_R)\left|\right|({C1}_R=0)\\ 0\mathrm{xFF}*{C2}_R/{C1}_R,& \mathrm{otherwise}\end{array}\right.$

$A_R=\left\{\begin{array}{cc}{C2}_R-{C1}_R,& \mathrm{if}({C2}_R>{C1}_R)\left|\right|({C1}_R=0)\\ 0,& \mathrm{otherwise}\end{array}\right.$

$M_G=\left\{\begin{array}{cc}0\mathrm{xFF},& \mathrm{if}({C2}_G>{C1}_G)\left|\right|({C1}_G=0)\\ 0\mathrm{xFF}*{C2}_G/{C1}_G,& \mathrm{otherwise}\end{array}\right.$

$A_G=\left\{\begin{array}{cc}{C2}_G-{C1}_G,& \mathrm{if}({C2}_G>{C1}_G)\left|\right|({C1}_G=0)\\ 0,& \mathrm{otherwise}\end{array}\right.$

$M_B=\left\{\begin{array}{cc}0\mathrm{xFF},& \mathrm{if}({C2}_B>{C1}_B)\left|\right|({C1}_B=0)\\ 0\mathrm{xFF}*{C2}_B/{C1}_B,& \mathrm{otherwise}\end{array}\right.$

$A_B=\left\{\begin{array}{cc}{C2}_B-{C1}_B,& \mathrm{if}({C2}_B>{C1}_B)\left|\right|({C1}_B=0)\\ 0,& \mathrm{otherwise}\end{array}\right.$

假设P1_R、P1_G、P1_B分别为正常光源模式下的背景图片的像素的R、G、B值，P2_R、P2_G、P2_B分别经过上述滤镜参数处理后，即得到的弱光源模式下的背景图片的像素的R、G、B值，根据如下公式计算所述P2_R、P2_G、P2_B的值：

P2_R＝P1_R*M_R/0xFF+A_R

P2_G＝P1_G*M_G/0xFF+A_G

P2_B＝P1_B*M_B/0xFF+A_B

可选的，在上述实施例及本发明的其他实施例中，根据预设的转换规则将所述正常光源模式下的背景色进行转换之后获得所述弱光源模式下的背景色。例如，在浏览器的色彩集合中，为每一个色彩设置对应的转换色彩，具体可通过调整该色彩的像素值的方式进行设置，该转换色彩的亮度较暗，当浏览器转换到弱光源模式时，可将页面中的背景色对应转换到该转换色彩上，以降低背景色的亮度。

本实施例提供的方法在浏览器转换光源模式时，使页面的背景色和背景图片经过同样的处理，因此可以保证转换光源模式后的页面中的背景色和背景图片能够达到转换前的融合过度效果，避免了在弱光源下背景图片和背景色不搭配而使网页的视觉效果变差，以及由此引起的用户浏览体验降低的问题。

与上述页面背景图片的处理方法的实施例对应，本申请还给出了页面背景图片的处理装置的实施例，如图3所示，所述装置包括：

计算单元301，用于由正常光源模式转换至弱光源模式后，根据页面在弱光源模式下的背景色以及正常光源模式下的背景色计算转换滤镜参数；

处理单元302，用于根据所述计算单元301计算的所述转换滤镜参数对所述页面在正常光源模式下的背景图片进行处理，以得到所述页面在弱光源模式下的背景图片。

如图4所示，为本发明另一个实施例提供的页面背景图片的处理装置的结构示意图，可选的，所述处理单元302包括：

第一调整子单元3021，用于根据所述转换滤镜参数中包含的灰度参数降低所述页面在弱光源模式下的背景图片的像素值；

第二调整子单元3022，用于根据所述转换滤镜参数中包含的偏色参数对降低像素值后的背景图片进行调整，以获得所述页面在弱光源模式下的背景图片的像素值。

可选的，所述第一调整子单元3021包括(下述各子单元图中未示出)：

第一计算子单元，用于计算所述灰度参数与基准色像素的比值，获得第一比例值；

第二计算子单元，用于将所述页面在弱光源模式下的背景图片的像素值乘以所述第一比值，以降低所述页面在弱光源模式下的背景图片的像素值。

可选的，所述计算单元包括(下述各子单元图中未示出)：

获得子单元，用于获得所述网页在弱光源模式下的背景色的像素值C2和正常光源模式下的背景色的像素值C1；

第三计算子单元，用根据如下规则计算所述灰度参数和所述偏色参数：

当C2>C1，或者C1＝0时，所述灰度参数即为所述基准色像素值，所述偏色参数为C2-C1，否则

所述灰度参数为C2与C1的比值与所述基准色像素值的乘积，所述偏色参数为0。

可选的，所述装置还包括：转换单元(图中未示出)，用于根据预设的转换规则将所述正常光源模式下的背景色进行转换以获得所述弱光源模式下的背景色。

本实施例对于各个功能单元及子单元并未做详细描述，相关之处可参见上述各方法实施例的对应部分。

本实施例提供的页面背景图片的处理装置，首先计算施加在背景色上的转换滤镜参数，再由该转换滤镜参数对正常光源模式下的背景图片进行处理，从而使页面的背景色和背景图片在转换时，经过同样的处理，因此可以保证转换光源模式后的页面中的背景色和背景图片能够达到转换前的融合过度效果，防止背景图片和背景色不搭配而使视觉效果变差，用户的浏览体验降低的问题。

本领域的技术人员可以清楚地了解到本发明实施例中的技术可借助软件加必需的通用硬件的方式来实现，通用硬件包括通用集成电路、通用CPU、通用存储器、通用元器件等，当然也可以通过专用硬件包括专用集成电路、专用CPU、专用存储器、专用元器件等来实现，但很多情况下前者是更佳的实施方式。基于这样的理解，本发明实施例中的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品可以存储在存储介质中，如只读存储器(ROM，Read-OnlyMemory)、随机存取存储器(RAM，RandomAccessMemory)、磁碟、光盘等，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本发明各个实施例或者实施例的某些部分所述的方法。

本说明书中的各个实施例均采用递进的方式描述，各个实施例之间相同相似的部分互相参见即可，每个实施例重点说明的都是与其他实施例的不同之处。尤其，对于系统实施例而言，由于其基本相似于方法实施例，所以描述的比较简单，相关之处参见方法实施例的部分说明即可。

以上所述的本发明实施方式，并不构成对本发明保护范围的限定。任何在本发明的精神和原则之内所作的修改、等同替换和改进等，均应包含在本发明的保护范围之内。

Claims (10)

1.一种页面背景图片的处理方法，其特征在于，所述方法包括：

由正常光源模式转换至弱光源模式后，根据页面在弱光源模式下的背景色以及正常光源模式下的背景色计算转换滤镜参数；

根据所述转换滤镜参数对所述页面在正常光源模式下的背景图片进行处理，以得到所述页面在弱光源模式下的背景图片。

2.根据权利要求1所述的方法，其特征在于，所述转换滤镜参数包括灰度参数与偏色参数，所述根据所述转换滤镜参数对所述页面在正常光源模式下的背景图片进行处理包括：

根据所述灰度参数降低所述页面在正常光源模式下的背景图片的像素值；

根据所述偏色参数对降低像素值后的背景图片进行调整，以获得所述页面在弱光源模式下的背景图片的像素值。

3.根据权利要求2所述的方法，其特征在于，所述根据所述灰度参数降低所述页面在正常光源模式下的背景图片的像素值包括：

计算所述灰度参数与基准色像素值的比值，获得第一比例值；

将所述页面在正常光源模式下的背景图片的像素值乘以所述第一比例值，以降低所述页面在正常光源模式下的背景图片的像素值。

4.根据权利要求2或3所述的方法，其特征在于，所述根据页面在弱光源模式下的背景色以及正常光源模式下的背景色计算切换滤镜参数包括：

获得所述页面在正常光源模式下的背景色的像素值C1和所述页面在弱光源模式下的背景色的像素值C2；

当C2>C1，或者C1＝0时，所述灰度参数即为所述基准色像素值，所述偏色参数为C2-C1，否则

所述灰度参数为C2与C1的比值与所述基准色像素值的乘积，所述偏色参数为0。

5.根据权利要求1至3任意一项所述的方法，其特征在于，还包括：

根据预设的转换规则将所述正常光源模式下的背景色进行转换之后获得所述弱光源模式下的背景色。

6.一种页面背景图片的处理装置，其特征在于，所述装置包括：

计算单元，用于由正常光源模式转换至弱光源模式后，根据页面在弱光源模式下的背景色以及正常光源模式下的背景色计算转换滤镜参数；

处理单元，用于根据所述计算单元计算的所述转换滤镜参数对所述页面在正常光源模式下的背景图片进行处理，以得到所述页面在弱光源模式下的背景图片。

7.根据权利要求6所述的装置，其特征在于，所述处理单元包括：

第一调整子单元，用于根据所述转换滤镜参数中包含的灰度参数降低所述页面在弱光源模式下的背景图片的像素值；

第二调整子单元，用于根据所述转换滤镜参数中包含的偏色参数对降低像素值后的背景图片进行调整，以获得所述页面在弱光源模式下的背景图片的像素值。

8.根据权利要求7所述的装置，其特征在于，所述第一调整子单元包括：

第一计算子单元，用于计算所述灰度参数与基准色像素的比值，获得第一比例值；

第二计算子单元，用于将所述页面在弱光源模式下的背景图片的像素值乘以所述第一比值，以降低所述页面在弱光源模式下的背景图片的像素值。

9.根据权利要求7或8所述的装置，其特征在于，所述计算单元包括：

获得子单元，用于获得所述网页在弱光源模式下的背景色的像素值C2和正常光源模式下的背景色的像素值C1；

第三计算子单元，用根据如下规则计算所述灰度参数和所述偏色参数：

当C2>C1，或者C1＝0时，所述灰度参数即为所述基准色像素值，所述偏色参数为C2-C1，否则

所述灰度参数为C2与C1的比值与所述基准色像素值的乘积，所述偏色参数为0。

10.根据权利要求6至8任意一项所述的装置，其特征在于，还包括：转换单元，用于根据预设的转换规则将所述正常光源模式下的背景色进行转换以获得所述弱光源模式下的背景色。