Android Code Snippet [B4X] [BitmapCreator] Draw radial gradients

Status
Not open for further replies.
Currently BitmapCreator supports linear and cubic gradients. This sub creates a radial gradient:

SS-2018-05-10_12.06.58.png


B4X:
Public Sub FillRadialGradient (bc As BitmapCreator, GradColors() As Int, Rect As B4XRect)
   Dim RGBColor(GradColors.Length) As ARGBColor
   For i = 0 To GradColors.Length - 1
       bc.ColorToARGB(GradColors(i), RGBColor(i))
   Next
   Dim MaxDistance As Int = Ceil(Sqrt(Power(Rect.Width / 2, 2) + Power(Rect.Height / 2, 2)))
   Dim DistanceToColor(MaxDistance) As ARGBColor
   Dim CurrentColorIndex As Int
   Dim LengthOfEachColor As Int = Ceil(MaxDistance / (GradColors.Length - 1))
   Dim c As Int
   For i = 0 To MaxDistance - 1
       Dim l As Float = CurrentColorIndex / LengthOfEachColor
       DistanceToColor(i).a = RGBColor(c).a + l * (RGBColor(c + 1).a - RGBColor(c).a)
       DistanceToColor(i).r = RGBColor(c).r + l * (RGBColor(c + 1).r - RGBColor(c).r)
       DistanceToColor(i).g = RGBColor(c).g + l * (RGBColor(c + 1).g - RGBColor(c).g)
       DistanceToColor(i).b = RGBColor(c).b + l * (RGBColor(c + 1).b - RGBColor(c).b)
       CurrentColorIndex = CurrentColorIndex + 1
       If CurrentColorIndex = LengthOfEachColor Then
           CurrentColorIndex = 0
           c = c + 1
       End If
   Next
   Dim cx As Int = Rect.CenterX
   Dim cy As Int = Rect.CenterY
   For x = Max(0, Rect.Left) To Min(bc.mWidth - 1, Rect.Right - 1)
       Dim dx As Int = Power(x - cx, 2)
       For y = Max(0, Rect.Top) To Min(bc.mHeight - 1, Rect.Bottom - 1)
           Dim distance As Int = Sqrt(dx + Power(y - cy, 2))
           bc.SetARGB(x, y, DistanceToColor(distance))
       Next
   Next
End Sub

Usage example:
B4X:
 Dim bc As BitmapCreator
   Dim scale As Float = 100dip / 100
   bc.Initialize(ImageView1.Width / scale, ImageView1.Height / scale)
   Dim r As B4XRect
   r.Initialize(0, 0, bc.mWidth / 2, bc.mHeight / 2)
   FillRadialGradient(bc, Array As Int(xui.Color_White, xui.Color_Black), r)
   
   r.Initialize(bc.mWidth / 2, 0, bc.mWidth, bc.mHeight / 2)
   FillRadialGradient(bc, Array As Int(xui.Color_Red, xui.Color_Green, xui.Color_Blue), r)
   
   r.Initialize(bc.mWidth / 2, bc.mHeight / 2, bc.mWidth, bc.mHeight)
   FillRadialGradient(bc, Array As Int(xui.Color_Black, xui.Color_White), r)
   
   r.Initialize(0, bc.mHeight / 2, bc.mWidth / 2, bc.mHeight)
   FillRadialGradient(bc, Array As Int(xui.Color_Red, 0xFFFF5200, xui.Color_Yellow, xui.Color_Green, xui.Color_Blue, _
       0xFFBF00FF, 0xFFFF00BB), r)
       
   ImageView1.SetBitmap(bc.Bitmap)
 

Gunther

Active Member
Licensed User
Longtime User
With the update to the new BitmapCreator the 'FillRadialGradient' became an own property of the BitmapCreator. The upper function is not necessary any more.

B4X:
' Brush with RadialGradient
    Dim bc2 As BitmapCreator
    bc2.Initialize( bc.mWidth, bc.mHeight )
    '
    Dim rect As B4XRect
    rect.Initialize( 0, 0, bc2.mWidth-1, bc2.mHeight-1 )
    bc2.FillRadialGradient( Array As Int( Rnd(0xFF000000,-1), Rnd(0xFF000000,-1), Rnd(0xFF000000,-1), Rnd(0xFF000000,-1), Rnd(0xFF000000,-1) ), rect )
 

LucaMs

Expert
Licensed User
Longtime User
Please, specify that in the usage example ImageView1 is a B4XImageView.

Also, change this:
B4X:
bc.Initialize(ImageView1.Width / scale, ImageView1.Height / scale)
to:
B4X:
bc.Initialize(ImageView1.mbase.Width / scale, ImageView1.mbase.Height / scale)


[I tried the example in B4J]
 
Status
Not open for further replies.
Top