Android Question Creating a transparent overlay with rounded corners

Martin Larsen

Active Member
Licensed User
As stated in this post I need to make an image slider with rounded corners. That catch is that there are some rotated and shaded labels over the images and these should have round corners as well. On this sceendump the label corners are not rounded because only the images themselves are rounded.



The solution I found worked best is to simply overlay the whole bunch with a transparent mask as shown below:


Now, this is quite tedious to create and takes a bit trial and error, so how do I create this programmatically?

My guess is that a modified version of CreateRoundRectBitmap should be able to do it.
 

sorex

Expert
Licensed User
yes, first rectfill with blue then draw the rounded rectangle with colors.transparent.

that way you can have your bend always correct and sharp unlike resizing a premade image.
 

Erel

Administrator
Staff member
Licensed User


B4X:
Sub CreateEdge (BackgroundBitmap As B4XBitmap, TargetView As B4XView)
    Dim bc As BitmapCreator
    bc.Initialize(TargetView.Width, TargetView.Height)
    bc.CopyPixelsFromBitmap(BackgroundBitmap)
    bc.DrawRectRounded(bc.TargetRect, xui.Color_Transparent, True, 0, 20dip)
    bc.SetBitmapToImageView(bc.Bitmap, TargetView)
End Sub
B4J example is attached.
 

Attachments

LucaMs

Expert
Licensed User
I'm sorry, I have to write it...
Erel, why are you able to write that code, probably in a couple of minutes or less, but you can't name the file CreateEdge?
😄

No answers needed 😁
 

LucaMs

Expert
Licensed User
Much more seriously...

It seems that anti-aliasing is not being applied; is there a solution for this?
 

Erel

Administrator
Staff member
Licensed User
There is no simple solution for antialiasing in this case. It is related to the way transparent colors are drawn. It will be less noticeable on mobile devices.
 

LucaMs

Expert
Licensed User
Yes, I was "drawing" (before your answer)...

1578926223077.png


The second pane is created by Designer
 

Martin Larsen

Active Member
Licensed User
Thanks, Erel, it works perfectly. The antialiasing is not a problem at all, you don't notice it on the phone. You have to make a screendump and zoom in to see it.
 
Top