Android drawText, incluido el ajuste de texto

canvas wrapping

Question

Actualmente estoy creando un editor de imágenes y estoy intentando dibujar texto sobre la imagen usando canvas.drawText (). Hasta ahora he tenido éxito al hacer esto, pero cuando el usuario ingresa texto que es demasiado largo, el texto simplemente continúa en una línea fuera de la página y no se ajusta al ancho de la pantalla. ¿Cómo voy a hacer esto? He intentado usar un diseño estático pero parece que no funciona, ¿alguien tiene un tutorial para hacer esto?

Mi función para dibujar en un lienzo usando el diseño estático:

 public Bitmap createImage(float scr_x,float scr_y,String user_text){

            Canvas canvas = new Canvas(image);

            scr_x = 100;
            scr_y = 100;
            final TextPaint tp = new TextPaint(Color.WHITE);     
            canvas.save();
            StaticLayout sl = new StaticLayout("" + user_text, tp, originalBitmap.getWidth(), Layout.Alignment.ALIGN_NORMAL, 1.0f, 0.0f, false);
            sl.draw(canvas);

         return image;
        }

Bien, he actualizado mi código, pero cuando trato de dibujar en la imagen no pasa nada, no tengo ni idea de por qué:

    public Bitmap createImage(String user_text) {
    // canvas object with bitmap image as constructor
    Canvas canvas = new Canvas(image);
    TextPaint tp = new TextPaint();
    tp.setColor(Color.RED);
    tp.setTextSize(50);
    tp.setTextAlign(Align.CENTER);
    tp.setAntiAlias(true);
    StaticLayout sl = new StaticLayout("" + user_text, tp,
            canvas.getWidth(), Layout.Alignment.ALIGN_NORMAL, 1, 0, false);
    canvas.translate(100, 100);
    sl.draw(canvas);
    return image;
}

¿Está staticlayout no destinado a dibujar en lienzo?

Answer 1

Debe manejarlo usted mismo, calculando el tamaño del texto y envolviendo el contenido de alguna manera (corte la línea al máximo ancho o ajuste la última palabra).

Ya lo hice en Java SE con FontMetrics, nunca para Android; pero deberías echarle un vistazo:

http://developer.android.com/reference/android/graphics/Paint.FontMetrics.html

Como señaló Lisa, StaticLayout es el camino a seguir para medir el ajuste del texto.

Answer 2

Sí, StaticLayout es lo que debes usar para dibujar texto multilínea en un lienzo. Ahórrate un mundo de dolor y no pienses en romper el texto tú mismo: estás en el camino correcto. No estoy seguro del problema del mapa de bits, pero su segundo código anterior funcionó muy bien para dibujar texto en un lienzo para mí.

Así es como dibujas un diseño en un lienzo: http://developer.android.com/reference/android/text/Layout.html#draw(android.graphics.Canvas)

Answer 3

public Bitmap drawMultilineTextToBitmap(Context gContext,
                                   int gResId,
                                   String gText) {

  // prepare canvas
  Resources resources = gContext.getResources();
  float scale = resources.getDisplayMetrics().density;
  Bitmap bitmap = BitmapFactory.decodeResource(resources, gResId);

  android.graphics.Bitmap.Config bitmapConfig = bitmap.getConfig();
  // set default bitmap config if none
  if(bitmapConfig == null) {
    bitmapConfig = android.graphics.Bitmap.Config.ARGB_8888;
  }
  // resource bitmaps are imutable,
  // so we need to convert it to mutable one
  bitmap = bitmap.copy(bitmapConfig, true);

  Canvas canvas = new Canvas(bitmap);

  // new antialiased Paint
  TextPaint paint=new TextPaint(Paint.ANTI_ALIAS_FLAG);
  // text color - #3D3D3D
  paint.setColor(Color.rgb(61, 61, 61));
  // text size in pixels
  paint.setTextSize((int) (14 * scale));
  // text shadow
  paint.setShadowLayer(1f, 0f, 1f, Color.WHITE);

  // set text width to canvas width minus 16dp padding
  int textWidth = canvas.getWidth() - (int) (16 * scale);

  // init StaticLayout for text
  StaticLayout textLayout = new StaticLayout(
    gText, paint, textWidth, Layout.Alignment.ALIGN_CENTER, 1.0f, 0.0f, false);

  // get height of multiline text
  int textHeight = textLayout.getHeight();

  // get position of text''s top left corner
  float x = (bitmap.getWidth() - textWidth)/2;
  float y = (bitmap.getHeight() - textHeight)/2;

  // draw text to the Canvas center
  canvas.save();
  canvas.translate(x, y);
  textLayout.draw(canvas);
  canvas.restore();

  return bitmap;
}

fuente: http://www.skoumal.net/en/android-drawing-multiline-text-on-bitmap/