This demo shows how to create physical bodies, apply forces to them, set transformations like scale, color
It uses collision detection via the PhysicsJS Engine and Howler.js for sound






// insert your global variables here object renderer number width number height list boundaries list bricks object ball object paddle number count // this method is called on scene start // if you have multiples files per scene, only one of this method is allowed method void OnInit () { width=800 app.setLogicalWidth(800) height=app.getLogicalHeight() renderer=app.createRenderer() object top=renderer.createShapedSprite("rectangle","boundarie",0xff0000,0x000ff,2,width/2,10,width,20) // red outline, blue fill, 2 pixels outline width, position width/2,10 size widthx20 boundaries.push(top) object left=renderer.createShapedSprite("rectangle","boundarie",0xff0000,0x000ff,2,10,20+(height-20)/2,20,height-20) // remember that position of a sprite or a body is its center position boundaries.push(left) object right=renderer.createShapedSprite("rectangle","boundarie",0xff0000,0x000ff,2,width-10,20+(height-20)/2,20,height-20) // so a sprite going from 0 to width has x position width/2, and x size : width boundaries.push(right) for i=0 to 7 for j=1 to 9 object brick=renderer.createSprite("brick","ball-breaker/Arkanoid_1_"+i+".png",j*70+50,i*25+70,70,22) // label, texture, x position, y position, width and height (last two optional) bricks.push(brick) next next ball=renderer.createSprite("ball","ball-breaker/Arkanoid_1_11.png",width/2, height*.75, 20, 20) ball.vx=-2 ball.vy=-2 paddle=renderer.createSprite("paddle","ball-breaker/Arkanoid_1_12.png",width/2, height*.92, 100, 20) } // this method is called each frame // if you have multiples files per scene, only one of this method is allowed method void OnUpdate () { ball.setPosition(ball.getPositionX()+ball.vx,ball.getPositionY()+ball.vy) // move ball according to speed renderer.collideList(ball,"circle",boundaries,"rectangle",true,true) // check collisions between ball, of type circle, with the walls of type rectangle, prevent from overlaping and making it bounce object brick=renderer.collideList(ball,"circle",bricks,"rectangle",true,true) // same for brick, because "bounce" is set to true, vxx and/or vy will change automatically upon collision if brick!=null // if ball has collided a brick renderer.remove(brick) // remove brick sprite from screen bricks.pop(brick) // remove brick sprite from list endif paddle.setPosition(ball.getPositionX(),paddle.getPositionY()) // make paddle follow ball renderer.collide(ball,"circle",paddle,"rectangle",true,true) // check paddle/ball collision, preventing from overlaping and making bounce } // this method is called each time one or more collisions are detected on bodies that you registered collision-detection behavior // if you have multiples files per scene, only one of this method is allowed method void OnCollision(list collisions) { }

Technologies