How to overlay a bitmap over another - android

I have tried the solution suggested here Android: How to overlay-a-bitmap/draw-over a bitmap?. I seems to work but I obtained a slightly disoriented image from it.
before-overlay
after-overlay
I have set my edit icon to toggle between start and stop drawing on canvas. When the user stops drawing, I retrieve the canvas bitmap and the imageView and overlay canvas bitmap on the imageView.
As can be seen from the screenshots, the imageView is the laptop image and canvas bitmap is the up arrow I drew.
Here is my overlay function.
private Bitmap overlay(Bitmap bmp1, Bitmap bmp2) {
Bitmap bmOverlay = Bitmap.createBitmap(bmp1.getWidth(), bmp1.getHeight(), bmp1.getConfig());
Canvas canvas = new Canvas(bmOverlay);
canvas.drawBitmap(bmp1, new Matrix(), null);
canvas.drawBitmap(bmp2, new Matrix(), null);
return bmOverlay;
}
I am new to android and would appreciate some help in this regard.
Thanks!

i think you can use something like this to achieve what you want :
Paint paint = new Paint(Paint.FILTER_BITMAP_FLAG);
Canvas result = new Canvas(underlayBitmap);
result.drawBitmap(overlayBitmap, left, top, paint);
you can give the top side and left side where you want your overlay to be drawn.
hope this helps.

The most easier way to do that without go deeper with graphics libs is using FrameLayout, with this layout you can place one view above the other in order as they are added to the layout, example:
<FrameLayout>
<ImageView android:id="#+id/imageView1" />
<ImageView android:id="#+id/imageView2" />
</FrameLayout>
In example above imageView2 will overlap imageView1, this is so far the fastest way to overlay one image with another. This approach allows to place any descendant of View above another one.

Related

How to add rainbow gradient to an Image in android

I want to add Transparent Rainbow or Spectrum Gradient to Bitmap.
In photoshop it is very easy. Now I want to do it programmatically. I have gone through a lot of research. But gradient has only one starting color and one ending. How could I add the rainbow color(multiple color) Gradient in Android.
Or is there a way to add that effect to bitmap in Android? Like given
for this you can use a translucent image with the desired gradient and put it on top of your image view in a FrameLayout. then capture bitmap of the view.
once you get your layout ready use this answer to capture bitmap from it
try this to convert a view (framelayout) into a bitmap:
public Bitmap viewToBitmap(View view) {
Bitmap bitmap = Bitmap.createBitmap(view.getWidth(), view.getHeight(), Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(bitmap);
view.draw(canvas);
return bitmap;
}

Altering the opacity of part of a View

I would like to get the following effect. I have an image on my screen. When a navigation drawer (or another obstructing view) comes over the top of my image, I want to instead of having it cover the image, show the negative of the image.
The pictures below may help to show what I mean.
Any ideas on how to accomplish this? I'd like to get the same effect for the menu icon.
The way I would go about this is:
Enable the drawing cache on the view you want to apply the negative:
view.setDrawingCacheEnabled(true);
Get a snapshot of the view when the drawer is clicked or dragged with :
Bitmap bmp = view.getDrawingCache();
Finally override the onDraw() method of the drawer and draw the bitmap on it. Apply a shader to do the "negative" effect. See: http://chiuki.github.io/android-shaders-filters/#/
canvas.drawColor(Color.WHITE);
BitmapDrawable bd = (BitmapDrawable) getResources().getDrawable(R.drawable.your_drawable);
Bitmap bm = bd.getBitmap();
Paint paint = new Paint();
Where the INT ranges from 0 (fully transparent) to 255 (fully opaque).
paint.setAlpha(0);
canvas.drawBitmap(bm, 0, 0, paint);

How to combine two bitmaps into one so that their relative position should not be changed in rotating the combined one?

In my application,I want to combine two bitmaps for example a leaf and its shadow, in water.I am able to combine those bitmaps and make the combined bitmap freely fall from the top of the screen with some rotation in a live wallpaper.In my combined image the shadow is a little bit below the original leaf and left to it.If the combined image is rotating with some angle,the shadow also rotates with that angle.It seems to be like that the shadow is rotating like original image. But the shadow position should be always below the original image. But some times shadow is appearing on top of the original image while the combined image is falling with rotation because they are merged.I do not want this.I want the shadow always below the original image under any instance.How can i achieve this?Please help me.I am providing my code to combine the two bitmaps.
public static Bitmap overlay(Bitmap bmp1, Bitmap bmp2) {
Bitmap bmoverlay = null;
bmoverlay = Bitmap.createBitmap(bmp1.getWidth(), bmp1.getHeight(), bmp1.getConfig());
Canvas canvas = new Canvas(bmoverlay);
canvas.drawBitmap(bmp1, null, new Rect(0, 0, canvas.getWidth() , canvas.getHeight()), null);
canvas.drawBitmap(bmp2, 20, 20, null);
return bmoverlay;
}
Please suggest me how to do or any other method which does my requirement?Thanks in advance.

How to set layout on openGl 3d cube?

I want to inflate layout xml file on 3d cube one side, for next side another layout xml, for next another etc.
I just need on side of 3d cube put gridView and in gridview put some buttons, images, texts.
Is it possible and how?
There are two ways you can accomplish this:
Create a Camera and create transformations for the different sides of your cube.
Here is an example of how to use the camera object to achieve a 3d-effect with a view.
This way don't explicitly use OpenGL, but it should be hardware accelerated on newer versions of Android.
Use the draw()-method of your layout to draw to a custom Canvas, and make an OpenGL texture out of the canvas content:
Bitmap layoutBitmap = Bitmap.createBitmap(width, height, Bitmap.Config.RGB_565);
Canvas tmpCanvas = new Canvas(layoutBitmap);
//Load layoutBitmap to a texture and recycle it.
Then draw your cube with the new texture.
Unfortunately these solutions won't allow any events on the layout (possibly the first option, but I don't think so) so if you need to be able to click or perform some other action this will not work.
I use this to create a bitmap image from layout, maybe help you.
private Bitmap imageXML(View view) {
view.measure(View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED),
View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED));
view.layout(0, 0, view.getMeasuredWidth(), view.getMeasuredHeight());
final Bitmap bp = Bitmap.createBitmap(view.getMeasuredWidth(), view.getMeasuredHeight(), Bitmap.Config.ARGB_8888);
bp.eraseColor(Color.WHITE);
Canvas canvas = new Canvas(bp);
view.draw(canvas);
return bp;
}

Drawing shapes on changing image in android

I need to draw shapes on an image in my layout. This image needs to be able to change to another image programically, and I also need to draw shapes (rectangles and circles) over top of this image programically. The shapes will also change. I have an existing xml layout and would like to use this layout with the programmed image view in it. What's the easiest way to do this? Would it be possible to see a short example?
I figured out how to do this:
Here's how:
ImageView image = (ImageView) findViewById(R.id.mainImageView);
Bitmap bMap = BitmapFactory.decodeFile(imageFileString);
bMap = bMap.copy(Bitmap.Config.ARGB_8888 , true);
Canvas canvas = new Canvas(bMap);
Paint paint = new Paint();
paint.setAntiAlias(true);
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeWidth(1);
paint.setColor(Color.BLUE);
canvas.drawCircle(x, y, radius, paint);
image.setImageBitmap(bMap);
Explanation: The first line gets the ImageView from the layout. I then grab the new image I want displayed using BitmapFactory.decodeFile, where imageFileString is the file location of the new image I want to display. After that I create a new canvas using the bitmap and draw on it. I then display the bitmap to the ImageView using image.setImageBitmap(bMap);.

Categories

Resources