How to implement reflection

pjq · by **pjq** » Wed May 27, 2009 9:00 am

How to implement reflection like this :

keylimepai · by **keylimepai** » Thu May 28, 2009 1:48 pm

Off the top of my head, it seems like the way to do it would be something like:

* Take the representation of the "image" that you want to mirror (either directly or from the canvas)
* Decide how much of the image you want to reflect under it, and create a new, say, Bitmap to hold it
* Copy the starting image onto the top of the this new image, and then use a transform/clip to copy the reflected part to the bottom
* Create a gradient from full alpha to fully transparent from the line of the reflection to the new bottom of the image

There are probably better ways to do it, but I think this will work, at least for a static reflection.

pjq · by **pjq** » Thu May 28, 2009 2:11 pm

keylimepai wrote:Off the top of my head, it seems like the way to do it would be something like:

* Take the representation of the "image" that you want to mirror (either directly or from the canvas)
* Decide how much of the image you want to reflect under it, and create a new, say, Bitmap to hold it
* Copy the starting image onto the top of the this new image, and then use a transform/clip to copy the reflected part to the bottom
* Create a gradient from full alpha to fully transparent from the line of the reflection to the new bottom of the image

There are probably better ways to do it, but I think this will work, at least for a static reflection.

pjq · by **pjq** » Thu May 28, 2009 2:12 pm

keylimepai wrote:Off the top of my head, it seems like the way to do it would be something like:

* Take the representation of the "image" that you want to mirror (either directly or from the canvas)
* Decide how much of the image you want to reflect under it, and create a new, say, Bitmap to hold it
* Copy the starting image onto the top of the this new image, and then use a transform/clip to copy the reflected part to the bottom
* Create a gradient from full alpha to fully transparent from the line of the reflection to the new bottom of the image

There are probably better ways to do it, but I think this will work, at least for a static reflection.

Thanks for your suggestion.

Additionaly,it is not a static image.The numble in the image will be changed.
Actually,I want to know which relation functions I can used to do the work.

Anyone have idea about this?
Any suggestions will be appreciated.

keylimepai · by **keylimepai** » Thu May 28, 2009 6:27 pm

pjq wrote:Thanks for your suggestion.

Additionaly,it is not a static image.The numble in the image will be changed.
Actually,I want to know which relation functions I can used to do the work.

Anyone have idea about this?
Any suggestions will be appreciated.

It doesn't have to be a static image.

The method (I'd use) is something like this:

Syntax: [ Download ] [ Hide ]

Using java Syntax Highlighting

// height is height of the image you want to draw + space for reflection...
 
Bitmap canvasBitmap = Bitmap.createBitmap(width,height,Bitmap.Config.ARGB_8888);
 
Canvas myCanvas = new Canvas(canvasBitmap);
 
// Draw whatever needs to be reflected to the canvas
 
myCanvas.drawText("My text", x, y, myPaint);
 
// then create a function:
 
public void refectBitmap(Bitmap bitmap, float reflectionLine)
 
{
 
   // How tall is the reflection?
 
   int reflectionHeight= (int)(bitmap.getHeight() - reflectionLine);
 
   // Create an array to hold the data that's being reflected
 
   int[] reflectData = new int[(int)(bitmap.getWidth()) + 1];
 
   // How much should the alpha change between rows?
 
   float deltaAlpha = 255 / reflectionSize;
 
   // Current alpha
 
   int currentAlpha = 255;
 
   // There's probably a much better way to do this, but my brain isn't working
 
   for (int y = 0; y < reflectionHeight; ++y)
 
   {
 
      // Get a single line of data
 
      bitmap.getPixels(reflectData, 0, 1, 0, reflectionLine - y, bitmap.getWidth(), 1);
 
      // Reset the alpha values
 
      for (int x = bitmap.getWidth(); x>0; --x)
 
      {
 
         reflectData[x] = (reflectData[x] & 0x00ffffff) | (currentAlpha << 24);
 
      }
 
      // Reflect it...
 
      bitmap.setPixels(reflectData, 0, 1, 0, reflectionLine + y, bitmap.getWidth(), 1);
 
   }
 
}
 
Parsed in 0.035 seconds,  using GeSHi 1.0.8.4

Then you can just use Canvas.drawBitmap(bitmap, x, y, null) to put it wherever you'd like on the actual canvas.

There may be horrible, horrible bugs/typos in this... I'm at work and don't have access to a java compiler right here, let alone the Android SDK ^^v

Hopefully that makes more sense though?

pjq · by **pjq** » Thu May 28, 2009 7:32 pm

Thanks for your kindly reply.
I will try it though I don't know how to use Canvas right now.

Now is 2:28AM,I will go to sleep.

Have a nice day!!

phannguyen · by **phannguyen** » Tue Jun 02, 2009 10:23 am

hi keylimepai,
please , explain for me more detail about variable

reflectionLine
reflectionSize

and i got an exception at

bitmap.getPixels(reflectData, 0, 1, 0, reflectionLine - y, bitmap.getWidth(), 1);

do you know why?
please show me
thanks a lot

keylimepai · by **keylimepai** » Wed Jun 03, 2009 12:49 am

I'm going to try an implement it now, so I'll hopefully have an answer (perhaps better) shortly.

phannguyen · by **phannguyen** » Wed Jun 03, 2009 3:02 am

hi keylimepai,
Hope you implement it successfully and share for everyone.
have a nice day.
thanks for sharing.

keylimepai · by **keylimepai** » Wed Jun 03, 2009 5:27 am

Here's the class I implemented and the activity/main XML file...

The way it works is, the reflection will take up the space below a TextView, between the bottom of the last line of text and the bottom of the TextView itself. In order to use it effectively, therefore, one must set the "minHeight" attribute on the ReflectionTextView.

After that, simply write text inside it, and it will be reflected based on the InitialAlphaFactor and FinalAlphaFactor.

It's rather crude, but I hope it will provide a demonstration for how it can be done at least.

How to implement reflection

How to implement reflection

Who is online