Create bitmap from a view

Create bitmap from a view

Create a bitmap from the view on Android.

Hello everyone! This is my first programming tutorial here in which I will discuss about creating the bitmap from a view at runtime.


ToC

Table of Contents

Background

I have an app for Android in which users can customize all the theme colors according to their requirements. They can also copy or share their theme in the form of a JSON which can be imported to achieve the exact same look later or can be shared between the other devices.

Recently, I decided to generate an image from the theme preview which users can share along with the JSON to give some idea about the theme before importing it. The in-app preview already shows the theme before applying it but I wanted to provide similar kind of functionality for posts shared on social media and in other communities.


Implementation

View.getDrawingCache()

Initially, I tried to use the view drawing cache. Although, it is working fine most of the drawing cache-related methods are deprecated in Android 9 (API 28). Please check the deprecated code below:

/**
 * Creates a bitmap from the supplied view.
 *
 * @param view The view to get the bitmap.
 * @param width The width for the bitmap.
 * @param height The height for the bitmap.
 *
 * @return The bitmap from the supplied drawable.
 */
public @NonNull static Bitmap createBitmapFromView(@NonNull View view, int width, int height) {
    if (width > 0 && height > 0) {
        view.measure(View.MeasureSpec.makeMeasureSpec(DynamicUnitUtils
                        .convertDpToPixels(width), View.MeasureSpec.EXACTLY),
                View.MeasureSpec.makeMeasureSpec(DynamicUnitUtils
                        .convertDpToPixels(height), View.MeasureSpec.EXACTLY));
    }

    view.layout(0, 0, view.getMeasuredWidth(), view.getMeasuredHeight());
    view.setDrawingCacheEnabled(true);
    view.buildDrawingCache(true);
    Bitmap bitmap = Bitmap.createBitmap(view.getDrawingCache());
    view.setDrawingCacheEnabled(false);

    return bitmap;
}

Canvas

As drawing cache API is deprecated, I found that we can achieve a similar result by using the Canvas API. Please check the new code below:

/**
 * Creates a bitmap from the supplied view.
 *
 * @param view The view to get the bitmap.
 * @param width The width for the bitmap.
 * @param height The height for the bitmap.
 *
 * @return The bitmap from the supplied drawable.
 */
public @NonNull static Bitmap createBitmapFromView(@NonNull View view, int width, int height) {
    if (width > 0 && height > 0) {
        view.measure(View.MeasureSpec.makeMeasureSpec(DynamicUnitUtils
                        .convertDpToPixels(width), View.MeasureSpec.EXACTLY),
                View.MeasureSpec.makeMeasureSpec(DynamicUnitUtils
                        .convertDpToPixels(height), View.MeasureSpec.EXACTLY));
    }
    view.layout(0, 0, view.getMeasuredWidth(), view.getMeasuredHeight());

    Bitmap bitmap = Bitmap.createBitmap(view.getMeasuredWidth(),
            view.getMeasuredHeight(), Bitmap.Config.ARGB_8888);
    Canvas canvas = new Canvas(bitmap);
    Drawable background = view.getBackground();

    if (background != null) {
        background.draw(canvas);
    }
    view.draw(canvas);

    return bitmap;
}

Pass 0 for height or width to use the current view dimensions. You can check the code for DynamicUnitUtils.convertDpToPixels(float) method here.

Outputs from both the methods are similar but it is recommended to use the canvas API as the view drawing cache methods may not work in future releases of Android.

Output

Dynamic Theme Preview

PixelCopy

There is another API for Android 7.0 (API 24+) or above devices which you can use to take screenshots of the UI. It seems complicated to me and I have not tried it yet. You can check the official documentation here.


Dynamic Utils

I have created a library for similar kinds of utility methods related to color, device, drawable, package, tasks, SDK, etc. which you can use to perform various runtime (dynamic) operations. Please visit the GitHub page for more info.

Tags :
Share :

Related Posts