Attach (Render) text to a Drawable on Android

2

I've done some research on the net and found this class here: link

public class TextDrawable extends Drawable {

    private final String text;
    private final Paint paint;

    public TextDrawable(String text) {
            this.text = text;

            this.paint = new Paint();
            paint.setColor(Color.WHITE);
            paint.setTextSize(24f);
            paint.setAntiAlias(true);
            paint.setFakeBoldText(true);
            paint.setShadowLayer(6f, 0, 0, Color.BLACK);
            paint.setStyle(Paint.Style.FILL);
            paint.setTextAlign(Paint.Align.LEFT);
        }

        @Override
        public void draw(@NonNull Canvas canvas) {
            canvas.drawText(text, 0, 0, paint);
        }

        @Override
        public void setAlpha(@IntRange(from = 0, to = 255) int alpha) {
            paint.setAlpha(alpha);
        }

        @Override
        public void setColorFilter(@Nullable ColorFilter colorFilter) {
            paint.setColorFilter(colorFilter);
        }

        @Override
        public int getOpacity() {
            return PixelFormat.TRANSLUCENT;
        }
    }

The drawable is a <layer-list> :

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@color/backgroundColor" />

    <item android:top="10dp" android:left="10dp" android:bottom="10dp" android:right="10dp">
        <shape android:shape="rectangle">
            <solid android:color="#f00"/>
        </shape>
    </item>

    <item android:top="0dp" android:left="0dp" android:bottom="0dp" android:right="0dp" >
        <bitmap android:src="@drawable/imagen1" />
    </item>

</layer-list>

I have tried the following:

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    TextDrawable textDrawable = new TextDrawable(" ** Bienvenido ** ");

    LayerDrawable ld = (LayerDrawable) getResources().getDrawable(R.drawable.layerdraw, null);

    ld.mutate();

    ld.addLayer(textDrawable);

    getWindow().setBackgroundDrawable(ld);

}

But the text does not appear. If there is a better method, it is welcome.

DO NOT NOTE that I am displaying this drawable as the background temporarily, but it could also be within ImageWiew .

Edit

I have researched a little more and I have discovered that it is probably not possible to do it directly with the layer-list , however, I have seen that it is possible to do it by converting said layer-list into a bitmap and then superimpose the text on it, how I do this? How do I convert this drawable to bitmap ?. In any case I would count as a solution to this question, because I only want the text to be together as a background image.

    
asked by Chipkat 08.06.2017 в 17:38
source

1 answer

2

With the method you use with canvas.drawText() you can do without problem, the ImageView where the text will "render", it should not have properties wrap_content , you could assign match_parent

<ImageView
    android:id="@+id/imageView"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

and take into account where you are going to draw the text, by default the example you show, would be shown in the upper left corner, coordinates 0,0 on Android.

canvas.drawText(text, 0, 0, paint);

these two may be the causes why the text is not shown.

I share my class TextDrawable which to instantiate needs the context, the text to be displayed, position X and position Y, the size of the text can be set inside the class by means of variable FONT_SIZE .

    import android.content.Context;
    import android.graphics.Canvas;
    import android.graphics.Color;
    import android.graphics.ColorFilter;
    import android.graphics.Paint;
    import android.graphics.PixelFormat;
    import android.graphics.drawable.Drawable;

    public class TextDrawable extends Drawable {

        private final String text;
        private final Paint paint;
        private float positionx = 0;
        private float positiony = 0;
        private Context ctx;
        private static final float FONT_SIZE = 24.0f;

        public TextDrawable(Context ctx, String text, int positionx, int positiony) {
            this.ctx = ctx;
            this.text = text;
            this.positionx = positionx;
            this.positiony = positiony;
            this.paint = new Paint();
            paint.setColor(Color.WHITE);

            paint.setTextSize(getPxfromDP(FONT_SIZE));

            paint.setAntiAlias(true);
            paint.setFakeBoldText(true);
            paint.setShadowLayer(8f, 0, 0, Color.BLACK);
            paint.setStyle(Paint.Style.FILL);
            paint.setTextAlign(Paint.Align.CENTER);//align center
        }

        //Convert Pixels to Dp
        private float getPxfromDP(float dpValue) {
            float density = ctx.getResources().getDisplayMetrics().density;
            return dpValue * density + 0.5f;
        }

        @Override
        public void draw(Canvas canvas) {
            canvas.drawText(text, getPxfromDP(positionx), getPxfromDP(positiony), paint);
        }

        @Override
        public void setAlpha(int alpha) {
            paint.setAlpha(alpha);
        }

        @Override
        public void setColorFilter(ColorFilter cf) {
            paint.setColorFilter(cf);
        }

        @Override
        public int getOpacity() {
            return PixelFormat.TRANSLUCENT;
        }
    }

As an example of use

TextDrawable textDrawable = new TextDrawable(getApplicationContext(), "Elenasys was here!", 200, 200);
myImageView.setImageDrawable(textDrawable);

to get this result:

    
answered by 10.06.2017 / 00:36
source