CN113064687A - 用户界面组件的色彩适配处理方法、装置及设备 - Google Patents

Abstract

本说明书提供一种用户界面组件的色彩适配处理方法、装置及设备，通过获取待处理用户界面组件所在页面区域的RGB色值，将RGB色值转换为HSV色值，基于HSV色值来判断当前待处理用户界面组件所在页面区域的色彩适合什么样的组件配色，自动将待处理用户界面组件设置为适合的配色，以实现用户界面组件的自动化适配，对于一些色盲、色弱人群更加友好，识别性更高，提升了用户界面组件以及页面展示效果和用户体验感的同时，还能够降低设计与研发人员实现成本，降本提效。

Description

用户界面组件的色彩适配处理方法、装置及设备

技术领域

本说明书属于计算机技术领域，尤其涉及一种用户界面组件的色彩适配处理方法、装置及设备。

背景技术

用户界面组件即UI组件(User Interface Module)，组件可以理解为将一段或几段完成各自功能的代码段封装为一个或几个独立的部分，而用户界面组件包含了这样一个或几个具有各自功能的代码段，最终完成了用户界面的表示。

一般的，UI组件的开发时，对其适配兼容性方案，主要考虑的是屏幕尺寸、屏幕分辨率、屏幕像素密度等，但对于UI组件的色彩适配没有被考虑。但是，UI组件需要应用于不同场景需求，面对的用户不同，如：可能输出给外部商家、开发者、ISV(IndependentSoftware Vendors，独立软件开发商)之后会在不同主体(国内或海外的商家页面、活动页面、系统页面、平台页面等)中使用，其配色方案多种多样并不可控。UI组件虽小，却是保证应用UI组件的应用程序、小程序、网页等功能性的基本元素，会分布到各个流程链路、环节触点、页面层次中，而不同的UI组件的配色会影响应用UI组件的应用程序、小程序、网页等的呈现效果。因此，如何提供一种UI组件的色彩适配方案是本领域亟需解决的技术问题。

发明内容

本说明书实施例的目的在于提供一种用户界面组件的色彩适配处理方法、装置及设备，实现了用户界面组件色彩配置的自动化调整，提升了用户界面组件的适用性，提高了用户界面组件的展示效果。

一方面，本说明书实施例提供了一种用户界面组件的色彩适配处理方法，所述方法包括：

获取待处理用户界面组件所在的页面区域的RGB色值；

将所述RGB色值转换为HSV色值；

根据HSV色值中的亮度值和/或饱和度值判断所述页面区域的色彩是否满足预设要求，若满足，则将所述待处理用户界面组件的色彩设置为第一颜色，否则，将所述待处理用户界面组件的色彩设置为第二颜色。

另一方面，本说明书提供了一种用户界面组件的色彩适配处理装置，所述装置包括：

页面色值获取模块，用于获取待处理用户界面组件所在的页面区域的RGB色值；

色值转换模块，用于将所述RGB色值转换为HSV色值；

色彩适配模块，用于根据HSV色值中的亮度值和/或饱和度值判断所述页面区域的色彩是否满足预设要求，若满足，则将所述待处理用户界面组件的色彩设置为第一颜色，否则，将所述待处理用户界面组件的色彩设置为第二颜色。

又一方面，本说明书实施例提供了一种用户界面组件的色彩适配处理设备，包括至少一个处理器以及用于存储处理器可执行指令的存储器，所述处理器执行所述指令时实现上述用户界面组件的色彩适配处理方法。

还一方面，本说明书实施例提供了一种计算机可读存储介质，其上存储有计算机指令，所述指令被执行时实现上述用户界面组件的色彩适配处理方法。

本说明书提供的用户界面组件的色彩适配处理方法、装置及设备，通过获取待处理用户界面组件所在页面区域的RGB色值，将RGB色值转换为HSV色值，基于HSV色值来判断当前待处理用户界面组件所在页面区域的色彩适合什么样的组件配色，自动将待处理用户界面组件设置为适合的配色，以实现用户界面组件的自动化适配，并提升了用户界面组件以及页面的展示效果，提升用户体验感。因显示器常用RGB色值作为色彩模型，因此RGB色值的获取方式简单，但RGB色值不适合无障碍色彩判断，基于RGB色值进行色彩配置后，对于一些色盲、色弱人群可能会无法识别。本说明书实施例将RGB色值转换为HSV色值后，进行用户界面组件的色彩适配，配置的组件色彩更加柔和，使得组件在界面中展示的更加清晰，并且使得用户界面组件的兼容性更好。

附图说明

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

图1是本说明书一个示例中用户界面组件的界面示意图；

图2是本说明书一个示例中容器组件在不同背景下的展示效果示意图；

图3是本说明书另一个场景示例中白底和透明底组件展示效果的对比示意图；

图4是本说明书另一个场景示例中白底和透明底组件展示效果的对比示意图；

图5是本说明书实施例提供的用户界面组件的色彩适配处理方法实施例的流程示意图；

图6是本说明书一些场景示例中基于亮度值进行用户界面组件适配的示意图；

图7是本说明书一些场景示例中基于饱和度值和亮度值进行用户界面组件适配的示意图；

图8是本说明书提供的用户界面组件的色彩适配处理装置一个实施例的模块结构示意图；

图9是本说明书一个实施例中用户界面组件的色彩适配处理服务器的硬件结构框图。

具体实施方式

为了使本技术领域的人员更好地理解本说明书中的技术方案，下面将结合本说明书实施例中的附图，对本说明书实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本说明书一部分实施例，而不是全部的实施例。基于本说明书中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都应当属于本说明书保护的范围。

应用程序界面、小程序界面、网页界面、应用程序以及小程序图标都会使用用户界面组件即UI组件，图1是本说明书一个示例中用户界面组件的界面示意图，如图1所述，用户界面组件可以应用在页面的顶部、中间、底部，可见用户界面组件的应用场景比较广泛，对于页面的展示效果有着比较重要的影响。用户界面组件是视图层的基本组成单元，会自带一些功能与风格的样式，会与其他主体进行组合，在输出给外部商家、开发者、ISV之后会在不同主体(商家店铺、活动页面、海外钱包等)中使用，其配色方案多种多样并不可控。一般的UI组件的色彩一般可以有几个默认配色，开发者根据需要在开发用户界面时根据需要进行选择，一般的开发者设置好UI组件的色彩配置后，UI组件的色彩即为固定配置。若界面面对的用户不同，界面的背景或图片会有所差异，那么开发者设置的界面中UI组件的配色可能无法满足不同用户的需求。若需要满足不同用户的需求，可能需要设计多个版本的UI组件，开发成本比较高。并且，有些组件的色彩配置可能在不同的终端中的显示效果不同，导致无法识别，例如：容器组件是由平台方强控制的，开发者只能调用定义好的样式，不能做任何调整，图2是本说明书一个示例中容器组件在不同背景下的展示效果示意图，如图2所示，有些情况(如：图2中第2个和第3个图片)容器组件会因为背景色中饱和度(S)和亮度(B)的变化，出现无法识别的状况。

本说明书实施例提供一种用户界面组件的色彩适配处理方法，可以根据用户界面组件的使用场景对用户界面组件的色彩进行自动化的调整，以便使得用户界面组件的色彩能够满足不同用户、不同场景的需求，保证页面的展示效果。

一般的，用户界面组件可以分为两种样式形态：白底和透明底，图3是本说明书另一个场景示例中白底和透明底组件展示效果的对比示意图，图4是本说明书另一个场景示例中白底和透明底组件展示效果的对比示意图，如图3-4所示，若用户界面组件对应的是白底，那么组件的色彩设置为黑色，就可以将组件比较好的展示出来，但，白底会遮盖住下方页面的内容，使得页面原本的展示内容被影响，影响页面的展示效果。而透明底会直接透出下方页面的内容，但，若页面的颜色或背景比较深，可能会影响组件的展示效果。本说明书实施例中，主要针对透明底的用户界面组件如何通过对组件的色彩进行调配，以使得组件能够清晰的展示出来，不影响整体的展示效果。

图5是本说明书实施例提供的用户界面组件的色彩适配处理方法实施例的流程示意图。虽然本说明书提供了如下述实施例或附图所示的方法操作步骤或装置结构，但基于常规或者无需创造性的劳动在所述方法或装置中可以包括更多或者部分合并后更少的操作步骤或模块单元。在逻辑性上不存在必要因果关系的步骤或结构中，这些步骤的执行顺序或装置的模块结构不限于本说明书实施例或附图所示的执行顺序或模块结构。所述的方法或模块结构的在实际中的装置、服务器或终端产品应用时，可以按照实施例或者附图所示的方法或模块结构进行顺序执行或者并行执行(例如并行处理器或者多线程处理的环境、甚至包括分布式处理、服务器集群的实施环境)。

本说明书实施例中提供的用户界面组件的色彩适配处理方法可以应用在移动客户端如：智能手机，或PC(Personal Computer，个人计算机)终端或服务器等终端中，如：在PC端或移动客户端中安装的APP(Application，应用程序)中提供的容器标准UI组件、API(Application Programming Interface，应用程序接口)标准组件、设计UI组件均可以理解为用户界面组件。如图5所示，所述方法可以包括如下步骤：

步骤502、获取待处理用户界面组件所在的页面区域的RGB色值。

在具体的实施过程中，RGB色彩模式是工业界的一种颜色标准，是通过对红(R)、绿(G)、蓝(B)三个颜色通道的变化以及它们相互之间的叠加来得到各式各样的颜色的，RGB即是代表红、绿、蓝三个通道的颜色。一般的客户端和PC端等的显示器主要采用RGB颜色标准，本说明书实施例可以获取待处理用户界面组件所在页面区域的RGB色值即红(R)、绿(G)、蓝(B)三个颜色通道的数值，待处理用户界面组件可以理解为需要进行颜色适配的用户界面组件。其中，可以从待处理用户界面组件应用的终端如：客户端或PC端或应用程序中获取当前页面区域的配置参数，进而获取到页面区域的RGB色值，或者也可以直接对当前显示器页面区域的RGB色值进行计算，获得页面区域的RGB色值，当然，根据实际使用需求，还可以采用其他方式获取待处理用户界面组件所在的页面区域的RGB色值，本说明书实施例不作具体限定。

其中，页面区域可以理解为待处理用户界面组件的容器，待处理用户界面组件所在的页面区域可以理解为待处理用户界面组件在当前页面中的位置区域，页面一般范围比较大，页面中不同区域的RGB色值的差距可能会比较大，本说明书实施例可以获取页面中以待处理用户界面组件为中心指定范围内的RGB色值。如：待处理用户界面组件位于页面导航栏中间位置，那么可以获取导航栏的RGB色值。

步骤504、将所述RGB色值转换为HSV色值。

在具体的实施过程中，HSV也称作HSB，表示一种颜色模式，在H(hues)表示色相，S(saturation)表示饱和度，V(value)表示亮度或明度。本说明书实施例可以利用转换公式，将RGB色值转换为HSV色值，即根据页面区域的红(R)、绿(G)、蓝(B)三个颜色通道的数值计算出对应的色相(H)、饱和度(S)、亮度(V)的取值，具体转换方法可以根据实际需要进行选择，本说明书实施例不作具体限定。本说明书一些实施例中，可以采用下述方式将RGB色值转换为HSV色值：

设(r,g,b)分别是一个颜色的红、绿和蓝坐标，它们的值是在0到1之间的实数。设max等价于r,g和b中的最大者，min等于这些值中的最小者，h∈[0,360)是角度的色相角，则：

v＝max

采用上述公式可以将RGB色值转换为HSV色值。

步骤506、根据HSV色值中的亮度值和/或饱和度值判断所述页面区域的色彩是否满足预设要求，若满足，则将所述待处理用户界面组件的色彩设置为第一颜色，否则，将所述待处理用户界面组件的色彩设置为第二颜色。

在具体的实施过程中，将RGB色值转换为HSV色值后，可以根据HSV色值中的亮度值(V)和/或饱和度值(S)判断当前待处理用户界面所在的页面区域的色彩是否满足预设要求，若满足，则将待处理用户界面组件的色彩自动设置为第一颜色，否则，将待处理用户界面组件的色彩自动设置为第二颜色。其中，第一颜色和第二颜色为不同的颜色，可以根据实际使用需求，设置为两种比较常见的色彩，例如：本说明书一些实施例中第一颜色可以为黑色，第二颜色可以为白色，当然，根据实际需要还可以配置为其他颜色，本说明书实施例不作具体限定。即当机遇HSV的亮度值和/或饱和度值，确定出当前待处理用户界面所在的页面区域的色彩满足预设要求，则将待处理用户界面组件的色彩设置为黑色，即为黑色组件，否则，将待处理用户界面组件的色彩设置为白色，即为白色组件。

其中，可以只基于饱和度值或亮度值中的一个作为用户界面组件色彩适配的标准，也可以综合考虑饱和度值和亮度值设置用户界面组件色彩的适配标准。

本说明书实施例根据用户界面组件的常用场景，设置组件的常用适配色彩，并基于组件所在的页面区域的色彩进行适配。如：小程序基础组件会分为两种样式形态：白底和透明底，透明底组件又分为：Dark暗黑组件和Light明亮组件，开发者可根据自身情况来选择。若确定该组件为透明底，则基于该组件应用的页面区域的RGB色值计算出的HGV色值，确定将该组件设置为Dark暗黑组件或Light明亮组件。此外，为了让开发者明确调用规则和被用户友好的识别，对比度也是最重要的考虑因素，可以将对比度设置为3:1。当然，本说明书实施例是基于常用的组件色彩进行的适配，使得组件能够满足大部分场景的使用需求，根据实际使用场景需要，还可以设置多种颜色如：红色、蓝色、绿色等不同的色彩适配标准，本说明书实施例不作具体限定。

通过配置不同页面背景下用户界面组件的自动适配标准，可以使得用户界面组件在满足不同用户页面设置的条件下，能够清晰的展示。如：有些人的社交软件的背景设置为一张颜色比较深的风景照，若默认使用黑色组件，可能会导致该用户的社交软件中的用户界面组件无法识别，则可以使用本说明书实施例中的方案，对则可以使用本说明书实施例中的方案，对个性图标的色彩进行自动化调整，以适应当前的页面背景的色彩进行自动化调整，以适应当前的页面背景。又如：有些用户的智能手机设置有背景图片，若用户想将智能手机终端中的应用程序图标设置为个性图标时，发现该个性图标在手机页面中显示不清晰，则可以使用本说明书实施例中的方案，对个性图标的色彩进行自动化调整，以适应当前的页面背景。

其中，页面区域是否满足预设要求中的预设要求，可以通过对不同用户、不同场景进行抽样实验，以确定出最优的亮度、饱和度的配置方案，或者采用色彩模型进行机器学习模型的智能运算，具体可以基于实际使用需要进行设置，本说明书实施例不作具体限定。

本说明书一些实施例中，所述根据HSV色值中的亮度值和/或饱和度值判断所述页面区域的色彩是否满足预设要求，包括：

若所述亮度值大于第一预设亮度阈值，则确定所述页面区域的色彩满足所述预设要求。

在具体的实施过程中，可以基于转换后的HSV色值中的亮度值来判断当前组件的色彩适配方案，若亮度值大于第一预设亮度阈值如：65％，则可以确定待处理用户界面组件所处的页面区域的色彩满足预设要求，可以将该待处理用户界面组件设置为第一颜色如黑色。否则，确定可以确定待处理用户界面组件所处的页面区域的色彩不满足预设要求，可以将该待处理用户界面组件设置为第二颜色如白色。其中，第一预设亮度阈值的具体取值可以根据实际需要进行适量的调整，本说明书实施例不作具体限定。

图6是本说明书一些场景示例中基于亮度值进行用户界面组件适配的示意图，如图6所示，当亮度值大于65％时，将导航栏中的组件设置为黑色组件，当亮度值小于65％时，将导航栏中的组件设置为白色组件，这样可以确保用户界面组件能够清晰的展示出来，方便用户查看和使用。

本说明书一些实施例中，所述根据HSV色值中的亮度值和/或饱和度值判断所述页面区域的色彩是否满足预设要求，包括：

若所述饱和度值小于预设饱和度阈值且所述亮度值大于第二预设亮度阈值，则确定所述页面区域满足所述预设要求。

在具体的实施过程中，可以基于转换后的HSV色值中的亮度值和饱和度值综合判断当前组件的色彩适配方案，若饱和度值小于预设饱和度阈值且亮度值大于第二预设亮度阈值，则可以确定待处理用户界面组件所处的页面区域的色彩满足预设要求，可以将该待处理用户界面组件设置为第一颜色如黑色。否则，确定可以确定待处理用户界面组件所处的页面区域的色彩不满足预设要求，可以将该待处理用户界面组件设置为第二颜色如白色。其中，第二预设亮度阈值可以设置为与第一亮度阈值相同的数值，也可以根据实际需要配置不同于第一亮度阈值的取值，饱和度阈值和亮度阈值的具体取值可以根据实际需要进行适量的调整，本说明书实施例不作具体限定。

图7是本说明书一些场景示例中基于饱和度值和亮度值进行用户界面组件适配的示意图，如图7所示，当饱和度值>75％或亮度值<65％可以将用户界面组件即导航栏内的组件设置为白色组件，反之使用黑色组件，即饱和度值<75％且亮度值>65％可以导航栏内的组件设置为黑色组件，这样可以确保用户界面组件能够清晰的展示出来，方便用户查看和使用。

当然，根据实际使用需要，还可以将色相(H)考虑到用户界面组件的适配标注中，如：基于色相的特性，将其分为A、B两个区域，A区域0<H<30或200<H<360，B区域30<H<200，则适配规则可以为：

1.当用户界面组件所在页面区域的色相(H)值介于0-30或200-360时，若饱和度(S)>75或亮度(V)<65时，用户界面组件使用白色；

2.当用户界面组件所在页面区域的色相(H)值介于0-30或200-360时，若饱和度(S)<75且亮度(V)>65时，用户界面组件使用黑色；

3.当用户界面组件所在页面区域的色相(H)值介于30-200时，若饱和度(S)>75或亮度(V)<65时，用户界面组件使用白色；

4.当用户界面组件所在页面区域的色相(H)值介于30-200时，若饱和度(S)<75且亮度(V)>65时，用户界面组件使用黑色。

当然，根据实际使用需要也可以配置一个只考虑饱和度的用户界面组件色彩适配规则，或配置其他基于饱和度、亮度、色相的适配规则，本说明书对此不做具体限定。

若，只需要考虑亮度值或饱和度值作为用户界面组件的适配规则，则在RGB色值转换为HSV色值时，可以值计算亮度值或饱和度值，以节省数据处理时间和内存，加快数据处理速度。

可以将用户界面组件的适配规则如：亮度、饱和度的匹配标准写入组件代码中，以实现用户界面组件的色彩自动适配。

本说明书实施例提供的用户界面组件的色彩适配处理方法，通过获取待处理用户界面组件所在页面区域的RGB色值，将RGB色值转换为HSV色值，基于HSV色值来判断当前待处理用户界面组件所在页面区域的色彩适合什么样的组件配色，自动将待处理用户界面组件设置为适合的配色，以实现用户界面组件的自动化适配，并提升了用户界面组件以及页面的展示效果，提升用户体验感。因显示器常用RGB色值作为色彩模型，因此RGB色值的获取方式简单，但RGB色值不适合无障碍色彩判断，基于RGB色值进行色彩配置后，对于一些色盲、色弱人群可能会无法识别。本说明书实施例将RGB色值转换为HSV色值后，进行用户界面组件的色彩适配，配置的组件色彩更加柔和，使得组件在界面中展示的更加清晰，并且使得用户界面组件的兼容性更好。

在上述实施例的基础上，本说明书一些实施例中，所述方法还包括：

每隔预设时间获取所述待处理用户界面组件所在的页面区域的RGB色值，并计算所述页面区域的HSV色值，根据计算出的HSV色值中的亮度和/饱和度调整所述待处理用户界面组件的色彩。

在具体的实过程中，用户界面组件的色彩的调整可以在使用用户界面组件软件或网页的页面打开时进行调整，也可以在使用过程中实时调整。本说明书一些实施例中，还可以根据待处理用户界面组件的使用场景，设置每隔预设时间获取一次待处理用户界面组件所在的页面区域的RGB色值，并采用上述实施例的方法计算出对应的HSV色值，基于HSV色值判断待处理界面组件所在的页面区域适合的色彩，自动将待处理用户界面组件调整为适合的颜色。例如：一些活动页面需要进行轮播，每一轮播放的页面背景不同，可以根据轮播的时间间隔如2秒轮播一次，设置每隔预设时间如2秒获取一次轮播页面中待处理用户界面组件所处的页面区域的RGB色值，采用上述实施例的方法计算一次，当前页面区域适合的色彩，并自动将待处理用户界面组件调整为适合的颜色，使得轮播过程中待处理用户界面组件始终保持适合页面背景，不影响页面展示效果，也不需要配置多套用户界面组件，节省组件开发成本和时间。

本说明书另一些实施例中，所述方法还包括：

获取所述待处理用户界面组件所在页面区域的页面设置信息；

根据所述页面设置信息获取所述页面区域的页面设置调整时间点；

根据所述页面设置调整时间点对应的页面区域的RGB色值和HSV色值，确定出所述待处理用户界面组件在所述页面设置调整时间点对应的色彩；

根据确定出的所述待处理用户界面组件在所述页面设置调整时间点对应的色彩，每到所述页面设置调整时间节点时将所述待处理用户界面组件设置为对应的色彩。

在具体的实施过程中，一些场景中，用户界面组件所应用的软件会设置页面调整时间点，如：白天模式和夜间模式，白天模式和夜间模式的页面背景、颜色会不同，此时，若软件中的用户界面组件的色彩不能做调整，则可能会导致切换模式后，用户界面组件无法识别。本说明书实施例，可以获取待处理用户界面组件所在页面区域的页面设置信息，其中，页面设置信息可以包括待处理用户界面组件应用的软件、应用程序或网页的页面背景设置参数，如：页面背景的模式、不同模式的切换时间点等。基于获取到的页面设置信息，可以获取页面模式调整的时间点即页面设置调整时间点，再获取页面设置调整时间点时待处理用户界面组件所在页面区域的RGB色值，基于上述实施例的方法计算出对应的HSV色值，进而确定出不同页面设置调整时间点时待处理用户界面组件适配的色彩，再在页面设置调整时间节点时将待处理用户界面组件调整为对应的色彩。

例如：某导航软件的页面设置信息中显示每天早上7点页面设置为白天模式，晚上6点设置为夜晚模式，可以在早上7点时获取导航软件中用户界面组件所在的页面区域的RGB色值，基于上述实施例的方法计算出对应的HSV色值，基于计算出的HSV色值，确定出白天模式待处理用户界面组件适配的色彩如为黑色。同样的，可以在晚上6点时获取导航软件中用户界面组件所在的页面区域的RGB色值，计算出对应的HSV色值，基于计算出的HSV色值，确定出白天模式待处理用户界面组件适配的色彩如为白色。确定出不同模式用户界面组件的色彩适配方案后，可以在每天早上7点将该导航软件中的用户界面组件自动调整为黑色，晚上6点将该导航软件中的用户界面组件自动调整为白色。

本说明书实施例基于用户界面组件的使用场景需求，自动适配出不同模式下用户界面组件的色彩，并在用户界面组件的容器的模式切换时间节点，自动将用户界面组件自动调整合适的色彩，确保用户界面组件能够清晰的展示，并且每个容器只需要配置一套用户界面组件，不需要基于不同模式配置不同的组件，降低了组件的开发维护成本，节省了组件以及应用组件的软件的开发时间。

本说明书中上述方法的各个实施例均采用递进的方式描述，各个实施例之间相同相似的部分互相参考即可，每个实施例重点说明的都是与其他实施例的不同之处。相关之处参考方法实施例的部分说明即可。

基于上述所述的用户界面组件的色彩适配处理方法，本说明书一个或多个实施例还提供一种用于用户界面组件的色彩适配处理的装置。所述装置可以包括使用了本说明书实施例所述方法的装置(包括分布式系统)、软件(应用)、模块、组件、服务器、客户端等并结合必要的实施硬件的装置。基于同一创新构思，本说明书实施例提供的一个或多个实施例中的装置如下面的实施例所述。由于装置解决问题的实现方案与方法相似，因此本说明书实施例具体的装置的实施可以参考前述方法的实施，重复之处不再赘述。以下所使用的，术语“单元”或者“模块”可以实现预定功能的软件和/或硬件的组合。尽管以下实施例所描述的装置较佳地以软件来实现，但是硬件，或者软件和硬件的组合的实现也是可能并被构想的。

具体地，图8是本说明书提供的用户界面组件的色彩适配处理装置一个实施例的模块结构示意图，该装置可以应用在上述实施例中的应用用户界面组件的终端或应用程序或网页，如图8所示，本说明书中提供的用户界面组件的色彩适配处理装置可以包括：

页面色值获取模块81，用于获取待处理用户界面组件所在的页面区域的RGB色值；

色值转换模块82，用于将所述RGB色值转换为HSV色值；

色彩适配模块83，用于根据HSV色值中的亮度值和/或饱和度值判断所述页面区域的色彩是否满足预设要求，若满足，则将所述待处理用户界面组件的色彩设置为第一颜色，否则，将所述待处理用户界面组件的色彩设置为第二颜色。

本说明书实施例提供的用户界面组件的色彩适配处理装置，通过获取待处理用户界面组件所在页面区域的RGB色值，将RGB色值转换为HSV色值，基于HSV色值来判断当前待处理用户界面组件所在页面区域的色彩适合什么样的组件配色，自动将待处理用户界面组件设置为适合的配色，以实现用户界面组件的自动化适配，并提升了用户界面组件以及页面的展示效果，提升用户体验感。因显示器常用RGB色值作为色彩模型，因此RGB色值的获取方式简单，但RGB色值不适合无障碍色彩判断，基于RGB色值进行色彩配置后，对于一些色盲、色弱人群可能会无法识别。本说明书实施例将RGB色值转换为HSV色值后，进行用户界面组件的色彩适配，配置的组件色彩更加柔和，使得组件在界面中展示的更加清晰，并且使得用户界面组件的兼容性更好。

本说明书一些实施例中，所述第一颜色为黑色，所述第二颜色为白色。

本说明书实施例基于常用的组件色彩进行的适配，使得组件能够满足大部分场景的使用需求，根据实际使用场景需要，还可以设置多种颜色如：红色、蓝色、绿色等不同的色彩适配标准，本说明书实施例不作具体限定。

需要说明的，上述所述的装置根据对应方法实施例的描述还可以包括其他的实施方式。具体的实现方式可以参照上述对应的方法实施例的描述，在此不作一一赘述。

本说明书实施例还提供一种用户界面组件的色彩适配处理设备，包括：至少一个处理器以及用于存储处理器可执行指令的存储器，所述处理器执行所述指令时实现上述实施例的用户界面组件的色彩适配处理方法，如：

获取待处理用户界面组件所在的页面区域的RGB色值；

将所述RGB色值转换为HSV色值；

根据HSV色值中的亮度值和/或饱和度值判断所述页面区域的色彩是否满足预设要求，若满足，则将所述待处理用户界面组件的色彩设置为第一颜色，否则，将所述待处理用户界面组件的色彩设置为第二颜色。

本说明书实施例还提供一种用户界面组件的色彩适配处理系统，包括：多个业务平台，其中，同一个用户在多个业务平台中使用相同的用户身份标识作为平台用户标识；即多个业务平台允许使用相同的用户身份标识作为平台用户标识；

各个业务平台中包括至少一个处理器以及用于存储处理器可执行指令的存储器，所述处理器执行所述指令时实现上述实施例中所述的用户界面组件的色彩适配处理方法。

需要说明的，上述所述的设备和系统根据方法实施例的描述还可以包括其他的实施方式。具体的实现方式可以参照相关方法实施例的描述，在此不作一一赘述。

本说明书提供的用户界面组件的色彩适配处理装置，也可以应用在多种数据分析处理系统中。所述系统或服务器或终端或设备可以为单独的服务器，也可以包括使用了本说明书的一个或多个所述方法或一个或多个实施例系统或服务器或终端或设备的服务器集群、系统(包括分布式系统)、软件(应用)、实际操作装置、逻辑门电路装置、量子计算机等并结合必要的实施硬件的终端装置。所述核对差异数据的检测系统可以包括至少一个处理器以及存储计算机可执行指令的存储器，所述处理器执行所述指令时实现上述任意一个或者多个实施例中所述方法的步骤。

本说明书实施例所提供的方法实施例可以在移动终端、计算机终端、服务器或者类似的运算装置中执行。以运行在服务器上为例，图9是本说明书一个实施例中用户界面组件的色彩适配处理服务器的硬件结构框图，该计算机终端可以是上述实施例中的用户界面组件的色彩适配处理服务器或用户界面组件的色彩适配处理装置。如图9所示服务器10可以包括一个或多个(图中仅示出一个)处理器100(处理器100可以包括但不限于微处理器MCU或可编程逻辑器件FPGA等的处理装置)、用于存储数据的非易失性存储器200、以及用于通信功能的传输模块300。本领域普通技术人员可以理解，图9所示的结构仅为示意，其并不对上述电子装置的结构造成限定。例如，服务器10还可包括比图9中所示更多或者更少的组件，例如还可以包括其他的处理硬件，如数据库或多级缓存、GPU，或者具有与图9所示不同的配置。

非易失性存储器200可用于存储应用软件的软件程序以及模块，如本说明书实施例中的用户界面组件的色彩适配处理方法对应的程序指令/模块，处理器100通过运行存储在非易失性存储器200内的软件程序以及模块，从而执行各种功能应用以及资源数据更新。非易失性存储器200可包括高速随机存储器，还可包括非易失性存储器，如一个或者多个磁性存储装置、闪存、或者其他非易失性固态存储器。在一些实例中，非易失性存储器200可进一步包括相对于处理器100远程设置的存储器，这些远程存储器可以通过网络连接至计算机终端。上述网络的实例包括但不限于互联网、企业内部网、局域网、移动通信网及其组合。

传输模块300用于经由一个网络接收或者发送数据。上述的网络具体实例可包括计算机终端的通信供应商提供的无线网络。在一个实例中，传输模块300包括一个网络适配器(Network Interface Controller，NIC)，其可通过基站与其他网络设备相连从而可与互联网进行通讯。在一个实例中，传输模块300可以为射频(Radio Frequency，RF)模块，其用于通过无线方式与互联网进行通讯。

上述对本说明书特定实施例进行了描述。其它实施例在所附权利要求书的范围内。在一些情况下，在权利要求书中记载的动作或步骤可以按照不同于实施例中的顺序来执行并且仍然可以实现期望的结果。另外，在附图中描绘的过程不一定要求示出的特定顺序或者连续顺序才能实现期望的结果。在某些实施方式中，多任务处理和并行处理也是可以的或者可能是有利的。

本说明书提供的上述实施例所述的方法或装置可以通过计算机程序实现业务逻辑并记录在存储介质上，所述的存储介质可以计算机读取并执行，实现本说明书实施例所描述方案的效果，如：

获取待处理用户界面组件所在的页面区域的RGB色值；

将所述RGB色值转换为HSV色值；

根据HSV色值中的亮度值和/或饱和度值判断所述页面区域的色彩是否满足预设要求，若满足，则将所述待处理用户界面组件的色彩设置为第一颜色，否则，将所述待处理用户界面组件的色彩设置为第二颜色。

所述存储介质可以包括用于存储信息的物理装置，通常是将信息数字化后再以利用电、磁或者光学等方式的媒体加以存储。所述存储介质有可以包括：利用电能方式存储信息的装置如，各式存储器，如RAM、ROM等；利用磁能方式存储信息的装置如，硬盘、软盘、磁带、磁芯存储器、磁泡存储器、U盘；利用光学方式存储信息的装置如，CD或DVD。当然，还有其他方式的可读存储介质，例如量子存储器、石墨烯存储器等等。

本说明书实施例提供的上述用户界面组件的色彩适配处理方法或装置可以在计算机中由处理器执行相应的程序指令来实现，如使用windows操作系统的c++语言在PC端实现、linux系统实现，或其他例如使用android、iOS系统程序设计语言在智能终端实现，以及基于量子计算机的处理逻辑实现等。

本说明书实施例并不局限于必须是符合行业通信标准、标准计算机资源数据更新和数据存储规则或本说明书一个或多个实施例所描述的情况。某些行业标准或者使用自定义方式或实施例描述的实施基础上略加修改后的实施方案也可以实现上述实施例相同、等同或相近、或变形后可预料的实施效果。应用这些修改或变形后的数据获取、存储、判断、处理方式等获取的实施例，仍然可以属于本说明书实施例的可选实施方案范围之内。

在20世纪90年代，对于一个技术的改进可以很明显地区分是硬件上的改进(例如，对二极管、晶体管、开关等电路结构的改进)还是软件上的改进(对于方法流程的改进)。然而，随着技术的发展，当今的很多方法流程的改进已经可以视为硬件电路结构的直接改进。设计人员几乎都通过将改进的方法流程编程到硬件电路中来得到相应的硬件电路结构。因此，不能说一个方法流程的改进就不能用硬件实体模块来实现。例如，可编程逻辑器件(Programmable Logic Device,PLD)(例如现场可编程门阵列(Field Programmable GateArray，FPGA))就是这样一种集成电路，其逻辑功能由用户对器件编程来确定。由设计人员自行编程来把一个数字系统“集成”在一片PLD上，而不需要请芯片制造厂商来设计和制作专用的集成电路芯片。而且，如今，取代手工地制作集成电路芯片，这种编程也多半改用“逻辑编译器(logic compiler)”软件来实现，它与程序开发撰写时所用的软件编译器相类似，而要编译之前的原始代码也得用特定的编程语言来撰写，此称之为硬件描述语言(Hardware Description Language，HDL)，而HDL也并非仅有一种，而是有许多种，如ABEL(Advanced Boolean Expression Language)、AHDL(Altera Hardware DescriptionLanguage)、Confluence、CUPL(Cornell University Programming Language)、HDCal、JHDL(Java Hardware Description Language)、Lava、Lola、MyHDL、PALASM、RHDL(RubyHardware Description Language)等，目前最普遍使用的是VHDL(Very-High-SpeedIntegrated Circuit Hardware Description Language)与Verilog。本领域技术人员也应该清楚，只需要将方法流程用上述几种硬件描述语言稍作逻辑编程并编程到集成电路中，就可以很容易得到实现该逻辑方法流程的硬件电路。

控制器可以按任何适当的方式实现，例如，控制器可以采取例如微处理器或处理器以及存储可由该(微)处理器执行的计算机可读程序代码(例如软件或固件)的计算机可读介质、逻辑门、开关、专用集成电路(Application Specific Integrated Circuit，ASIC)、可编程逻辑控制器和嵌入微控制器的形式，控制器的例子包括但不限于以下微控制器：ARC 625D、Atmel AT91SAM、Microchip PIC18F26K20以及Silicone Labs C8051F320，存储器控制器还可以被实现为存储器的控制逻辑的一部分。本领域技术人员也知道，除了以纯计算机可读程序代码方式实现控制器以外，完全可以通过将方法步骤进行逻辑编程来使得控制器以逻辑门、开关、专用集成电路、可编程逻辑控制器和嵌入微控制器等的形式来实现相同功能。因此这种控制器可以被认为是一种硬件部件，而对其内包括的用于实现各种功能的装置也可以视为硬件部件内的结构。或者甚至，可以将用于实现各种功能的装置视为既可以是实现方法的软件模块又可以是硬件部件内的结构。

上述实施例阐明的系统、装置、模块或单元，具体可以由计算机芯片或实体实现，或者由具有某种功能的产品来实现。一种典型的实现设备为计算机。具体的，计算机例如可以为个人计算机、膝上型计算机、车载人机交互设备、蜂窝电话、相机电话、智能电话、个人数字助理、媒体播放器、导航设备、电子邮件设备、游戏控制台、平板计算机、可穿戴设备或者这些设备中的任何设备的组合。

为了描述的方便，描述以上装置时以功能分为各种模块分别描述。当然，在实施本说明书一个或多个时可以把各模块的功能在同一个或多个软件和/或硬件中实现，也可以将实现同一功能的模块由多个子模块或子单元的组合实现等。以上所描述的装置实施例仅仅是示意性的，例如，所述单元的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，例如多个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另一点，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口，装置或单元的间接耦合或通信连接，可以是电性，机械或其它的形式。

本发明是参照根据本发明实施例的方法、装置(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程资源数据更新设备的处理器以产生一个机器，使得通过计算机或其他可编程资源数据更新设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。

这些计算机程序指令也可存储在能引导计算机或其他可编程资源数据更新设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。

这些计算机程序指令也可装载到计算机或其他可编程资源数据更新设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。

本说明书中的各个实施例均采用递进的方式描述，各个实施例之间相同相似的部分互相参考即可，每个实施例重点说明的都是与其他实施例的不同之处。尤其，对于系统实施例而言，由于其基本相似于方法实施例，所以描述的比较简单，相关之处参考方法实施例的部分说明即可。在本说明书的描述中，参考术语“一个实施例”、“一些实施例”、“示例”、“具体示例”、或“一些示例”等的描述意指结合该实施例或示例描述的具体特征、结构、材料或者特点包含于本说明书的至少一个实施例或示例中。在本说明书中，对上述术语的示意性表述不必须针对的是相同的实施例或示例。而且，描述的具体特征、结构、材料或者特点可以在任一个或多个实施例或示例中以合适的方式结合。此外，在不相互矛盾的情况下，本领域的技术人员可以将本说明书中描述的不同实施例或示例以及不同实施例或示例的特征进行结合和组合。

以上所述仅为本说明书一个或多个实施例的实施例而已，并不用于限制本说明书一个或多个实施例。对于本领域技术人员来说，本说明书一个或多个实施例可以有各种更改和变化。凡在本说明书的精神和原理之内所作的任何修改、等同替换、改进等，均应包含在权利要求范围之内。

Claims (10)

1.一种用户界面组件的色彩适配处理方法，所述方法包括：

获取待处理用户界面组件所在的页面区域的RGB色值；

将所述RGB色值转换为HSV色值；

根据HSV色值中的亮度值和/或饱和度值判断所述页面区域的色彩是否满足预设要求，若满足，则将所述待处理用户界面组件的色彩设置为第一颜色，否则，将所述待处理用户界面组件的色彩设置为第二颜色。

2.如权利要求1所述的方法，所述根据HSV色值中的亮度值和/或饱和度值判断所述页面区域的色彩是否满足预设要求，包括：

若所述亮度值大于第一预设亮度阈值，则确定所述页面区域的色彩满足所述预设要求。

3.如权利要求1所述的方法，所述根据HSV色值中的亮度值和/或饱和度值判断所述页面区域的色彩是否满足预设要求，包括：

若所述饱和度值小于预设饱和度阈值且所述亮度值大于第二预设亮度阈值，则确定所述页面区域满足所述预设要求。

4.如权利要求1所述的方法，所述方法还包括：

每隔预设时间获取所述待处理用户界面组件所在的页面区域的RGB色值，并计算所述页面区域的HSV色值，根据计算出的HSV色值中的亮度和/饱和度调整所述待处理用户界面组件的色彩。

5.如权利要求1所述的方法，所述方法还包括：

获取所述待处理用户界面组件所在页面区域的页面设置信息；

根据所述页面设置信息获取所述页面区域的页面设置调整时间点；

根据所述页面设置调整时间点对应的页面区域的RGB色值和HSV色值，确定出所述待处理用户界面组件在所述页面设置调整时间点对应的色彩；

根据确定出的所述待处理用户界面组件在所述页面设置调整时间点对应的色彩，每到所述页面设置调整时间节点时将所述待处理用户界面组件设置为对应的色彩。

6.如权利要求1-5任一项所述的方法，所述第一颜色为黑色，所述第二颜色为白色。

7.一种用户界面组件的色彩适配处理装置，所述装置包括：

页面色值获取模块，用于获取待处理用户界面组件所在的页面区域的RGB色值；

色值转换模块，用于将所述RGB色值转换为HSV色值；

色彩适配模块，用于根据HSV色值中的亮度值和/或饱和度值判断所述页面区域的色彩是否满足预设要求，若满足，则将所述待处理用户界面组件的色彩设置为第一颜色，否则，将所述待处理用户界面组件的色彩设置为第二颜色。

8.如权利要求7所述的装置，所述第一颜色为黑色，所述第二颜色为白色。

9.一种用户界面组件的色彩适配处理设备，包括：至少一个处理器以及用于存储处理器可执行指令的存储器，所述处理器执行所述指令时实现权利要求1-6任一项所述的方法。

10.一种计算机可读存储介质，其上存储有计算机指令，所述指令被执行时实现权利要求1至6中任一项所述方法的步骤。

Images