B4J Question help please with smooth scrolling

[madru]

Hi Guys,

i need some serious help, I have to develop a simple program which displays a (or multiple) "flying" object(s), bouncing on the screen edges (resizable) over a constant moving background.
I used Erels bounce sample to get it done, but unfortunately my app was not accepted due to the fact of flickering and no smooth scrolling of the back and the the flying object.


I looked briefly into the game libraries, what I think will be the right approach to get smooth scrolling done, but I got nowhere as I have absolutely 0 experience in game development

can somebody get me into the right direction?

THX

 

[emexes]

my app was not accepted

by whom? Should this post be in B4A or B4I Questions?

 

[madru]

Hi, nope will run on a PC.....

The app will be a kind of test software for camera calibration .....

 

[emexes]

Hi, nope will run on a PC.....

Ok. That was unexpected.

I whipped up a quick one to move standard panels about on the screen, but I agree it could be better.

This post seems to be a step in the right direction, re: smoother animation:

https://www.b4x.com/android/forum/t...arrow-focus-the-user-attention.87877/#content

 

[emexes]

I loaded the Angry Birds X2 demo and ran it with B4J and it is definitely smoother. I assume that the X2 library knows when the screen refresh happens, so it can cleanly update the screen. If you have the time to explore the library, maybe that is a solution.

 

[emexes]

Give this a try. Looks ok on my Windows laptop. There are a few small stutters in the first couple of seconds (perhaps a shakedown of the memory layout and garbage collection?) and after that's it's quite hypnotic

Sub Process_Globals
   
    Type TargetType(P As B4XView, X As Float, Y As Float, VX As Float, VY As Float)
   
    Private fx As JFX
    Private MainForm As Form

    Dim NumTargets As Int = 50
    Dim Target() As TargetType
   
    Dim tmr As Timer
   
    Dim ThisFrameTime As Long
    Dim LastFrameTime As Long
   
    Dim xu As XUI
    Dim TestPanel As B4XView
   
End Sub

Sub AppStart (Form1 As Form, Args() As String)
   
    MainForm = Form1
    MainForm.Show

    TestPanel = xu.CreatePanel("pnlGauge")
    Form1.RootPane.AddNode(TestPanel, 10, 10, 100, 100)
   
    Dim Target(NumTargets) As TargetType
   
    For I = 0 To NumTargets -1
        Target(I).P = xu.CreatePanel("")
        Target(I).X = 300
        Target(I).Y = 300
        Target(I).VX = Rnd(-100, 100)
        Target(I).VY = Rnd(-50, 150)
       
        Dim RandomColor As Int = xu.Color_RGB(Rnd(0,255), Rnd(0, 255), Rnd(0, 255))
        Target(I).P.SetColorAndBorder(RandomColor, 1, xu.Color_Black, 3)
        Form1.RootPane.AddNode(Target(I).P,300, 300, 30, 30)
    Next
   
    LastFrameTime = DateTime.Now
   
    tmr.Initialize("tmr", 16)    '16 ms = 60 frames per second (if all goes well ;-)
    tmr.Enabled = True
   
End Sub

Sub tmr_Tick

    'first attempt - rotating test panel, changing color, changing border corner radius   
   
    Dim T As Float = (DateTime.Now Mod 3000) / 3000 * 2 * cPI
    Dim TempColor As Int = xu.Color_ARGB(255, 128 + Sin(T) * 127, 128 + Cos(T) * 127, 0)
    TestPanel.SetColorAndBorder(TempColor, 5, xu.Color_Black, 25 + Sin(T * 2) * 24)
    TestPanel.Rotation = T / cPI * 360
    TestPanel.Left = Sin(T) * 200 + 300 - 50
    TestPanel.Top = Cos(T) * 200 + 300 - 50
   
    'second attempt - multiple objects
   
    ThisFrameTime = DateTime.Now
    Dim ElapsedTime As Float = (ThisFrameTime - LastFrameTime) / 1000
   
    For I = 0 To NumTargets - 1
        MoveTarget(Target(I), ElapsedTime)
    Next

    LastFrameTime = ThisFrameTime
   
End Sub

Sub MoveTarget(T As TargetType, ElapsedTime As Float)
   
    T.VY = T.VY - 10 * ElapsedTime    'gravity
   
    T.X = T.X + T.VX * ElapsedTime    'move X
    If T.X < 0 Then
        T.X = -T.X
        T.VX = -T.VX
    else if T.X > 600 - T.P.Width Then
        T.X = (600 - T.P.Width) * 2 - T.X
        T.VX = -T.VX
    End If
   
    T.Y = T.Y + T.VY * ElapsedTime    'move Y
    If T.Y < 0 Then
        T.Y = -T.Y
        T.VY = -T.VY
    else if T.Y > 600 - T.P.Height Then
        T.Y = (600 - T.P.Height) * 2 - T.Y
        T.VY = -T.VY
    End If
   
    T.P.Left = T.X
    T.P.Top = 600 - (T.Y + T.P.Height)    'in gravity world, increasing Y means up
   
End Sub

 

[madru]

Will try it

Thx a lot

 

[emexes]

I hadn't implemented the scrolling background yet, but that's just a case of making one or two of the panels as large as the screen is, putting them in the background behind the other panels (by putting them at the top of the views tree) and then moving them about by changing their Left and Top properties.

The reason for having two background panels, rather than one, is so that you can have continuous and limitless scrolling (in one direction, or in two directions with four panels), since the outgoing tile will be leaving the screen on one side just as you need a incoming tile on the other side.