Add water effect on bitmap android - android

How can i add water waves in bitmap image?
i have found water ripple effect on touch event here: https://github.com/esteewhy/whater but can not implement on my single bitmap.
can anyone help in making water wave effect on my bitmap?
or should i go for image processing?
Thank you in advance.
Here is my sample code in which i have to make water reflection effect:
public static Bitmap reflection(Bitmap mainImage) {
int width = mainImage.getWidth();
int height = mainImage.getHeight();
Matrix matrix = new Matrix();
matrix.preScale(1, -1);
reflectionImage = Bitmap.createBitmap(mainImage, 0,
0, width, height , matrix, false);
reflectedBitmap = Bitmap.createBitmap(width,
(height + height), Config.ARGB_8888);
Canvas canvas = new Canvas(reflectedBitmap);
canvas.drawBitmap(mainImage, 0, 0, null);
Paint defaultPaint = new Paint();
canvas.drawRect(0, height, width, height, defaultPaint);
canvas.drawBitmap(reflectionImage, 0, height-6 , null);
Paint paint = new Paint();
LinearGradient shader = new LinearGradient(0,
mainImage.getHeight(), 0, reflectedBitmap.getHeight()
, 0x70ffffff, 0x00ffffff, TileMode.CLAMP);
paint.setShader(shader);
paint.setXfermode(new PorterDuffXfermode(Mode.DST_IN));
canvas.drawRect(0, height, width, reflectedBitmap.getHeight()
, paint);
return reflectedBitmap;
}

Related

How to mask Bitmap with LinearGradient shader properly?

I'm trying to mask Bitmap with gradient alpha at bottom. Gradient size are fixed and independed of Bitmap size. But it draws incorrect: bottom of gradient at top, than top.
What's wrong?
There is sample code:
final int GRADIENT_HEIGHT = 32;
public Bitmap addGradient(Bitmap src) {
int w = src.getWidth();
int h = src.getHeight();
Bitmap overlay = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(overlay);
canvas.drawBitmap(src, 0, 0, null);
Paint paint = new Paint();
LinearGradient shader = new LinearGradient(0, 0, 0, GRADIENT_HEIGHT, 0xFFFFFFFF, 0x00FFFFFF, TileMode.REPEAT);
paint.setShader(shader);
paint.setXfermode(new PorterDuffXfermode(Mode.DST_IN));
canvas.drawRect(0, h - GRADIENT_HEIGHT, w, h, paint);
return overlay;
}
Thanks!
Change your LinearGradient to this:
LinearGradient shader = new LinearGradient(0, h - GRADIENT_HEIGHT, 0, h, 0xFFFFFFFF, 0x00FFFFFF, Shader.TileMode.CLAMP);

thumbnail reflection with Drawable instead of Bitmap

working on generate reflection for thumbnail in recent app menu
the code works very well with CM10 but since update to CM11 (kitkat) they moved to use Drawable instead of Bitmap for reduce memory usage
https://github.com/CyanogenMod/android_frameworks_base/commit/9926272f32868c858b24b45e048210cf3515741e
here should add the changes:
https://github.com/CyanogenMod/android_frameworks_base/blob/1e3c4a9e687b19cd7837fed51eb25e92a4f691c1/packages/SystemUI/src/com/android/systemui/recent/RecentsPanelView.java#L509
here my code:
final int reflectionGap = 4;
int width = thumbnail.getWidth();
int height = thumbnail.getHeight();
Matrix matrix = new Matrix();
matrix.preScale(1, -1);
Bitmap reflectionImage = Bitmap.createBitmap(thumbnail, 0, height * 2 / 3, width, height/3, matrix, false);
Bitmap bitmapWithReflection = Bitmap.createBitmap(width, (height + height/3), Config.ARGB_8888);
Canvas canvas = new Canvas(bitmapWithReflection);
canvas.drawBitmap(thumbnail, 0, 0, null);
Paint defaultPaint = new Paint();
canvas.drawRect(0, height, width, height + reflectionGap, defaultPaint);
canvas.drawBitmap(reflectionImage, 0, height + reflectionGap, null);
Paint paint = new Paint();
LinearGradient shader = new LinearGradient(0, thumbnail.getHeight(), 0,
bitmapWithReflection.getHeight() + reflectionGap, 0x70ffffff, 0x00ffffff,
TileMode.CLAMP);
paint.setShader(shader);
paint.setXfermode(new PorterDuffXfermode(Mode.DST_IN));
canvas.drawRect(0, height, width,
bitmapWithReflection.getHeight() + reflectionGap, paint);
h.thumbnailViewImage.setImageBitmap(bitmapWithReflection);
my question is :
how i can make this code works with Drawable instead of Bitmap
thanks
try this:
Drawable drawable = getResources().getDrawable(R.drawable.ic_launcher);
int w = drawable.getIntrinsicWidth();
int h = drawable.getIntrinsicHeight();
drawable.setBounds(0, 0, w, h);
Bitmap b = Bitmap.createBitmap(w, h, Config.ARGB_8888);
Canvas c = new Canvas(b);
c.translate(0, h);
c.scale(1, -1);
drawable.draw(c);
// test it
ImageView iv = new ImageView(this);
iv.setImageBitmap(b);
setContentView(iv);

how to set PorterDuffXfermode, the result is bias too much

Following is my program and reference picture.
Program :
int width = src.getWidth();
int height = src.getHeight();
Bitmap bitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas (bitmap);
Paint paint = new Paint();
paint.setAntiAlias(true);
paint.setDither(true);
canvas.drawBitmap(src, 0, 0, paint);
paint.setXfermode(new PorterDuffXfermode(Mode.MULTIPLY));
paint.setColor(Color.RED);
paint.setAlpha(35);
canvas.drawRect(0, 0, width, height, paint);
Reference picture :
I used above program to add a light transparent red color (with alpha) to the photo. But I am not clear why the photo changed to deep deep red. The "ideal result" is made by Photoshop. I just add a red layer before the original photo. And than change to a low transparence and MULTIPLY.
Are they not the same processing concept or my program has anything wrong? Does it can't use Mode.MULTIPLY to create the "ideal result"? Can anybody give some opinion to me?
thanks thanks thanks a lot!
Bitmap bitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
Canvas mCanvas = new Canvas(bitmap);
Paint paint = new Paint();
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.LIGHTEN));
paint.setColor(Color.RED);
paint.setAlpha(95);
mCanvas.drawBitmap(src, 0, 0, null);
mCanvas.drawRect(0, 0, src.getWidth(), src.getHeight(), paint);
With mode Lighten and Alpha as 95 I'm getting something nearer to your requirement.
Result:

Reflection on the Right Side of Image in Android ImageView

I have an image and I want to give reflection to that image in Android application, below is the source code. I've found an example code
ImageView imageView = (ImageView) findViewById(R.id.image1);
imageView.setImageResource(imageIDs[position]);
//The gap we want between the reflection and the original image
final int reflectionGap = 4;
//Get you bit map from drawable folder
Bitmap originalImage = BitmapFactory.decodeResource(getResources(),
imageIDs[position]);
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
Bitmap reflectionImage ;
if(isVertical)
reflectionImage= Bitmap.createBitmap(originalImage, 0, height/2, width, height/2, matrix, false);
else
reflectionImage= Bitmap.createBitmap(originalImage, width/2, 0, width/2, height, matrix, false);
//Create a new bitmap with same width but taller to fit reflection
Bitmap bitmapWithReflection;
if(isVertical)
bitmapWithReflection = Bitmap.createBitmap(width
, (height + height/2), Config.ARGB_8888);
else
bitmapWithReflection = Bitmap.createBitmap(width +width/2
, height, 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 deafaultPaint = new Paint();
if(isVertical)
canvas.drawRect(0, height, width, height + reflectionGap, deafaultPaint);
else
canvas.drawRect(width, 0, width+reflectionGap, height, deafaultPaint);
//Draw in the reflection
if(isVertical)
canvas.drawBitmap(reflectionImage,0, height + reflectionGap, null);
else
canvas.drawBitmap(reflectionImage,width + reflectionGap,0 , null);
//Create a shader that is a linear gradient that covers the reflection
Paint paint = new Paint();
LinearGradient shader;
if(isVertical)
shader = new LinearGradient(0, originalImage.getHeight(), 0,
bitmapWithReflection.getHeight() + reflectionGap, 0x70ffffff, 0x00ffffff,
TileMode.CLAMP);
else
shader = new LinearGradient(originalImage.getWidth(),0,
bitmapWithReflection.getWidth() + reflectionGap,0, 0x70ffffff, 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
if(isVertical)
canvas.drawRect(0, height, width,
bitmapWithReflection.getHeight() + reflectionGap, paint);
else
canvas.drawRect(width, 0, bitmapWithReflection.getWidth() + reflectionGap,
height, paint);
//Create an Image view and add our bitmap with reflection to it
//ImageView imageView = new ImageView(this);
imageView.setImageBitmap(bitmapWithReflection);`
This example works gracefullt when I give isVertical value=true, ath the bottom of the image, but I want to use reflection effect at the right side of the image also because I think it will be better in landscape mode. But it does not work as I want. It shows reflection side top-bottom reversed. What is my mistake? Thanks.
Your matrix has to change:
if (isVertical) {
matrix.preScale(1, -1);
reflectionImage= Bitmap.createBitmap(originalImage, 0, height/2, width, height/2, matrix, false);
}
else {
matrix.preScale(-1, 1);
reflectionImage= Bitmap.createBitmap(originalImage, width/2, 0, width/2, height, matrix, false);
}

How to set the width for text in canvas method in android?

In my application I used canvas to draw the text. now I want to set the width of the draw text. I can set only x , y position. I can't set width and height.
My problem
update
for example "India is my Country" or if any length text it goes outside of canvas that is outside of the background image.
i want to print "India is
my country" if i set width mean i think it goes to next line
#Override
protected void onDraw(Canvas canvas1)
{
Paint paint = new Paint();
Bitmap myBitmap = BitmapFactory.decodeResource(getResources(),R.drawable.ban_background);
Bitmap resizeImage1=Bitmap.createScaledBitmap(myBitmap,590,350,false);
canvas1.drawColor(Color.BLACK);
canvas1.drawBitmap(resizeImage1,10,5, null);
paint.setStyle(Paint.Style.FILL);
paint.setAntiAlias(true);
paint.setTextSize(25);
paint.setColor(Color.BLUE);
paint.setFakeBoldText(true);
paint.setTextSize(20);
paint.setStyle(Paint.Style.FILL_AND_STROKE);
canvas1.drawText(CameraText, 100,175, paint);
}
}
i have used to create a bitmap as follows and iam able to set the width and height
Bitmap finalImage = Bitmap.createBitmap(IMAGE_WIDTH, IMAGE_HEIGHT,
Bitmap.Config.RGB_565);
Bitmap tempImage = Bitmap.createBitmap(IMAGE_WIDTH / 2, IMAGE_HEIGHT,
Bitmap.Config.RGB_565);
Canvas g = new Canvas(finalImage);
Canvas gtemp = new Canvas(tempImage);
g.drawColor(Color.WHITE);
gtemp.drawColor(Color.WHITE);
Paint pnt = new Paint();
pnt.setColor(Color.BLACK);
pnt.setTextAlign(Paint.Align.CENTER);
pnt.setTextSize(40);
pnt.setTypeface(font1);
g.drawText(input, IMAGE_WIDTH / 2, 40, pnt);
Rect grct = new Rect(0, 0, IMAGE_WIDTH, IMAGE_HEIGHT);
Rect grctTemp = new Rect(0, 0, IMAGE_WIDTH / 2, IMAGE_HEIGHT);
gtemp.drawBitmap(finalImage, grct, grctTemp, pnt);
`
i am not sure what you mean but you can try the setStrokeWidth(2.0f)
i hope this helps :D

Categories

Resources