CN113763256A

CN113763256A - 一种图片适配方法和装置

Info

Publication number: CN113763256A
Application number: CN202010640513.4A
Authority: CN
Inventors: 高明
Original assignee: Beijing Jingdong Century Trading Co Ltd; Beijing Wodong Tianjun Information Technology Co Ltd
Current assignee: Beijing Jingdong Century Trading Co Ltd; Beijing Wodong Tianjun Information Technology Co Ltd
Priority date: 2020-07-06
Filing date: 2020-07-06
Publication date: 2021-12-07

Abstract

本发明公开了一种图片适配方法和装置，涉及计算机技术领域。该方法的一具体实施方式包括：获取待处理的图片中文本的文本颜色，并确定图片的主题色；根据文本颜色在颜色通道中的第一像素值以及主题色在颜色通道中的第二像素值，确定文本颜色和主题色的对比度；确定与文本的属性对应的对比度阈值，若对比度小于对比度阈值，则对文本和图片进行对比度调整，得到适配图片。该实施方式为视障用户动态提升图片对比度，解决其对低对比度图片的识别障碍，以此提供更好的用户体验，使其易获取文案信息和图案信息。

Description

一种图片适配方法和装置

技术领域

本发明涉及计算机技术领域，尤其涉及一种图片适配方法和装置。

背景技术

颜色可以用来区分信息图像上的数据类别和维度，是数据可视化中最常用的视觉变量之一。然而，世界上有些人群难以识别部分或全部颜色，通常笼统称这类人群为“色盲(Color Blindness)”(也称为道尔顿症、色觉缺失、色觉辨认障碍、色弱等)。面对如此庞大的特殊受众，设计师在设计图像时理应关注他们的需求。

色盲分有多种类型，比如看不清楚颜色、混淆颜色或者无法区分某些颜色等，人们浏览页面时的周围环境也会加剧这些问题。在实现本发明的过程中，发明人发现现有技术至少存在如下问题：

在越发炫彩的图像中，通常会增加些许描述文案，以此避免单调的图片亦或是文案内容，但常常忽略该部分的文本和图像可能没有足够的对比度，无疑会对视觉障碍、色盲用户带来较大困扰。

发明内容

有鉴于此，本发明实施例提供一种图片适配方法和装置，至少能够解决现有文本和图像的对比度设定没有考虑色盲用户感官的问题。

为实现上述目的，根据本发明实施例的一个方面，提供了一种图片适配方法，包括：

获取待处理的图片中文本的文本颜色，并确定所述图片的主题色；

根据所述文本颜色在颜色通道中的第一像素值以及所述主题色在颜色通道中的第二像素值，确定所述文本颜色和所述主题色的对比度；

确定与所述文本的属性对应的对比度阈值，若所述对比度小于所述对比度阈值，则对所述文本和所述图片进行对比度调整，得到适配图片。

可选的，所述确定所述图片的主题色，包括：

将所述图片中的像素映射至以R、G、B为坐标轴的RGB空间，得到RGB长方体；

确定所述RGB长方体中的最长边并进行中位切分，得到两个RGB小长方体；其中，每个RGB小长方体包含的像素数量相同；

重复上述中位切分过程，直至所得RGB小长方体数量达到预设数量为止；

计算每个RGB小长方体的像素平均值，确定每个像素平均值所处颜色范围，以将所有RGB小长方体中像素平均值数量最多的颜色范围作为所述图片的主题色。

可选的，所述根据所述文本颜色在颜色通道中的第一像素值以及所述主题色在颜色通道中的第二像素值，确定所述文本颜色和所述主题色的对比度，包括：

利用相对亮度计算方式分别处理所述第一像素值和所述第二像素值，得到所述文本颜色的第一相对亮度和所述主题色的第二相对亮度；

将所述第一相对亮度和所述第二相对亮度输入对比度计算方式中，得到所述文本颜色和所述主题色的对比度。

可选的，所述确定与所述文本的属性对应的对比度阈值，包括：

若所述文本为常规字体且尺寸小于第一尺寸阈值、或为加粗字体且尺寸小于第二尺寸阈值，则将所述对比度阈值设置为第一数值；或

若所述文本为常规字体且尺寸大于或等于所述第一尺寸阈值、或为加粗字体且尺寸大于或等于所述第二尺寸阈值，则将所述对比度阈值设置为第二数值。

可选的，所述对所述文本和所述图片进行对比度调整，包括：

确定所述主题色的反转色，以将所述文本颜色替换为所述反转色；或在图片层和文本层之间增加蒙版。

为实现上述目的，根据本发明实施例的另一方面，提供了一种图片适配装置，包括：

确定模块，用于获取待处理的图片中文本的文本颜色，并确定所述图片的主题色；

计算模块，用于根据所述文本颜色在颜色通道中的第一像素值以及所述主题色在颜色通道中的第二像素值，确定所述文本颜色和所述主题色的对比度；

调整模块，用于确定与所述文本的属性对应的对比度阈值，若所述对比度小于所述对比度阈值，则对所述文本和所述图片进行对比度调整，得到适配图片。

可选的，所述确定模块，用于：

可选的，用于：利用相对亮度计算方式分别处理所述第一像素值和所述第二像素值，得到所述文本颜色的第一相对亮度和所述主题色的第二相对亮度；

可选的，所述调整模块，用于：

可选的，所述调整模块，用于：确定所述主题色的反转色，以将所述文本颜色替换为所述反转色；或在图片层和文本层之间增加蒙版。

为实现上述目的，根据本发明实施例的再一方面，提供了一种图片适配电子设备。

本发明实施例的电子设备包括：一个或多个处理器；存储装置，用于存储一个或多个程序，当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现上述任一所述的图片适配方法。

为实现上述目的，根据本发明实施例的再一方面，提供了一种计算机可读介质，其上存储有计算机程序，所述程序被处理器执行时实现上述任一所述的图片适配方法。

根据本发明所述提供的方案，上述发明中的一个实施例具有如下优点或有益效果：提供一种处理图片和文字的方案，为视障用户动态提升图片对比度，解决其对低对比度图片的识别障碍，整体消耗资源较少，处理速度较快且适配结果精准，以此提供更好的用户体验，使其易获取文案信息和图案信息。

上述的非惯用的可选方式所具有的进一步效果将在下文中结合具体实施方式加以说明。

附图说明

附图用于更好地理解本发明，不构成对本发明的不当限定。其中：

图1是根据本发明实施例的一种图片适配方法的主要流程示意图；

图2是现有图片示意图；

图3是调整图2对比度后的图片示意图；

图4是根据本发明实施例的一种确定图片主题色的方法的流程示意图；

图5是根据本发明实施例的一种图片适配装置的主要模块示意图；

图6是本发明实施例可以应用于其中的示例性系统架构图；

图7是适于用来实现本发明实施例的移动设备或服务器的计算机系统的结构示意图。

具体实施方式

以下结合附图对本发明的示范性实施例做出说明，其中包括本发明实施例的各种细节以助于理解，应当将它们认为仅仅是示范性的。因此，本领域普通技术人员应当认识到，可以对这里描述的实施例做出各种改变和修改，而不会背离本发明的范围和精神。同样，为了清楚和简明，以下的描述中省略了对公知功能和结构的描述。

需要说明的是，本发明实施例适用于同时包含文本和图案的图像处理场景，且该图像可以为照片类静态图像或视频类动态图像，但需区分不同字幕类型。对于硬字幕技术实现上相对复杂，外挂字幕可以较好支持，技术实现相似，可以从图像亮度色彩提升、图案和文本之间添加蒙版、字体亮度提升等方向着手。

参见图1，示出的是本发明实施例提供的一种图片适配方法的主要流程图，包括如下步骤：

S101：获取待处理的图片中文本的文本颜色，并确定所述图片的主题色；

S102：根据所述文本颜色在颜色通道中的第一像素值以及所述主题色在颜色通道中的第二像素值，确定所述文本颜色和所述主题色的对比度；

S103：确定与所述文本的属性对应的对比度阈值，若所述对比度小于所述对比度阈值，则对所述文本和所述图片进行对比度调整，得到适配图片。

上述实施方式中，对于步骤S101，如图2所示图片，白色文本颜色与图案对比度较低，对于色盲用户不能很好的区分图片上的文案，给用户带来一定困扰。

针对该情况，本方案在客户端app上设置有图片适配功能，响应与用户对该功能的开启操作，app通过hook图片加载方法，以在显示图片之前进行预处理，判断是否需要进行对比度的优化。对需要适配的场景进行hook操作，以自动替换原有的图片设置方式。

需要说明的是，虽可以提供自动配置功能，但色盲用户群体数量较少，考虑其他正常群体的需求，优选在app中提供可适配的开关选项，并默认关闭状态，当用户需要调整文本和图案比例时，开启该功能即可。

本方案采用既有颜色提取算法获取该图片的主题色，如中位切分算法(Median-Cut Algorithm)、八叉树算法或聚类算法。不同算法提取图片主题色的优劣不等，针对不同场景的效果有可能存在一定差异性。

所采集的文本颜色为图片中文本原有的颜色。对于渐变色的文本通常采用同色系渐变，色环角度小于30度，可以直接取中间角度作为文本的色值标准。

对于步骤S102，当app在进行文本颜色设置时，首先通过相对亮度公式：

L＝0.2126*R+0.7152*G+0.0722*B，其中R、G和B定义为：

若R_sRGB<＝0.03928，则R＝R_sRGB/12.92，否则为((R_sRGB+0.055)/1.055)^2.4；“^”字符是幂运算符；

若G_sRGB<＝0.03928，则G＝G_sRGB/12.92，否则为((G_sRGB+0.055)/1.055)^2.4

若B_sRGB<＝0.03928，则B＝B_sRGB/12.92，否则为((B_sRGB+0.055)/1.055)^2.4

R_sRGB、G_sRGB和B_sRGB定义为：

R_sRGB＝R_8位/255

G_sRGB＝G_8位/255

B_sRGB＝B_8位/255

将文本颜色在R、G、B三个颜色通道中的第一像素值输入上述公式，得到文本颜色的相对亮度L1，以及根据图片主题色在R、G、B三个颜色通道中的第二像素值，得到主题色的相对亮度L2。

之后使用以下公式：(L1+0.05)/(L2+0.05)，计算得到文本颜色与主题色的对比度。该技术目的在于确保用户可以阅读在背景上呈现的文本，可提供更高水平的对比度，使弱视人群更容易阅读。

对于步骤S103，预先针对不同文本属性，设置有不同对比度阈值：

1)对于较小字体(如小于18磅的常规字体或14磅的加粗字体)，指定至少4.5:1的对比度；

2)对于较大字体(如18磅及以上的常规字体或14磅及以上的加粗字体)，指定至少3.0:1的对比度。

以上阈值可以自适应动态调整。阀值界定基于WCAG2.0(Web内容无障碍指南)标准，主要考虑文本粗细和大小两个因素。

由此，在获取当前图片的对比度之后，需要基于文本的粗细和大小两个属性，确定相应对比度阈值，并检查对比度是否大于或等于该对比度阈值：

1)若结果为大于或等于，表明该图片对于色盲用户可视效果相对良好，无需处理；

2)若结果为小于，则进行对比度提升操作。

在确定需要适配后，针对图片和文本可采用不同适配方案：

1)降低图片透明度或整体操作其RGB通道，使其适当变暗处理，如图3所示。

2)计算主题色的反转色，将原定色向反转色靠拢或直接采用反转色作为文本颜色。文本颜色的设置过程同样可采用hook方法。

3)在静态图片处理上，还可以在图片层和文本层之间，增加半透明蒙版用以提升对比度。而对于视频类，可修改外挂字幕的背景色，也可以直接采用半透明背景色。

上述实施例所提供的方法，动态提升对比度，解决色盲用户对低对比度图片的识别障碍。整体消耗资源较少，处理速度较快且适配结果精准，给色盲用户带来了方便。

参见图4，示出了根据本发明实施例的一种确定图片主题色的方法流程示意图，包括如下步骤：

S401：将所述图片中的像素映射至以R、G、B为坐标轴的RGB空间，得到RGB长方体；

S402：确定所述RGB长方体中的最长边并进行中位切分，得到两个RGB小长方体；其中，每个RGB小长方体包含的像素数量相同；

S403：重复上述中位切分过程，直至所得RGB小长方体数量达到预设数量为止；

S404：计算每个RGB小长方体的像素平均值，确定每个像素平均值所处颜色范围，以将所有RGB小长方体中像素平均值数量最多的颜色范围作为所述图片的主题色。

上述实施方式中，对于步骤S401～S404，本方案优选中位切分算法提取图片的主题色。中位切分算法原理为：将图片中的颜色看作是色彩空间中的长方体(Vbox，视频接口)，将长方体切割成目标数量紧凑的小长方体，然后使用小长方体的质心颜色值代表长方体内所有点的颜色值。

假设需获取256个颜色。详细的流程如下：

1)将图片中像素按R、G、B三基色分量量化到3个不同的坐标轴，得到RGB长方体；其中，R、G、B三个颜色的取值范围均为0～255，0代表全黑，255代表全白，所有像素颜色都对应于长方体内的一个点；

2)以RGB长方体中长、宽、高最长边为标准，从最长边的中间开始切割，将该长方体切分为两个小长方体，且两个小长方体包含的像素数量相同；

3)对分割后的RGB小长方体重复上述中位切割过程，直至得到256个RGB小长方体；

4)求取每个小长方体的质心的像素值，该质心的像素值代表相应小长方体的平均颜色值；

5)统计每个小长方体的平均颜色值得到该图片的主题色集合，即通过中位切分算法获得的主题色集合中共有256个颜色值。

聚集的越密，代表这些点的颜色越接近，如果将这些聚集块的点用其质心的颜色来表示，就可以将很多接近的颜色用一种颜色来代替。如基于每个小长方体平均颜色值的颜色范围，找到具有像素点数量最多的颜色范围，将该颜色范围对应的颜色作为所述图片的主题色。

上述实施例所提供的方法，针对视觉主体色提取方法上采用更精准的中位切分法，摒弃单纯像素点数量上的判断，不再限制色调类型。

本发明实施例所提供的方法，相对于现有技术，至少存在如下有益效果：

1)场景上：除静态图片外还可兼容视频类型，且不在仅针对安卓智能终端、TV端；

2)技术上：针对视觉主题色提取方法上采用更精准的中位切分法，摒弃单纯像素点数量上的判断，不再限制色调类型；并基于视觉障碍用户的体验上，利用算法计算亮度、对比度；通过WCAG标准，判断前景色和背景色是否符合标准作为优化前提。

参见图5，示出了本发明实施例提供的一种图片适配装置500的主要模块示意图，包括：

确定模块501，用于获取待处理的图片中文本的文本颜色，并确定所述图片的主题色；

计算模块502，用于根据所述文本颜色在颜色通道中的第一像素值以及所述主题色在颜色通道中的第二像素值，确定所述文本颜色和所述主题色的对比度；

调整模块503，用于确定与所述文本的属性对应的对比度阈值，若所述对比度小于所述对比度阈值，则对所述文本和所述图片进行对比度调整，得到适配图片。

本发明实施装置中，所述确定模块501，用于：

本发明实施装置中，所述计算模块502，用于：

本发明实施装置中，所述调整模块503，用于：

本发明实施装置中，所述调整模块503，用于：确定所述主题色的反转色，以将所述文本颜色替换为所述反转色；或在图片层和文本层之间增加蒙版。

另外，在本发明实施例中所述装置的具体实施内容，在上面所述方法中已经详细说明了，故在此重复内容不再说明。

图6示出了可以应用本发明实施例的示例性系统架构600。

如图6所示，系统架构600可以包括终端设备601、602、603，网络604和服务器605(仅仅是示例)。网络604用以在终端设备601、602、603和服务器605之间提供通信链路的介质。网络604可以包括各种连接类型，例如有线、无线通信链路或者光纤电缆等等。

用户可以使用终端设备601、602、603通过网络604与服务器605交互，以接收或发送消息等。终端设备601、602、603上可以安装有各种通讯客户端应用。

终端设备601、602、603可以是具有显示屏并且支持网页浏览的各种电子设备，包括但不限于智能手机、平板电脑、膝上型便携计算机和台式计算机等等。

服务器605可以是提供各种服务的服务器，例如对用户利用终端设备601、602、603所浏览的购物类网站提供支持的后台管理服务器(仅为示例)。

需要说明的是，本发明实施例所提供的方法一般由服务器605执行，相应地，装置一般设置于服务器605中。

应该理解，图6中的终端设备、网络和服务器的数目仅仅是示意性的。根据实现需要，可以具有任意数目的终端设备、网络和服务器。

下面参考图7，其示出了适于用来实现本发明实施例的终端设备的计算机系统700的结构示意图。图7示出的终端设备仅仅是一个示例，不应对本发明实施例的功能和使用范围带来任何限制。

如图7所示，计算机系统700包括中央处理单元(CPU)701，其可以根据存储在只读存储器(ROM)702中的程序或者从存储部分708加载到随机访问存储器(RAM)703中的程序而执行各种适当的动作和处理。在RAM 703中，还存储有系统700操作所需的各种程序和数据。CPU 701、ROM 702以及RAM 703通过总线704彼此相连。输入/输出(I/O)接口705也连接至总线704。

以下部件连接至I/O接口705：包括键盘、鼠标等的输入部分706；包括诸如阴极射线管(CRT)、液晶显示器(LCD)等以及扬声器等的输出部分707；包括硬盘等的存储部分708；以及包括诸如LAN卡、调制解调器等的网络接口卡的通信部分709。通信部分709经由诸如因特网的网络执行通信处理。驱动器710也根据需要连接至I/O接口705。可拆卸介质711，诸如磁盘、光盘、磁光盘、半导体存储器等等，根据需要安装在驱动器710上，以便于从其上读出的计算机程序根据需要被安装入存储部分708。

特别地，根据本发明公开的实施例，上文参考流程图描述的过程可以被实现为计算机软件程序。例如，本发明公开的实施例包括一种计算机程序产品，其包括承载在计算机可读介质上的计算机程序，该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中，该计算机程序可以通过通信部分709从网络上被下载和安装，和/或从可拆卸介质711被安装。在该计算机程序被中央处理单元(CPU)701执行时，执行本发明的系统中限定的上述功能。

需要说明的是，本发明所示的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于：具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本发明中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本发明中，计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于：无线、电线、光缆、RF等等，或者上述的任意合适的组合。

附图中的流程图和框图，图示了按照本发明各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分，上述模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个接连地表示的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图或流程图中的每个方框、以及框图或流程图中的方框的组合，可以用执行规定的功能或操作的专用的基于硬件的系统来实现，或者可以用专用硬件与计算机指令的组合来实现。

描述于本发明实施例中所涉及到的模块可以通过软件的方式实现，也可以通过硬件的方式来实现。所描述的模块也可以设置在处理器中，例如，可以描述为：一种处理器包括确定模块、计算模块、调整模块。其中，这些模块的名称在某种情况下并不构成对该模块本身的限定，例如，调整模块还可以被描述为“对比度调整模块”。

作为另一方面，本发明还提供了一种计算机可读介质，该计算机可读介质可以是上述实施例中描述的设备中所包含的；也可以是单独存在，而未装配入该设备中。上述计算机可读介质承载有一个或者多个程序，当上述一个或者多个程序被一个该设备执行时，使得该设备包括：

根据本发明实施例的技术方案，提供一种处理图片和文字的方案，为视障用户动态提升图片对比度，解决其对低对比度图片的识别障碍，整体消耗资源较少，处理速度较快且适配结果精准，以此来提供更好的用户体验，使其易获取文案信息和图案信息。

上述具体实施方式，并不构成对本发明保护范围的限制。本领域技术人员应该明白的是，取决于设计要求和其他因素，可以发生各种各样的修改、组合、子组合和替代。任何在本发明的精神和原则之内所作的修改、等同替换和改进等，均应包含在本发明保护范围之内。

Claims

1.一种图片适配方法，其特征在于，包括：

2.根据权利要求1所述的方法，其特征在于，所述确定所述图片的主题色，包括：

3.根据权利要求1所述的方法，其特征在于，所述根据所述文本颜色在颜色通道中的第一像素值以及所述主题色在颜色通道中的第二像素值，确定所述文本颜色和所述主题色的对比度，包括：

4.根据权利要求1所述的方法，其特征在于，所述确定与所述文本的属性对应的对比度阈值，包括：

5.根据权利要求1-4中任一项所述的方法，其特征在于，所述对所述文本和所述图片进行对比度调整，包括：

确定所述主题色的反转色，以将所述文本颜色替换为所述反转色；或

在图片层和文本层之间增加蒙版。

6.一种图片适配装置，其特征在于，包括：

7.根据权利要求6所述的装置，其特征在于，所述计算模块，用于：

8.根据权利要求6所述的装置，其特征在于，所述调整模块，用于：

9.一种电子设备，其特征在于，包括：

一个或多个处理器；

存储装置，用于存储一个或多个程序，

当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现如权利要求1-5中任一所述的方法。

10.一种计算机可读介质，其上存储有计算机程序，其特征在于，所述程序被处理器执行时实现如权利要求1-5中任一所述的方法。