Flicker Free Animation

• You may notice in the bouncing ball example that there is a bit of flicker as it bounces. Much smoother animation can be achieved with just a couple of changes.

• The idea behind so-called flicker free animation is to always work with two picture boxes for the animation (each with the same properties, but one is visible and one is not). The non-visible picture box is our working area where everything is positioned where it needs to be at each time point in the animation sequence. Once everything is properly positioned, we then copy (using BitBlt) the entire non-visible picture box into the visible picture box. The results are quite nice.

Quick Example 10 - Flicker Free Animation

We modify the previous example to make it flicker free.

1. Change the Index property of Picture1 to 0 (zero). This makes it a control array which we can make a copy of. Once this copy is made. Picture1(0) will be our visible area and Picture1(1) will be our non-visible, working area.

2. Add these statements to the Form_Load procedure to create Picture1(1):
   
   Load Picture1(1)
   Picture1(1).AutoRedraw = True

3. Make the italicized changes to the Timer1_Timer event. The ball is now drawn to Picture1(1). Once drawn, the last statement in the procedure copies Picture1(1) to Picture1(0).
   
   Private Sub Timer1_Timer()
   Static BallY As Long
   Dim RtnValue As Long
   Picture1(1).Cls
   BallY = BallY + BallDir * Picture1(1).ScaleHeight / 50
   If BallY < 0 Then
   BallY = 0
   BallDir = 1
   Call sndPlaySound(BongSound, SND_ASYNC Or SND_MEMORY)
   ElseIf BallY + Picture2.ScaleHeight > Picture1(1).ScaleHeight Then
   BallY = Picture1(1).ScaleHeight - Picture2.ScaleHeight
   BallDir = -1
   Call sndPlaySound(BongSound, SND_ASYNC Or SND_MEMORY)
   End If
   RtnValue = BitBlt(Picture1(1).hDC, CLng(0.5 * (Picture1(1).ScaleWidth - Picture2.ScaleWidth)), _
   BallY, CLng(Picture2.ScaleWidth), CLng(Picture2.ScaleHeight), Picture2.hDC, CLng(0), CLng(0), SRCCOPY)
   RtnValue = BitBlt(Picture1(0).hDC, CLng(0), CLng(0), CLng(Picture1(1).ScaleWidth), CLng(Picture1(1).ScaleHeight), Picture1(1).hDC, CLng(0), CLng(0), SRCCOPY)
   End Sub

4. Run the application and you should notice the smoother ball motion.

Quick Example 11 - Horizontally Scrolling Background

Most action arcade games employ scrolling backgrounds. What they really use is one long background picture that wraps around itself. We can use the BitBlt API function to generate such a background. Here’s the idea. Say we have one long bitmap of some background (here, an underseascape created in a paint program and saved as a bitmap file):

At each program cycle, we copy a bitmap of the size shown to a destination location. As X increases, the background appears to scroll. Note as X reaches the end of this source bitmap, we need to copy a little of both ends to the destination bitmap.

1. Start a new application. Add a horizontal scroll bar, two picture boxes, and a timer control. Your form should resemble:
   
   

2. For Picture1 (the destination), set the ScaleMode property to Pixel. For Picture2, set ScaleMode to Pixel, AutoSize and AutoRedraw to True, and Picture to Undrsea1.bmp (provided on class disk). Set Picture1 Height property to the same as Picture2. Set Timer1 Interval property to 50. Set the Hscroll1 Max property to 20 and LargeChange property to 2. After setting properties, resize the form so Picture2 does not appear.

3. Copy and paste the BitBlt Declare statement from the API text viewer. Also, copy the SRCCOPY constant:

4. Attach the following code to the Timer1_Timer event:
   
   Private Sub Timer1_Timer()
   Static x As Long
   Dim AWidth As Long
   Dim RC As Long
   'Find next location on Picture2
   x = x + HScroll1.Value
   If x > Picture2.ScaleWidth Then x = 0
   'When x is near right edge, we need to copy
   'two segments of Picture2 into Picture1
   If x > (Picture2.ScaleWidth - Picture1.ScaleWidth) Then
   AWidth = Picture2.ScaleWidth - x
   RC = BitBlt(Picture1.hDC, CLng(0), CLng(0), AWidth, CLng(Picture2.ScaleHeight), Picture2.hDC, x, CLng(0), SRCCOPY)
   RC = BitBlt(Picture1.hDC, AWidth, CLng(0), CLng(Picture1.ScaleWidth - AWidth), CLng(Picture2.ScaleHeight), Picture2.hDC, CLng(0), CLng(0), SRCCOPY)
   Else
   RC = BitBlt(Picture1.hDC, CLng(0), CLng(0), CLng(Picture1.ScaleWidth), CLng(Picture2.ScaleHeight), Picture2.hDC, x, CLng(0), SRCCOPY)
   End If
   End Sub

5. Run the application. The scroll bar is used to control the speed of the scrolling (the amount X increases each time a timer event occurs).