Home > Tutorials > Image Processing – Image Reflection Effect

Image Processing – Image Reflection Effect

So you want to create a nice, cool effect for your picture/photo viewer or camera effect?

Reflection is always a good one to mention.

Original Image

Original Image

Image w/ Reflection Effect

Image w/ Reflection Effect

I’ve just found the implementation for this technique on this page:


I remake it into a method for reusability:

    public static Bitmap applyReflection(Bitmap originalImage) {
        // gap space between original and reflected
        final int reflectionGap = 4;
        // get image size
        int width = originalImage.getWidth();
        int height = originalImage.getHeight();          
        // this will not scale but will flip on the Y axis
        Matrix matrix = new Matrix();
        matrix.preScale(1, -1);
        // create a Bitmap with the flip matrix applied to it.
        // we only want the bottom half of the image
        Bitmap reflectionImage = Bitmap.createBitmap(originalImage, 0, height/2, width, height/2, matrix, false);          
        // create a new bitmap with same width but taller to fit reflection
        Bitmap bitmapWithReflection = Bitmap.createBitmap(width, (height + height/2), Config.ARGB_8888);
        // create a new Canvas with the bitmap that's big enough for
        // the image plus gap plus reflection
        Canvas canvas = new Canvas(bitmapWithReflection);
        // draw in the original image
        canvas.drawBitmap(originalImage, 0, 0, null);
        // draw in the gap
        Paint defaultPaint = new Paint();
        canvas.drawRect(0, height, width, height + reflectionGap, defaultPaint);
        // draw in the reflection
        canvas.drawBitmap(reflectionImage,0, height + reflectionGap, null);
        // create a shader that is a linear gradient that covers the reflection
        Paint paint = new Paint();
        LinearGradient shader = new LinearGradient(0, originalImage.getHeight(), 0,
        		bitmapWithReflection.getHeight() + reflectionGap, 0x70ffffff, 0x00ffffff,
        // set the paint to use this shader (linear gradient)
        // set the Transfer mode to be porter duff and destination in
        paint.setXfermode(new PorterDuffXfermode(Mode.DST_IN));
        // draw a rectangle using the paint with our linear gradient
        canvas.drawRect(0, height, width, bitmapWithReflection.getHeight() + reflectionGap, paint);
        return bitmapWithReflection;

Thanks Neil Davies for this nice implementation!!!


Pete Houston

  1. lim hun
    June 1, 2015 at 4:24 pm

    paint.setXfermode(new PorterDuffXfermode(Mode.DST_IN)); (x)
    paint.setXfermode(new PorterDuffXfermode(android.graphics.PorterDuff.Mode.DST_IN)); (o)

  2. Rahul
    June 25, 2012 at 12:03 pm

    try PorterDuff.Mode.DST_IN it will work

  3. Mohsin Hussain
    June 5, 2012 at 1:50 pm

    DST_IN cannot be resolved???

  4. November 22, 2011 at 12:58 pm

    I need code for cropping a bitmap please help me in this

  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: