# Galga
~button /#tutorial:/tutorials/galga
Try this tutorial!
~
@autoexpandOff true
{Introduction @unplugged}
In this tutorial, you’ll create a space plane that can fly through bogey spacecraft.
Can you survive the continuous attack?
{Step 1}
✈️ First, we’re going to need a space plane sprite ✈️
► From the ||sprites:Sprites|| category, grab a
||variables(sprites):set [mySprite] to sprite [ ] of kind [Player]|| block and
snap it into the on start block already in the workspace.
► Click on the word ||variables(noclick):[mySprite]|| in the new block to
rename the variable ||variables(noclick):[spacePlane]||.
► Now click inside the grey box in the new block to open the image editor. Draw a plane or choose something from the Gallery.
let spacePlane = sprites.create(img`
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . 8 2 . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . 1 1 1 . . . . . 9 9 9 9 9 . . . . . . . . . . . . . . .
. . . . 2 2 2 2 . . . 9 9 9 9 9 9 9 . . . . . . . . . . . . . .
. 4 4 4 f 8 6 6 6 6 6 6 9 9 9 9 9 6 6 6 . . . . . . . . . . . .
4 4 4 f 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 . . . . . . . . .
. 4 4 f 6 8 8 8 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 . . . . . . . .
. . 4 4 f 8 8 . . . . . 8 8 8 8 6 6 6 6 6 6 6 . . . . . . . . .
. . . . . . . . . . . 8 8 8 8 8 8 2 . . . . . . . . . . . . . .
. . . . . . . . . . . 8 8 8 8 8 2 . . . . . . . . . . . . . . .
. . . . . . . . . . 8 8 8 8 8 2 . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
`, SpriteKind.Player)
{Control your ship}
Great plane! Let’s get it moving!
► Find the ||controller:move [mySprite] with buttons ⊕|| block
and drag it into the bottom of the ||loops:on start|| container.
► Change mySprite to spacePlane.
► Click the ⊕ at the right of the new block so you can change the movement speed to 200 for both vx and vy.
Now your ship will move with the joystick or the W A S D keys.
Try moving your ship around in the simulator!
let spacePlane = sprites.create(img`
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . 8 2 . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . 1 1 1 . . . . . 9 9 9 9 9 . . . . . . . . . . . . . . .
. . . . 2 2 2 2 . . . 9 9 9 9 9 9 9 . . . . . . . . . . . . . .
. 4 4 4 f 8 6 6 6 6 6 6 9 9 9 9 9 6 6 6 . . . . . . . . . . . .
4 4 4 f 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 . . . . . . . . .
. 4 4 f 6 8 8 8 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 . . . . . . . .
. . 4 4 f 8 8 . . . . . 8 8 8 8 6 6 6 6 6 6 6 . . . . . . . . .
. . . . . . . . . . . 8 8 8 8 8 8 2 . . . . . . . . . . . . . .
. . . . . . . . . . . 8 8 8 8 8 2 . . . . . . . . . . . . . . .
. . . . . . . . . . 8 8 8 8 8 2 . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
`, SpriteKind.Player)
// @highlight
controller.moveSprite(spacePlane, 200, 200)
{Stay in screen}
Uh-oh, if you move off screen, your plane disappears!
► To keep your ship from exploring beyond the edges, find
the ||sprites:set [mySprite] [stay in screen] <ON>|| block and
snap it in at the end of the program.
► Change mySprite to spacePlane.
let spacePlane = sprites.create(img`
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . 8 2 . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . 1 1 1 . . . . . 9 9 9 9 9 . . . . . . . . . . . . . . .
. . . . 2 2 2 2 . . . 9 9 9 9 9 9 9 . . . . . . . . . . . . . .
. 4 4 4 f 8 6 6 6 6 6 6 9 9 9 9 9 6 6 6 . . . . . . . . . . . .
4 4 4 f 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 . . . . . . . . .
. 4 4 f 6 8 8 8 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 . . . . . . . .
. . 4 4 f 8 8 . . . . . 8 8 8 8 6 6 6 6 6 6 6 . . . . . . . . .
. . . . . . . . . . . 8 8 8 8 8 8 2 . . . . . . . . . . . . . .
. . . . . . . . . . . 8 8 8 8 8 2 . . . . . . . . . . . . . . .
. . . . . . . . . . 8 8 8 8 8 2 . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
`, SpriteKind.Player)
controller.moveSprite(spacePlane, 200, 200)
// @highlight
spacePlane.setStayInScreen(true)
{Step 4}
The default number of lives for your player is two. Let’s change that to three.
► Snap a ||info:set life to [3]|| block into the
on start container.
let spacePlane = sprites.create(img`
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . 8 2 . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . 1 1 1 . . . . . 9 9 9 9 9 . . . . . . . . . . . . . . .
. . . . 2 2 2 2 . . . 9 9 9 9 9 9 9 . . . . . . . . . . . . . .
. 4 4 4 f 8 6 6 6 6 6 6 9 9 9 9 9 6 6 6 . . . . . . . . . . . .
4 4 4 f 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 . . . . . . . . .
. 4 4 f 6 8 8 8 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 6 . . . . . . . .
. . 4 4 f 8 8 . . . . . 8 8 8 8 6 6 6 6 6 6 6 . . . . . . . . .
. . . . . . . . . . . 8 8 8 8 8 8 2 . . . . . . . . . . . . . .
. . . . . . . . . . . 8 8 8 8 8 2 . . . . . . . . . . . . . . .
. . . . . . . . . . 8 8 8 8 8 2 . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
`, SpriteKind.Player)
controller.moveSprite(spacePlane, 200, 200)
spacePlane.setStayInScreen(true)
// @highlight
info.setLife(3)
{Step 5}
For protection, we need to press a button to launch projectiles at oncoming enemies.
► Drag an ||controller:on [A] button [pressed]|| container into an empty
area of the workspace.
► Snap a
||variables(sprites):set [projectile] to projectile [ ] from [mySprite] with vx [50] vy [50]||
block inside the new container and click inside the grey box to draw your dart.
► Change mySprite to spacePlane. Change vx to [200] and vy to [0].
let spacePlane: Sprite = null
controller.A.onEvent(ControllerButtonEvent.Pressed, function () {
let projectile = sprites.createProjectileFromSprite(img`
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . 5 a a 2 . . . . . . . . .
. . 5 5 a 2 2 2 2 4 4 4 . . . .
. . . 5 a a 2 . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
`, spacePlane, 200, 0)
})
{Step 6 }
Every so often, a bogey should come flying at us.
Let’s add code to make that happen.
► Add a an ||game:on game update every [500] ms|| container to
an empty area in the workspace and change 500 to 1000.
► Inside, snap a
||variables(sprites):set [mySprite] to sprite [ ] of kind [Player]|| block and
change the kind from Player to Enemy.
► Click ||variables(noclick):mySprite|| in the new block to
rename the variable ||variables(noclick):bogey||.
► Click the grey box to draw your enemy ship.
game.onUpdateInterval(1000, function () {
let bogey = sprites.create(img`
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . 9 9 . . . . . 5 . . . .
. . . 9 9 9 9 . . . 5 5 . . . .
2 2 2 2 9 9 2 2 2 2 2 f 4 4 . .
. . 2 2 2 2 5 5 5 2 2 f 4 4 4 .
. . . . . . 5 5 5 . . . . . . .
. . . . . . . 5 5 . . . . . . .
. . . . . . . . 5 . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
`, SpriteKind.Enemy)
})
{Step 7}
The bogey should fly from right to left.
► Grab a ||sprites:set [mySprite] velocity to vx [50] vy [50]|| block and snap
it into the end of your on game update container.
► Replace mySprite with bogey.
► Change the horizontal velocity (vx) to -100 so that it speeds toward the left edge of the screen and change the vertical velocity (vy) to 0 so that the plane doesn’t drift up or down.
game.onUpdateInterval(1000, function () {
let bogey = sprites.create(img`
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . 9 9 . . . . . 5 . . . .
. . . 9 9 9 9 . . . 5 5 . . . .
2 2 2 2 9 9 2 2 2 2 2 f 4 4 . .
. . 2 2 2 2 5 5 5 2 2 f 4 4 4 .
. . . . . . 5 5 5 . . . . . . .
. . . . . . . 5 5 . . . . . . .
. . . . . . . . 5 . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
`, SpriteKind.Enemy)
// @highlight
bogey.setVelocity(-100, 0)
})
{Step 8}
How can you win if bogeys spawn right on top of you?
► Grab a ||sprites:set [mySprite] position to x [0] y [0]|| block
and snap it into the end of your on game update block. Change mySprite
to bogey.
► Change the x location to 160 so the bogey starts at the right-most
edge of the screen, and grab a ||math:pick random [0] to [10]|| block to
replace the y value so enemies come from different heights each time.
► Edit your random block to go from 5 to 115 to use as much of the screen height as possible withough exiting the playable area.
game.onUpdateInterval(1000, function () {
let bogey = sprites.create(img`
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . 9 9 . . . . . 5 . . . .
. . . 9 9 9 9 . . . 5 5 . . . .
2 2 2 2 9 9 2 2 2 2 2 f 4 4 . .
. . 2 2 2 2 5 5 5 2 2 f 4 4 4 .
. . . . . . 5 5 5 . . . . . . .
. . . . . . . 5 5 . . . . . . .
. . . . . . . . 5 . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
`, SpriteKind.Enemy)
bogey.setVelocity(-100, 0)
// @highlight
bogey.setPosition(160, randint(5, 115))
})
{Step 9}
To keep things tidy, we need to destroy enemies who pass us and fly off screen.
► Snap a ||sprites:set mySprite [auto destroy] <OFF>|| block into
the end of the on game update container and toggle <OFF> to <ON>.
► Change mySprite to bogey.
game.onUpdateInterval(1000, function () {
let bogey = sprites.create(img`
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . 9 9 . . . . . 5 . . . .
. . . 9 9 9 9 . . . 5 5 . . . .
2 2 2 2 9 9 2 2 2 2 2 f 4 4 . .
. . 2 2 2 2 5 5 5 2 2 f 4 4 4 .
. . . . . . 5 5 5 . . . . . . .
. . . . . . . 5 5 . . . . . . .
. . . . . . . . 5 . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . .
`, SpriteKind.Enemy)
bogey.setVelocity(-100, 0)
bogey.setPosition(160, randint(5, 115))
// @highlight
bogey.setFlag(SpriteFlag.AutoDestroy, true)
})
{Step 10}
Nothing happens when your dart hits a bogey… Let’s change that.
► Add a ||sprites:on [sprite] of kind [Player] overlaps [otherSprite] of kind [Player]||
container into an empty area of the workspace.
► Change the first sprite kind from Player to Projectile and the otherSprite kind from Player to Enemy.
sprites.onOverlap(SpriteKind.Projectile, SpriteKind.Enemy, function (sprite, otherSprite) {
})
{Step 11}
Now add the blocks to destroy the other sprite.
► Snap a ||sprites:destroy [mySprite]|| block into the empty
on sprite overlaps container.
► Drag the ||variables(noclick):otherSprite|| value from
the header of the on sprite overlaps container and snap it in to replace
mySprite in the destroy block.
► Click the ⊕ at the right of the destroy block and choose the fire effect to add some flair.
sprites.onOverlap(SpriteKind.Projectile, SpriteKind.Enemy, function (sprite, otherSprite) {
// @highlight
otherSprite.destroy(effects.fire, 500)
})
{Step 12}
SCORE!
We should add 1 to the player score for each bogey we hit.
► Snap a ||info:change score by [1]|| block into the end of the
on sprite overlaps container.
sprites.onOverlap(SpriteKind.Projectile, SpriteKind.Enemy, function (sprite, otherSprite) {
otherSprite.destroy(effects.fire, 500)
// @highlight
info.changeScoreBy(1)
})
{Step 13}
What if the bogey hits us?
We need some code that tells the program what to do if the bogey sprite overlaps the player.
► Add a new ||sprites:on [sprite] of kind [Player] overlaps [otherSprite] of kind [Player]||
container into an empty area of the workspace.
► Change the otherSprite kind from Player to Enemy.
sprites.onOverlap(SpriteKind.Player, SpriteKind.Enemy, function (sprite, otherSprite) {
})
{Step 14}
If we’re hit, we want the camera to shake, the bogey to explode, and a life to be removed from our indicator.
► Snap a ||sprites:destroy [mySprite]|| block into the empty
on sprite player overlaps enemy container and replace mySprite with otherSprite.
► Snap a ||scene:camera shake by [4] pixels for [500] ms|| block into the
end of the on sprite player overlaps enemy container.
► Snap a ||info:change life by [-1]|| block into the
end of the on sprite player overlaps enemy container.
sprites.onOverlap(SpriteKind.Player, SpriteKind.Enemy, function (sprite, otherSprite) {
otherSprite.destroy()
scene.cameraShake(4, 500)
info.changeLifeBy(-1)
})
{Complete @fullscreen}
🎆 Congratulations 🎆
You have completed your game!
You can now use the direction buttons to move your space plane and the Ⓐ button to lauch darts!
Open this page at https://austinmara.github.io/galga-lesson/
Use as Extension
This repository can be added as an extension in MakeCode.
- open https://arcade.makecode.com/
- click on New Project
- click on Extensions under the gearwheel menu
- search for https://github.com/austinmara/galga-lesson and import
Edit this project
To edit this repository in MakeCode.
- open https://arcade.makecode.com/
- click on Import then click on Import URL
- paste https://github.com/austinmara/galga-lesson and click import
Metadata (used for search, rendering)
- for PXT/arcade