使用两种不同颜色填充形状中的文本

Question

使用两种不同颜色填充形状中的文本

androidbackgroundshapestextcolor

6

我试图实现这个目标，但只能填充对象（形状）。

我的要求是更改文本颜色以及形状填充。形状可以用百分比填充，例如：

10％至50％= 绿色

51％至80％= 黄色

81％至100％= 红色

当黄色填充“：”的背景时，它将变成以前的“白色”，即“黄色”。此形状的大小也是动态的。

我尝试并成功地填充了形状的百分比，但在达到文本边缘时未能更改颜色。

- Chintan Rathod

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- rakshakhegde · Accepted Answer

我写了一个自定义视图。使用Path API可以实现这种双色效果。但是为了兼容Android 1+，您应该使用Region API，在Kitkat（19+）以上版本中，您可以只使用Path API。

让我们逐步介绍如何实现这种效果的概念：

1. 我们需要绘制三个形状-轮廓圆角描边+橙色进度条+文本本身 2. 我们按原样绘制描边 3. 但是对于进度条，我们需要删除与其相交的文本，并使文本交点透明（DIFFERENCE） 4. 对于进度条，我们还必须仅显示与外部圆角描边路径相交的矩形部分（INTERSECTION） 5. 同样地，对于文本，在左侧，我们基本上砍掉与进度条相交的部分。并且我们只显示右侧为橙色的文本部分（再次使用DIFFERENCE）

如果您正在使用API 19+，则关键代码段如下所示：

croppedProgressPath.op(progressPath, textPath, Path.Op.DIFFERENCE);
croppedProgressPath.op(progressStrokePath, Path.Op.INTERSECT);
————————————
croppedTextPath.op(textPath, progressPath, Path.Op.DIFFERENCE);

这里和这里有代码行。

我在Github上为这个项目写了一个概念验证，叫做Diffre。如果你想要先测试一下，所有的代码都在这个仓库里面。

Diffre演示GIF