沿路径使用渐变

Question

我正在尝试使用Android Path类创建“发光”效果。但是，渐变不会被扭曲以适合路径。相反，它只是在其“上方”显示并剪切到路径的笔划。使用方形路径，下图显示了我的意思：

相反，应该看起来像这样：

换句话说，渐变遵循路径，并且特别是根据CornerPathEffect中设置的半径环绕拐角。

这是代码的相关部分：

paint = new Paint();
paint.setStyle(Style.STROKE);
paint.setStrokeWidth(20);
paint.setAntiAlias(true);
LinearGradient gradient = new LinearGradient(30, 0, 50, 0,
    new int[] {0x00000000, 0xFF0000FF, 0x00000000}, null, Shader.TileMode.MIRROR);
paint.setShader(gradient);
PathEffect cornerEffect = new CornerPathEffect(10);
paint.setPathEffect(cornerEffect);
canvas.drawPath(boxPath, paint);

有任何想法吗？

---

另一种选择是在定义笔划宽度时获得“软边笔刷”效果。我已经对BlurMaskFilters进行了实验，但是它们提供了统一的模糊效果，而不是从不透明到透明的过渡。有人知道这是否可能吗？

Answer 1

用软笔刷位图绘制怎么样？使用诸如Photoshop之类的图像编辑软件制作不透明的，径向向外逐渐减小的软圆形画笔。另存为可绘制对象，将其加载到位图中，然后沿路径均匀地绘制。用白色画笔制作位图。这样，您可以使用PorterDuffColorFilter简单地将给定的颜色（此处为蓝色）乘以位图。

brush1=BitmapFactory.decodeResource(getResources(), R.drawable.brush_custom_one);
//This contains radially decreasing opacity brush
porter_paint.setColorFilter(new PorterDuffColorFilter(paint.getColor(), Mode.MULTIPLY));
for (int i=1;i<matrix.size();i++) {
//matrix contains evenly spaced points along path 
Point point = matrix.get(matrix.get(i));
canvas.drawBitmap(brush1, point.x,point.y, porter_paint);}

使用的画笔是（在那儿）： 最终结果是：

Answer 2

事实证明，有一种愚蠢而明显的方法可以做到这一点。只需重复使用相同的路径，并在每个绘图通道上调整描边宽度和 Alpha。示例代码：

float numberOfPasses = 20;
float maxWidth = 15;
for (float i = 0; i <= numberOfPasses; i++){
    int alpha = (int) (i / numberOfPasses * 255f);
    float width = maxWidth * (1 - i / numberOfPasses);

    paint.setARGB(alpha, 0, 0, 255);
    paint.setStrokeWidth(width);
    canvas.drawPath(path, paint);
}

请参阅下面的结果示例。左侧路径是使用此方法绘制的，为了进行比较，右侧路径是使用 maxWidth 和 255 alpha 在单笔划中绘制的。

这主要起作用。有两个问题：

• 渐变并不像应有的那么平滑。这是因为每一次绘制都会覆盖前一次，导致 alpha 建立得太快，在最后一次绘制之前就达到 255。对这条线进行一些实验int alpha = (int) (i / numberOfPasses * 125f);（注意更改为 125f 而不是 255f）会有所帮助。

• 这条路看起来像是在拐角内侧被“切割”过的。可能是应用的一些结果CornerPathEffect。