Time for action – creating stars in the level

We need to add the layout of the stars in the game and have them moving so as to add a little effect to show that they're active. A collision event will need to be applied, which would remove them when the panda collides with them.

1. Create a new function called createStars() and lay out the star objects in a for loop. Add in the "collision" event that will be called by onStarCollision() to remove the stars when they are hit by the panda. Rotate the stars forward and backward at 10 seconds and 1,080 and -1,080 degrees each. This will allow the stars to rotate three full intervals backward and forward. Create the walls for the left and right sides of the screen:

   local createStars = function()
   
     local numOfRows = 4
     local numOfColumns = 12
     local starPlacement = {x = (display.contentWidth  * 0.5) - (starWidth * numOfColumns ) / 2  + 10, y = 50}
   
     for row = 0, numOfRows - 1 do
       for column = 0, numOfColumns - 1 do
   
         -- Create a star
         local star = display.newImage("star.png")
         star.name = "star"
         star.isHit = false
         star.x = starPlacement.x + (column * starWidth)
         star.y = starPlacement.y + (row * starHeight)
         physics.addBody(star, "static", {density = 1, friction = 0, bounce = 0, isSensor = true})
         stars.insert(stars, star)
   
         star.collision = onStarCollision
         star:addEventListener( "collision", star )
   
         local function starAnimation()
           local starRotation = function()
             transition.to( star, { time=10000, rotation = 1080, onComplete=starAnimation })
           end
   
           transition.to( star, { time=10000, rotation = -1080, onComplete=starRotation })
         end
   
         starAnimation()
   
       end
     end
   
     local leftWall  = display.newRect (0, 0, 0, display.contentHeight)
     leftWall.name = "wall"
   
     local rightWall = display.newRect (display.contentWidth, 0, 0, display.contentHeight)
       rightWall.name = "wall"
   
       physics.addBody (leftWall, "static", {bounce = 0.0, friction = 10})
       physics.addBody (rightWall, "static", {bounce = 0.0, friction = 10})
   
       reorderLayers()
   end

What just happened?

The number of stars displayed on screen is set by numOfRows and numOfColumns. A for loop is made to display each individual star object and is placed in the stars group. The collision for star is detected by an event listener through onStarCollision().

The leftWall and rightWall objects have physical properties as well and will take into account the collision detection with the panda.

The stars are animated by starAnimation() and starRotation(). Each function rotates each star object for 10 seconds (10,000 milliseconds), and alternates between 1,080 and -1,080 degrees.