Android Question Bitmap editing to create a image that appears circle

BedDweller

Member
Licensed User
Longtime User
Is there a way to alter a bitmap so that all but the center circle is transparent?
Eg http://art.ngfiles.com/images/107000/107057_shikashi_transmutation-circle.jpg (not my image, just found it on google) where the black on the outside of the outer ring is transparent?

The goal of this is to have a widget that downloads a image and displays the circle image showing the homescreen in the background.

one way I was thinking about achieving this is to overlay a 'mask' image in a unused color then to make that color transparent, however I'm not sure how to achieve the merging of two images and changing one color into another after the merge. (currently doing similar to this for the actual app where the mask is just another imageview ontop of the downloaded image and is the same color as the background).

I've looked into Accelerated surfaces and few other libs but they ether had too much stuff for me to find what i needed, or to complex for using it on a widget (or at least for me to use it in a widget ><'')

Thank you for reading.
 

Erel

B4X founder
Staff member
Licensed User
Longtime User
You can use this code to draw a round image at the center (with transparent borders):



B4X:
Sub Activity_Create(FirstTime As Boolean)
   Dim cvs As Canvas = CreateBitmap
   DrawRoundBitmap(cvs, LoadBitmap(File.DirAssets, "1.jpg"))
   Activity.SetBackgroundImage(cvs.Bitmap)
End Sub

Sub CreateBitmap As Canvas
   Dim bmp As Bitmap
   bmp.InitializeMutable(200dip, 200dip)
   Dim cvs As Canvas
   cvs.Initialize2(bmp)
   Dim r As Rect
   r.Initialize(0, 0, bmp.Width, bmp.Height)
   cvs.DrawRect(r, Colors.Transparent, True, 0)
   Dim p As Path
   p.Initialize(0, 0)
   Dim jo As JavaObject = p
   Dim x = 100dip, y = 100dip, radius = 100dip As Float
   jo.RunMethod("addCircle", Array As Object(x, y, radius, "CW"))
   cvs.ClipPath(p)
   Return cvs
End Sub

Sub DrawRoundBitmap (cvs As Canvas, bmp As Bitmap)
   Dim r As Rect
   r.Initialize(0, 0, cvs.Bitmap.Width, cvs.Bitmap.Height)
   cvs.DrawBitmap(bmp, Null, r)
End Sub

You can call DrawRoundBitmap multiple times.
 
Upvote 0

BedDweller

Member
Licensed User
Longtime User
Ok, Is it possible to use this method with in a widget service module, as i keep getting java.lang.NullPointerException
after copy pasting from the main class to the widget class and setting everything else up so no errors show. and i belive it might have something to do with this bit of code
B4X:
Sub JobDone (Job As HttpJob)
If Job.Success = True Then
    Dim cvs As Canvas = CreateBitmap
    DrawRoundBitmap(cvs, Job.GetBitmap)
    RV.SetImage("imgNow", cvs.Bitmap)
    RV.UpdateWidget
Else
    Log("Error")
    ToastMessageShow("Error", True)
End If
Job.Release
End Sub

Mainly the setting image part, but commenting out the Dim cvs and DrawRoundBitmap, and changing cvs.bitmap to job.getbitmap makes it work but without the circle trimming.
 
Upvote 0

BedDweller

Member
Licensed User
Longtime User
I belive it was because I was trying to use 50%x within the widget class that was causing it. And ether way, was talking to someone from tech and he got me onto the RSImageProcessing lib and to achieve the same effect as your code just initializeing RSImageEffects and then using RSIE.Roundcorner(bitmap, bitmap.width/2) also results in a circle image and is exectued alot faster (used both with the gif decomplier lib for my loading gif and RSEP had little effect on the loading speed while your method made it about 1/2 the speed)

(Sorry if thats just a block of text, sent using my phone)

Edit: also RSIP also had no effect on image quality, nor had a pixilated effect with the circle
 
Upvote 0
Cookies are required to use this site. You must accept them to continue using the site. Learn more…