Reflective shadow under images

[ghost]

I looked back in issues and couldn’t find this one.

Is there any way to add reflection under images?

[asalem1]

Hey @stephyswe , that had been an original feature of the plugin, however it was being applied with a CSS style that wasn't stable, so it was replaced by a shadow. I haven't been as up-to-date with CSS lately so I haven't checked to see if it's been reincorporated and is supported. If it is I will return it to the plugin

[ghost]

This manage Coverflow Reflection on Android (Java) maybe could be re-factored to JS ? https://stackoverflow.com/questions/19173900/android-cover-flow-with-image-shadow-effect

code part:

public Bitmap getRefelection(Bitmap image) { // The gap we want between the reflection and the original image final int reflectionGap = 0;

  // Get you bit map from drawable folder
  Bitmap originalImage = image;

  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 matix applied to it.
  // We only want the bottom half of the image
  /*if(bitmapWithReflection!=null && !bitmapWithReflection.isRecycled()){
   bitmapWithReflection.recycle();
   bitmapWithReflection=null;
  }*/
  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 the reflection Image
  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, 0x40ffffff, 0x00ffffff, TileMode.CLAMP);
  // Set the paint to use this shader (linear gradient)
  paint.setShader(shader);
  // 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);
  if(originalImage!=null && originalImage.isRecycled()){
   originalImage.recycle();
   originalImage=null;
  }
  if(reflectionImage!=null && reflectionImage.isRecycled()){
   reflectionImage.recycle();
   reflectionImage=null;
  }
  return bitmapWithReflection;
 }