安卓中美观的描边文本

Question

我知道如何使用自定义视图（EditText或TextView）描边文本，但是我无法实现像Photoshop中那样美丽的效果。 是的，它还有外部阴影。

到目前为止，我所做的是调整描边宽度和描边连接风格。 但是，如果我增加描边宽度，则描边将覆盖整个文本。 就我的搜索所知，有一个库叫做MagicTextView，但它也不能给出上面那样的结果。

更新：根据@pskink的建议进行了一些微调。现在可以正常工作了。 但是，我不能再拖动了。 如果我拖动该EditText，则会显示出一些奇怪的线条，如下所示。

以下是代码：

@Override public void onDraw(Canvas canvas) {
  final int x = this.getLeft();
  final int y = this.getBottom();

  mText = this.getText().toString();

  p.setStrokeWidth(30);
  p.setStyle(Style.STROKE);
  p.setStrokeJoin(Join.ROUND);
  p.setColor(0xffffffff);

  canvas.drawText(mText, x, y, p);

  p.setStyle(Style.FILL);
  p.setColor(0xff000000);

  canvas.drawText(mText, x, y, p);
}

- Swan

---

调用drawText两次，使用不同的颜色和描边宽度（如果你能使用那个时髦的黑色阴影，就调用三次）。 - pskink

@pskink 是的，我也测试过了。但是它并没有如预期那样工作。 - Swan

将Style.FILL更改为Style.STROKE，并先绘制较粗的文本，然后再绘制普通文本。 - pskink

@pskink更新了代码。现在它可以正常工作，但是正如我之前所说，我的视图可以被用户拖动。现在，我无法像预期那样拖动它。我的定位计算有问题吗？ - Swan

你不需要画四次，只需用粗线条画一次，然后再用填充方式画第二次。至于拖动问题，我不知道为什么会发生，看看你的onDraw是否在拖动期间被调用了。 - pskink

Answer 1

经过几个小时的调整，我已经解决了更新问题中提到的奇怪行问题。我认为我应该在这里发布作为答案。

@Override public void onDraw(Canvas canvas) {
    mText = this.getText().toString();

    p.setStyle(Style.STROKE);
    p.setStrokeJoin(Join.ROUND);
    p.setShadowLayer(10, 1, 1, 0xcfcccccc);

    canvas.drawText(mText, 0, getLineHeight(), p);

    p.clearShadowLayer();
    p.setStrokeWidth(35);
    p.setStrokeJoin(Join.ROUND);
    p.setStyle(Style.STROKE);
    p.setColor(0xffffffff);

    canvas.drawText(mText, 0, getLineHeight(), p);

    p.setStyle(Style.FILL);
    p.setColor(0xff000000);

    canvas.drawText(mText, 0, getLineHeight(), p);
    canvas.translate(xPos, yPos);
}

xPos和yPos是来自onTouch事件的x和y值。我们需要将行高作为Y添加到画布文本中。

- Swan

---

非常感谢你..你救了我的一天 - midou

Answer 2

然而，如果我增加描边宽度，描边将覆盖整个文本。

如果问题在于描边居中，而你想要它在文本外部，请参见：Android Paint stroke width positioning 你必须根据描边预先计算所需的宽度和高度。

我建议尝试使用非常粗体字。在下面的图像中，白色描边将居中于红色线（这将是每个黑色字母的轮廓）。

针对您的更新：

如果我拖动EditText，会出现一些奇怪的线条。

该行可能是EditText上的焦点导致的。您可以明确删除焦点：Android: Force EditText to remove focus? 或者，您可以设计焦点（也许是不可见的，如果它不会对您的其他UI产生不利影响）：How to change the color of a focused EditText when using "android:Theme.Holo.Light"?

- Peter

---

调整宽度和高度也不行。那些笔画仍然覆盖整个文本。 - Swan

尝试使用非常粗的字体。 - Peter

是的，我正在使用android:textStyle="bold"来加粗字体。 - Swan

我的意思是字体本身应该有粗体字符。 - Peter

是的，我知道你的意思。我已经在使用Roboto Condensed字体了。它很粗，对吧？你能否详细说明一下你的修改建议？ - Swan