Bitmap is created with rough edges

Question

So I am using this library https://github.com/uptechteam/MotionViews-Android/ for creating bitmaps, which can be resized and dragged around just like snapchat/instagram stickers. But the problem is that the bitmaps that are generated are not smooth and have rough edges like this:

As you can see the text are somewhat distorted and the background has rough edges. Here is the code for generating the bitmap:

/**
     * If reuseBmp is not null, and size of the new bitmap matches the size of the reuseBmp,
     * new bitmap won't be created, reuseBmp it will be reused instead
     *
     * @param textLayer text to draw
     * @param reuseBmp  the bitmap that will be reused
     * @return bitmap with the text
     */
    @NonNull
    private Bitmap createBitmap(@NonNull TextLayer textLayer, @Nullable Bitmap reuseBmp) {

        int boundsWidth = canvasWidth;
        int alignment = textLayer.getFont().getAlignment();
        int style = textLayer.getFont().getStyle();

        // init params - size, color, typeface
        if (style == STYLE_UNDERLINE) {
            textPaint.setFlags(Paint.UNDERLINE_TEXT_FLAG);
        } else {
            textPaint.setFlags(0);
        }
        textPaint.setAntiAlias(true);
        textPaint.setDither(false);
        textPaint.setElegantTextHeight(true);
        textPaint.setStyle(Paint.Style.FILL);
        textPaint.setTextSize(textLayer.getFont().getSize() * canvasWidth);
        textPaint.setColor(textLayer.getFont().getColor());
        textPaint.setTypeface(fontProvider.getTypeface(textLayer.getFont().getTypeface()));
        textBackgroundColor = textLayer.getFont().getBackgroundColor();
        // drawing text guide : http://ivankocijan.xyz/android-drawing-multiline-text-on-canvas/
        // Static layout which will be drawn on canvas
        Layout.Alignment layoutAlignment;
        if (alignment == ALIGNMENT_LEFT) {
            layoutAlignment = Layout.Alignment.ALIGN_NORMAL;
        } else if (alignment == ALIGNMENT_RIGHT) {
            layoutAlignment = Layout.Alignment.ALIGN_OPPOSITE;
        } else {
            layoutAlignment = Layout.Alignment.ALIGN_CENTER;
        }
        StaticLayout sl;
        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.M) {
            sl = new StaticLayout(
                    textLayer.getText(), // - text which will be drawn
                    textPaint,
                    boundsWidth, // - width of the layout
                    layoutAlignment, // - layout alignment
                    1, // 1 - text spacing multiply
                    1, // 1 - text spacing add
                    true); // true - include padding
        } else {
            StaticLayout.Builder builder = StaticLayout.Builder.obtain(textLayer.getText(), 0, textLayer.getText().length(), textPaint, boundsWidth)
                    .setAlignment(layoutAlignment)
                    .setLineSpacing(1, 1)
                    .setIncludePad(true);
            sl = builder.build();
        }
        // calculate height for the entity, min - Limits.MIN_BITMAP_HEIGHT
        int boundsHeight = sl.getHeight();
        // create bitmap not smaller than TextLayer.Limits.MIN_BITMAP_HEIGHT
        int bmpHeight = (int) (canvasHeight * Math.max(TextLayer.Limits.MIN_BITMAP_HEIGHT,
                1.0F * boundsHeight / canvasHeight));
        // create bitmap where text will be drawn
        Bitmap bmp;
        if (reuseBmp != null && reuseBmp.getWidth() == boundsWidth
                && reuseBmp.getHeight() == bmpHeight) {
            // if previous bitmap exists, and it's width/height is the same - reuse it
            bmp = reuseBmp;
            bmp.eraseColor(Color.TRANSPARENT); // erase color when reusing
        } else {
            bmp = Bitmap.createBitmap(boundsWidth, bmpHeight, Bitmap.Config.ARGB_8888);
        }
        Canvas canvas = new Canvas(bmp);
        final Rect rect = new Rect(0, 0, bmp.getWidth(), bmp.getHeight());
        final RectF rectF = new RectF(rect);
        final Paint textBackgroundPaint = new Paint();
        textBackgroundPaint.setFlags(Paint.FILTER_BITMAP_FLAG | Paint.ANTI_ALIAS_FLAG);
        textBackgroundPaint.setDither(false);
        textBackgroundPaint.setColor(textBackgroundColor);
        textBackgroundPaint.setStyle(Paint.Style.FILL_AND_STROKE);
        textBackgroundPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC));
        canvas.drawRoundRect(rectF, textBackgroundRadius, textBackgroundRadius, textBackgroundPaint);
        canvas.drawBitmap(bmp, rect, rect, textBackgroundPaint);
        canvas.save();
        // move text to center if bitmap is bigger that text
        if (boundsHeight < bmpHeight) {
            //calculate Y coordinate - In this case we want to draw the text in the
            //center of the canvas so we move Y coordinate to center.
            float textYCoordinate = (float) (bmpHeight - boundsHeight) / 2;
            canvas.translate(0, textYCoordinate);
        }
        //draws static layout on canvas
        sl.draw(canvas);
        canvas.restore();

        return bmp;
    }

I tried using antialias, filterbitmap on the paint but it does nothing. Also tried setting the view's layer type to layer_type_software but the result is the same. How to fix this? Any help would be appreciated.

Answer 1

Please use below code for removing rough edges from bitmap

canvas.drawBitmap(bitmap, x, y, new Paint(Paint.ANTI_ALIAS_FLAG));

use the Paint.ANTI_ALIAS_FLAG flag, this flag is used for removing the jagged edges and smooth the edges