优化RSS阅读体验:实现字体颜色根据主题颜色自动变化

/ 0评 / 0

在大多数RSS阅读器或者采集站点中,常常会出现一个问题:文章自带的背景色或字色与主题颜色冲突。

例如我开发的「知微」RSS阅读器具有换肤功能,白天是正常的白底黑字,到了夜间就会切换为黑底白字。但是有的微信文章,经常着重给某行文字标为深蓝色或者黑色,在夜间模式下与页面底色基本区别不开,观感极差。

那该怎么解决呢?

我查看了市面上大部分的RSS阅读器,都是简单粗暴的去除所有 element 的底色(background-color)和字色(color),丢失了文章想要强调的信息。

我想到一个实现简单、效果优雅的方案,只要做了2个处理,就可以让绝大多数的文章都能适应app的换肤功能:

1,去掉所有 element 自带的底色(background-color)。

如果不去除,理想情况下,最少都会有“页面底色 + element 底色 + 文字颜色”共3层颜色,系统要根据页面底色,遍历去处理子 element 的底色,再向下遍历去处理子 element 的文字颜色。

然而在多数情况下,elements 十分复杂,可能多个层的 element 同时包含底色或者字色,都处理的话代价太高。再说带有底色的文章一般不多,并且增加了底色的文字,其本身大多也有特殊字色,这里去除底色,可以在步骤2中来矫正字色,不会丢失作者想要传达的信息。

2,检查所有带有字色(color)的 element,将16进制的颜色统一转为RGB模式,根据「颜色距离」算法,判断字色与页面底色是否相近,相近则做反色处理(临界值382)。

「颜色距离」算法可以参考这篇文章:https://blog.csdn.net/jaych/article/details/51137341

发表评论

电子邮件地址不会被公开。 必填项已用*标注