web-dev-qa-db-ja.com

AndroidのMapViewで枠付きのテキストをどのように描画しますか？

AndroidのMapViewにテキストを描画しようとしています。テキストの描画はうまくいきますが、黒い境界線のない白いものであるため、テキストを読むのは非常に困難です（都市、州、国を示すためにMapViewsに自然に表示される残りのテキストのように）。黒枠のテキストの描き方がわからないようです。誰でもこれを行う方法を知っていますか？

これは、私が現在使用している種類のコードです（これは、オーバーレイの1つにあるサンプルコードにすぎません）。

@Override
public void draw(Canvas canvas, MapView mapView, boolean shadow) {
    Paint textPaint = new Paint();
    textPaint.setARGB(255, 255, 255, 255);
    textPaint.setTextAlign(Paint.Align.CENTER);
    textPaint.setTextSize(16);
    textPaint.setTypeface(Typeface.DEFAULT_BOLD);

    canvas.drawText("Some Text", 100, 100, textPaint);

    super.draw(canvas, mapView, shadow);
}
androidgoogle-mapsandroid-mapview
34
Dan Lew

これを行う最も簡単な方法は、ストロークを使用することです...次のようなもの：

@Override
public void draw(Canvas canvas, MapView mapView, boolean shadow) {
    Paint strokePaint = new Paint();
    strokePaint.setARGB(255, 0, 0, 0);
    strokePaint.setTextAlign(Paint.Align.CENTER);
    strokePaint.setTextSize(16);
    strokePaint.setTypeface(Typeface.DEFAULT_BOLD);
    strokePaint.setStyle(Paint.Style.STROKE);
    strokePaint.setStrokeWidth(2);

    Paint textPaint = new Paint();
    textPaint.setARGB(255, 255, 255, 255);
    textPaint.setTextAlign(Paint.Align.CENTER);
    textPaint.setTextSize(16);
    textPaint.setTypeface(Typeface.DEFAULT_BOLD);

    canvas.drawText("Some Text", 100, 100, strokePaint);
    canvas.drawText("Some Text", 100, 100, textPaint);

    super.draw(canvas, mapView, shadow);
}

これにより、テキストの外側に2ピクセルの境界線が描画され、その上にテキストが描画され、輪郭のように見えます。

また、コンストラクタでPaintsを設定してから、それらを再利用することもできます。

65
Jeremy Logan

このコードの代わりに（最初の回答から）

canvas.drawText("Some Text", 100, 100, strokePaint);
canvas.drawText("Some Text", 100, 100, textPaint);

同じパスを使用してみてください：

Path path = new Path();
String text = "Some Text";
textPaint.getTextPath(text, 0, text.length(), 0, 100, path);
canvas.drawPath(path, strokePaint);
canvas.drawPath(path, textPaint);

よく見える？

19
Oleg

（私の場合はそれであった）十分な場合もあれば十分でない場合もある半解は、影を設定することです。

textPaint.setShadowLayer(3, 0, 0, Color.BLACK);

影はテキストを目立たせるのに役立ちますが、黒の境界線ほどよくありません。私はまだ元の質問を解決する方法に興味があります。

11
Dan Lew

これは暗い場所での完全なショットであり、より良い方法があるかもしれませんが、テキストのコピーを4つ作成し、それらの色を黒に設定してから、各レイヤーを1ピクセルずつ斜めにシフトすると、境界線のように見えます。したがって、テキストが[100,100]に配置されている場合、4つの影は次のように[99,99]、[99,101]、[101,99]および[101,101]に配置する必要があります。

canvas.drawText("Some Text", 99, 99, borderPaint);
canvas.drawText("Some Text", 99, 101, borderPaint);
canvas.drawText("Some Text", 101, 99, borderPaint);
canvas.drawText("Some Text", 101, 101, borderPaint);

canvas.drawText("Some Text", 100, 100, textPaint);
2
Aleksander Kmetec