一种页面侧边栏的颜色渲染方法及装置制造方法及图纸

本申请公开了一种页面侧边栏的颜色渲染方法，用以解决现有技术只能使侧边栏具备与网站首页的主色调相匹配的颜色，从而灵活性较差的问题。方法包括：在发生页面的切换显示后，确定当前页面第一特定内容的颜色值；根据当前页面第一特定内容的颜色值，渲染所述当前页面的侧边栏。本申请还公开一种页面侧边栏的颜色渲染装置。

【技术实现步骤摘要】

本申请涉及计算机
，尤其涉及一种页面侧边栏的颜色渲染方法及装置。
技术介绍
目前，为了使得用户对网页上一些常用的功能入口进行快捷选取，许多网站都提供了侧边栏这一功能区块。侧边栏，一般是指专为可快捷启动的功能入口设置的页面区域；侧边栏中常见的内容有：文字以及功能入口。如图1所示，该网页中就存在侧边栏，该侧边栏中的功能入口包括“购物车”访问入口，以及“首页”访问入口。除网页外，侧边栏也可以在其他各种各样的页面中出现，其展示位置往往是页面可见部分的侧边、上部或下部等。现有技术中，为了使侧边栏与网站的主色调相搭配，传统的侧边栏颜色设置方法是：设置一种与网站首页的主色调相匹配的侧边栏配色方案。基于该配色方案，当用户请求的页面具备侧边栏时，用户使用的浏览器会根据该配色方案中规定的颜色值，对侧边栏进行渲染，使得侧边栏具备与网站首页的主色调相匹配的颜色。上述方案存在的缺陷在于，只能使侧边栏具备与网站首页的主色调相匹配的颜色，灵活性较差。
技术实现思路
本申请实施例提供一种页面侧边栏的颜色渲染方法，用以解决现有技术只能使侧边栏具备与网站首页的主色调相匹配的颜色，从而灵活性较差的问题。本申请实施例还提供一种页面侧边栏的颜色渲染装置，用以解决现有技术只能使侧边栏具备与网站首页的主色调相匹配的颜色，从而灵活性较差的问题。本申请实施例采用下述技术方案：一种页面侧边栏的颜色渲染方法，包括：在发生页面的切换显示后，确定当前页面第一特定内容的颜色值；根据当前页面第一特定内容的颜色值，渲染所述当前页面的侧边栏。一种页面侧边栏的颜色装置，包括：颜色值确定单元，用于在发生页面的切换显示后，确定当前页面第一特定内容的颜色值；渲染单元，用于根据颜色值确定单元确定的当前页面第一特定内容的颜色值，渲染所述当前页面的侧边栏。一种服务端装置，所述服务端装置与多个客户端装置通信，所述服务端装置包括：处理器；以及存储器，所述存储器被配置成存储页面管理程序；所述页面管理程序被所述处理器执行时，响应客户端装置发送的第一访问请求，发送第一页面至所述客户端装置；其中，所述第一页面包括第一页面区和侧边栏，所述第一页面区被配置成响应用户的第一操作指令，在所述客户端装置的显示区域内滚屏显示第一页面内容，所述侧边栏被配置成在所述第一页面内容滚屏时，在所述客户端装置的显示区域内固定展示，所述侧边栏还被配置成至少根据所述第一页面区所提取到的第一颜色进行渲染；所述页面管理程序被所述处理器执行时，还响应所述客户端装置在所述第一页面执行的第二访问请求，发送第二页面至所述客户端装置；其中，所述第二页面包括第二页面区和所述侧边栏，所述第二页面区被配置成响应用户的第二操作指令，在所述客户端装置的显示区域内滚屏显示第二页面内容，所述侧边栏被配置成在所述第二页面内容滚屏时，在所述客户端装置的显示区域内固定展示，所述侧边栏还被配置成至少根据所述第二页面区提取到的第二颜色进行渲染。本申请实施例采用的上述至少一个技术方案能够达到以下有益效果：由于可以在发生页面的切换显示后，根据当前页面第一特定内容的颜色值，渲染当前页面的侧边栏，而不用受到与网站首页的主色调相匹配的侧边栏配色方案的限制，从而可以解决现有的侧边栏配色方案比较单一，只能使侧边栏具备与网站首页的主色调相匹配的颜色，灵活性较差的问题。采用本申请实施例提供的上述至少一个技术方案，能够达到适配使侧边栏的颜色适配更多页面的目的。附图说明此处所说明的附图用来提供对本申请的进一步理解，构成本申请的一部分，本申请的示意性实施例及其说明用于解释本申请，并不构成对本申请的不当限定。在附图中：图1为网页中的侧边栏示意图；图2为本申请实施例提供的一种页面侧边栏的颜色渲染方法的实现流程图；图3为本申请实施例中确定待渲染侧边栏的网页中的主图的主颜色值和辅颜色值的过程示意图；图4为本申请实施例中选取用于渲染当前页面的侧边栏的主颜色值和辅颜色值，并利用选取的主颜色值和辅颜色值对侧边栏进行渲染的过程示意图；图5为本申请实施例提供的一种页面侧边栏的颜色渲染装置的结构示意图图。具体实施方式为使本申请的目的、技术方案和优点更加清楚，下面将结合本申请具体实施例及相应的附图对本申请技术方案进行清楚、完整地描述。显然，所描述的实施例仅是本申请一部分实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本申请保护的范围。以下结合附图，详细说明本申请各实施例提供的技术方案。为了解决现有技术只能使侧边栏具备与网站首页的主色调相匹配的颜色，从而灵活性较差的问题，本申请实施例首先提供一种页面侧边栏的颜色渲染方法。在此所谓的“侧边栏”采用
技术介绍
部分提及的“侧边栏”定义。侧边栏在页面的显示方式可以有多种方式。例如，在一种实施方式中，在页面显示的同时显示侧边栏。在另一种实施方式中，也可以在页面显示之后，响应用户的页面滚动操作，例如，用户使用鼠标等输入装置执行滚屏操作(1/4)，呼出侧边栏。因此，以下阐述的侧边栏渲染方案，在一种实施方式中，在页面加载之时或者之后执行。在另一种实施方式中，该侧边栏渲染方案也可以在侧边栏呼出之时或者之后才执行。该方法的实现流程图如图2所示，包括如下步骤：步骤21，在发生页面的切换显示后，确定当前页面第一特定内容的颜色值；本申请实施例中：“发生页面的切换显示”可以是指由显示其他页面切换为显示所述当前页面；也可以是指从不显示任何页面，切换为显示所述当前页面。“当前页面”，可以是网页页面，也可以是其他类型的页面。“第一特定内容”，可以是特定类型的内容，比如可以是图像、文字或者视频，等等；或者也可以是满足特定条件的内容，比如可以是当前页面中尺寸最大的图片、当前页面中最大的标题栏或者是当前页面的背景图片，等等。“颜色值”，可以但不限于由一个或多个红绿蓝(RedGreenBlue，RGB)数组表示，或者由根据RGB数组确定出的一个或多个参数值表示，等等。步骤22，根据颜色相似度，从设置的颜色值集合中选取颜色值；其中，这里所说的颜色相似度包括：当前页面第一特定内容的颜色值和设置的颜色值集合中的至少一个颜色值的相似度。设置的颜色值集合可以是由离散的至少两个颜色值构成的集合；也可以是由连续的至少两个颜色值构成的本文档来自技高网...

【技术保护点】
一种页面侧边栏的颜色渲染方法，其特征在于，包括：在发生页面的切换显示后，确定当前页面第一特定内容的颜色值；根据当前页面第一特定内容的颜色值，渲染所述当前页面的侧边栏。

【技术特征摘要】
1.一种页面侧边栏的颜色渲染方法，其特征在于，包括：
在发生页面的切换显示后，确定当前页面第一特定内容的颜色值；
根据当前页面第一特定内容的颜色值，渲染所述当前页面的侧边栏。
2.如权利要求1所述的方法，其特征在于，根据当前页面第一特定内容
的颜色值，渲染所述当前页面的侧边栏，包括：
根据颜色相似度，从设置的颜色值集合中选取颜色值；其中，所述颜色值
集合中包含至少两个颜色值；所述颜色相似度包括：当前页面第一特定内容的
颜色值和所述颜色值集合中的至少一个颜色值的相似度；
利用选取的颜色值，渲染所述当前页面的侧边栏。
3.如权利要求2所述的方法，其特征在于，当前页面第一特定内容的颜
色值包括当前页面第一特定内容的主颜色值和辅颜色值；所述颜色值集合包括
主颜色值集合和辅颜色值集合；
根据颜色相似度，从设置的颜色值集合中选取颜色值，包括：
根据主颜色相似度，从主颜色值集合中选取主颜色值；其中，所述主颜色
相似度包括：当前页面第一特定内容的主颜色值和主颜色值集合中的至少一个
主颜色值的相似度；
根据辅颜色相似度，从辅颜色值集合中选取辅颜色值；其中，所述辅颜色
相似度包括：当前页面第一特定内容的辅颜色值和辅颜色值集合中的至少一个
辅颜色值的相似度；
利用选取的颜色值，渲染所述当前页面的侧边栏，包括：
利用选取的主颜色值和选取的辅颜色值，渲染所述当前页面的侧边栏。
4.如权利要求3所述的方法，其特征在于，利用选取的主颜色值和选取
的辅颜色值，渲染所述当前页面的侧边栏，包括：
利用选取的主颜色值，渲染所述当前页面的侧边栏的背景色；
利用选取的辅颜色值，渲染所述当前页面的侧边栏中文字的颜色。
5.如权利要求1所述的方法，其特征在于，根据所述颜色值，渲染所述
当前页面的侧边栏，包括：
根据所述颜色值，将所述侧边栏的颜色渲染为所述颜色值表示的颜色。
6.如权利要求5所述的方法，其特征在于，当前页面第一特定内容的颜
色值包括当前页面第一特定内容的主颜色值和辅颜色值；
根据当前页面第一特定内容的颜色值，将所述侧边栏的颜色渲染为当前页
面第一特定内容的颜色值表示的颜色，包括：
将所述侧边栏的背景色渲染为所述主颜色值表示的颜色；
将所述侧边栏中文字的颜色渲染为所述辅颜色值表示的颜色。
7.如权利要求1～6任一权项所述的方法，其特征在于，当前页面第一特
定内容包括：
当前页面中的图片。
8.如权利要求7所述的方法，其特征在于，当前页面第一特定内容的颜
色值包括当前页面第一特定内容的主颜色值和辅颜色值；
确定当前页面第一特定内容的颜色值，包括：
确定所述图片的各像素对应的红绿蓝RGB数组中各颜色分量的平均值；
根据所述平均值，确定所述图片的主颜色值。
9.如权利要求8所述的方法，其特征在于，确定当前页面第一特定内容
的颜色值，还包括：
根据所述图片的主颜色值，从所述图片中筛选像素；
确定筛选出的各像素对应的RGB数组中各颜色分量的平均值；
根据筛选出的各像素对应的RGB数组中各颜色分量的平均值，确定所述
图片的辅颜色值。
10.如权利要求1所述的方法，其特征在于，所述方法还包括：
确定当前页面第二特定内容的颜色值；则
根据当前页面第一特定内容的颜色值，渲染所述当前页面的侧边栏，包括：
根据当前页面第一特定内容的颜色值，以及当前页面第二特定内容的颜色
值，渲染所述当前页面的侧边栏。
11.如权利要求10所述的方法，其特征在于，根据当前页面第一特定内
容的颜色值，以及当前页面第二特定内容的颜色值，渲染所述当前页面的侧边
栏，包括：
利用分别根据当前页面第一特定内容的颜色值和当前页面第二特定内容
的颜色值选取的颜色值，计算渲染用的颜色值；
利用计算得到的渲染用的颜色值，渲染所述当前页面的侧边栏。
12.如权利要求10或11所述的方法，其特征在于，当存在所述当前页面
的html代码时，确定当前页面第二特定内容的颜色值，包括：
根据所述html代码中的叠样式表CSS属性中的特定页面节点的字体颜色
和/或背景颜色，确定当前页面第二特定内容的颜色值。
13.一种页面侧边栏的颜色装置，其特征在于，包括：
颜色值确定单元，用于在发生页面的切换显示后，确定当前页面第一特定
内容的颜色值；
渲染单元，用于根据颜色值确定单元确定的当前页面第一特定内容的颜色
值，渲染所述当前页面的侧边栏。
14.如权利要求13所述的装置，其特征在于，渲染单元，用于：
根据颜色相...

【专利技术属性】
技术研发人员：刘志敏，
申请(专利权)人：阿里巴巴集团控股有限公司，
类型：发明
国别省市：开曼群岛;KY