Красивый штриховой текст в Android

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);
}

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 - это значения x и y из ACTION_MOVE Событие onTouch. И нам нужно добавить высоту строки как Y для текста холста.

Answer 2

Однако, если я увеличу ширину обводки, обводка займет весь текст.

Если проблема в том, что обводка отцентрирована, и вы хотите, чтобы она находилась вне текста, см. Android Paint Позиционирование по ширине обводки.

Вы должны предварительно рассчитать желаемую ширину и высоту в соответствии с вашим ходом.

Я бы предложил попробовать очень жирный шрифт. На изображении ниже белый штрих будет центрирован по красной линии (которая будет контуром каждой черной буквы).

В ответ на ваше обновление:

Если я перетаскиваю этот EditText, появляются некоторые странные строки.

Линия может быть результатом фокусировки на EditText. Вы можете удалить фокус явно: Android: принудительно установить EditText, чтобы удалить фокус?

Кроме того, вы можете стилизовать фокус (возможно, чтобы он был невидимым, если он не влияет отрицательно на остальную часть вашего пользовательского интерфейса): Как изменить цвет сфокусированного EditText при использовании "android:Theme.Holo.Light"?