Android Question Effect coins

[MarcoRome]

Hi all.
can anyone give me a hint on how to create a similar effect coins for B4X ( b4a, b4i , b4j )?
- gif ?
- xui2d game ?


Thanks in advance for any suggestion
Marco

 

[toby]

Attachment doesn't work

 

[toby]

It works now and I see the animated gif without doing anything. Earlier I just saw a link stating "View Attachment ...." and clicking on it didn't show anything.

 

[MarcoRome]

one second is the movie just for effect

 

[Erel]

A simple solution is to use an animated gif for this: [B4X] B4XGifView - Cross platform animated gif view

 

[ilan]

do you need it for a game? are you using any libs?
there are a lot of ways you can do it but it would make sense to use the same libs you are using if it is a game or something else. so more info is needed to give you something.

 

[MarcoRome]

Hi Ilan.
I would like to understand how to create this type of effect for some of our apps (they are not games). so any library requires use we are ready to do it.
I have seen some of your works, surely you will have an excellent suggestion to give me
Thank you for your replay.

 

[ilan]

Hi Ilan.
I would like to understand how to create this type of effect for some of our apps (they are not games). so any library requires use we are ready to do it.
I have seen some of your works, surely you will have an excellent suggestion to give me
Thank you for your replay.

ok so if you are not using any special libs i would go for the simple solution (using canvas). give me few minutes please

 

[ilan]

ok i have something that may be a good start for you.
i will explain a little bit what the code does.

so first i create a type object called coin. inside the code i am running a timer and in the timer event i reset the canvas text, movecoins, drawcoins, updatecoinlist.

so each event has his goal.
the resetcanvas just clear the canvas and draw the 2 texts in it.
the movecoins event goes through the coinlist and update each coin object x,y location + check if the coin has reached his target
the drawcoins event draws each coin in his new updated location and also with the updated frame
the updatelistevent checks if a coin has reachtarget true and if so it removes it from the list

i think this is the best way to draw animations in an activity because like this you have a lot of control about the animation. erels suggestion will always draw the same effect
but again it all depends on what you need.

if you have any question about the code let me know. i did it quick so there could be some improvements. like making it more b4x coded.

#Region  Project Attributes
    #ApplicationLabel: Coin Effect
    #VersionCode: 1
    #VersionName: 0.01
    'SupportedOrientations possible values: unspecified, landscape or portrait.
    #SupportedOrientations: unspecified
    #CanInstallToExternalStorage: False
#End Region

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

Sub Process_Globals
    Private RenderTimer As Timer
End Sub

Sub Globals
    Type vector(x As Float, y As Float)
    Type coin(x As Float, y As Float, w As Float, h As Float, sprite(8) As Bitmap, frame As Int, seekVec As vector, tag As Object, targetReached As Boolean)  
    Private xui As XUI
    Private myCanvas As B4XCanvas
    Private mainPnl As Panel
    Private TargetPoint As vector
    Private vpW, vpH As Float      
    Private cointsCollected As Int = 0
    Private frames As Int = 0
    Private coinList As List
    Private coinCounter As Int = 0
    Private coinSprite As Bitmap
    Private minimumSpeed As Float
End Sub

Sub Activity_Create(FirstTime As Boolean)
    vpW = 100%x
    vpH = 100%y
    coinList.Initialize

    mainPnl.Initialize("mainpnl")
    Activity.AddView(mainPnl,0,0,vpW,vpH)
    Activity.Color = Colors.White
    myCanvas.Initialize(mainPnl)
    RenderTimer.Initialize("RenderTimer",25)
    coinSprite.Initialize(File.DirAssets,"coin.png")
    TargetPoint.Initialize
    TargetPoint.x = vpW*0.2
    TargetPoint.y = vpH*0.2
    minimumSpeed = vpW*0.002
   
    RenderTimer.Enabled = True
End Sub

Sub RenderTimer_Tick
    frames = frames + 1
    resteCanvas
    movecoins
    drawcoins
    updatecoinlist
    myCanvas.Invalidate
End Sub

Sub resteCanvas
    myCanvas.ClearRect(myCanvas.TargetRect)
    myCanvas.DrawText("Touch the Screen",vpW/2,vpH/2,xui.CreateDefaultFont(18),xui.Color_Black,"CENTER")
    myCanvas.DrawText(cointsCollected,TargetPoint.x,TargetPoint.y,xui.CreateDefaultFont(18),xui.Color_Black,"LEFT")
End Sub

Sub movecoins
    For Each mycoin As coin In coinList
        Dim stepx As Float = ((TargetPoint.x-mycoin.w)-mycoin.x)/20
        Dim stepy As Float = ((TargetPoint.y-mycoin.h)-mycoin.y)/20
       
        If stepx < 0 Then stepx = Min(stepx,-minimumSpeed)Else stepx = Max(stepx,minimumSpeed)
        If stepy < 0 Then stepy = Min(stepy,-minimumSpeed)Else stepx = Max(stepy,minimumSpeed)
       
        mycoin.x = mycoin.x+stepx
        mycoin.y = mycoin.y+stepy
        If mycoin.x<=TargetPoint.x-(mycoin.w/2) And mycoin.y<=TargetPoint.y-(mycoin.h/2) Then
             mycoin.targetReached = True
             cointsCollected = cointsCollected + 1
        End If
    Next
End Sub

Sub drawcoins
    For Each mycoin As coin In coinList
        If frames Mod 3 = 0 Then mycoin.frame = (mycoin.frame + 1) Mod mycoin.sprite.Length      
        myCanvas.DrawBitmap(mycoin.sprite(mycoin.frame),createRect(mycoin.x,mycoin.y,mycoin.w,mycoin.h))
    Next
End Sub

Sub updatecoinlist
    For i = coinList.Size-1 To 0 Step -1
        Dim mycoin As coin = coinList.Get(i)
        If mycoin.targetReached Then coinList.RemoveAt(i)
    Next
End Sub

Sub createRect(left As Float, top As Float, width As Float, height As Float) As B4XRect
    Dim myrect As B4XRect
    myrect.Initialize(left,top,left+width,top+height)
    Return myrect
End Sub

Sub mainpnl_Touch (Action As Int, X As Float, Y As Float)
    Select Action
        Case 0 'up
           
        Case 1 'down
            createNewCoin(X,Y)
        Case 2 'move
                   
    End Select
End Sub

Sub createNewCoin(posx As Float, posy As Float)
    Dim mycoin As coin
    mycoin.Initialize
    mycoin.x = posx
    mycoin.y = posy
    mycoin.w = vpW*0.05
    mycoin.h = mycoin.w
    mycoin.seekVec = TargetPoint
    mycoin.tag = coinCounter
    mycoin.frame = 0
    mycoin.targetReached = False
    For x = 0 To mycoin.sprite.Length-1
        Dim width As Float = coinSprite.Width/mycoin.sprite.Length
        Dim left As Float = x * width
        mycoin.sprite(x) = coinSprite.Crop(left,0,width,coinSprite.Height)
    Next
    coinCounter = coinCounter + 1
    coinList.Add(mycoin)  
End Sub

Sub Activity_Resume
End Sub

Sub Activity_Pause (UserClosed As Boolean)
End Sub

have fun with the code.

 

[MarcoRome]

Hi Ilan.
Truly an excellent job
Thank you very much.
(I also sent you a small donation).
Have a nice day ?

 

[ilan]

(I also sent you a small donation).

are you crazy? this is too much MacroRome. i have never got such a big donation. wow thank you very much this is very much appreciated.

 

[MarcoRome]

are you crazy? this is too much MacroRome. i have never got such a big donation. wow thank you very much this is very much appreciated.

Thanks again Ilan ?

 

[ilan]

Thanks again Ilan ?

if you need (or anyone else needs) help with the code just let me know.

 

[MarcoRome]

if you need (or anyone else needs) help with the code just let me know.

Thank you very much for your support Ilan