Android Question Simple animation (my approach seems inefficient)

[ydobemos]

Hello! I have been working on my first App and so far B4A is awesome. However I suspect there are still many things I need to learn about it and the way things work on Android.

My current task involves having a pulsating red orb on a black background. I use the canvas draw functions and a timer to achieve this. However it's really slow. I'm not sure if it's correct to Initialize canvas on every timer tick - but if I don't nothing shows up. Also drawing a background colored circle over the previous one to imitate animation seems kinda awkward.

Hopefully someone can give me a few pointers on how to do this right (preferably using native code as the animation will have to become very slightly more complex (changing color and so on) as further on). Ideally this should run at at least 20 frames per second.

#Region  Activity Attributes
    #FullScreen: True
    #IncludeTitle: False
#End Region

Sub Process_Globals
    'These global variables will be declared once when the application starts.
    'These variables can be accessed from all modules.
   
    Dim Timer1 As Timer

End Sub

Sub Globals
    'These global variables will be redeclared each time the activity is created.
    'These variables can only be accessed from this module.

    Dim Drawhere As Canvas
    Dim RadiusRatio As Double : RadiusRatio = 0.1
End Sub

Sub Activity_Create(FirstTime As Boolean)
    'Do not forget to load the layout file created with the visual designer. For example:
    Activity.LoadLayout("Draw")
    Drawhere.Initialize(Activity)
    Timer1.Initialize("Timer1",25)
    Timer1.Enabled = True
   
End Sub

Sub Activity_Resume

End Sub

Sub Activity_Pause (UserClosed As Boolean)

End Sub

Sub Timer1_Tick
    Drawhere.Initialize(Activity)
    Drawhere.DrawCircle(Activity.Width/2,Activity.Height/2,Activity.Width/2*Sin(RadiusRatio),Colors.Black,True,2)   
    RadiusRatio = RadiusRatio +0.01
    Drawhere.DrawCircle(Activity.Width/2,Activity.Height/2,Activity.Width/2*Sin(RadiusRatio),Colors.Red,True,2)   
End Sub

 

[sorex]

cool, which method did you use?

and as your resulting picture is statis anyway the result might be good enough with that.

 

[ydobemos]

I went with the "draw something dynamic on tiny canvas and then blow the canvas up" method. The code looks like this:

#Region  Activity Attributes
#FullScreen: True
#IncludeTitle: False
#End Region

Sub Process_Globals
'These global variables will be declared once when the application starts.
'These variables can be accessed from all modules.
   
    Dim Timer1 As Timer
    Dim Rec As Rect
   
    Dim Quality As Short
End Sub

Sub Globals
'These global variables will be redeclared each time the activity is created.
'These variables can only be accessed from this module.
   
    Dim Drawhere As Canvas
    Dim RadiusRatio As Double : RadiusRatio = 0.1
    Private ImageView1 As ImageView
End Sub

Sub Activity_Create(FirstTime As Boolean)
'Do not forget to load the layout file created with the visual designer. For example:
    Activity.LoadLayout("Draw")
    Quality = 64
    ImageView1.Width = Quality
    ImageView1.Height = Quality
   
    Drawhere.Initialize(ImageView1)
    Timer1.Initialize("Timer1",17)
    Timer1.Enabled = True
    Rec.Initialize(0,0,Quality,Quality)
End Sub

Sub Activity_Resume
   
End Sub

Sub Activity_Pause (UserClosed As Boolean)
   
End Sub

Sub Timer1_Tick
    'Make canvas small to draw faster and erase previous content
    ImageView1.Width = Quality
    ImageView1.Height = Quality
    Drawhere.DrawRect(Rec,Colors.Black,True,0)
   
    'Make shape larger and draw
    RadiusRatio = RadiusRatio +0.1
    Drawhere.DrawCircle(Quality/2,Quality/2,Quality/2*Abs(Sin(RadiusRatio)),Colors.Red,True,2)
   
    'Stretch canvas image to full size and center
    ImageView1.Width = 100%x
    ImageView1.Height = 100%x
    ImageView1.Left = 0
    ImageView1.Top = 50%y-50%x
   
    'Redraw screen
    Activity.Invalidate
End Sub