Game Lab er JavaScript med spil-funktioner ovenpå. Alt fra JavaScript cheat sheet'et (variable, lister, funktioner) virker også her. Hvert eksempel står alene.
// Køres automatisk ca. 30 gange i sekundet
function draw() {
background("skyblue"); // ryd skærmen
// ... alt spil-logik her ...
drawSprites(); // tegn alle sprites
}
draw() kører i en uendelig løkke. Alt (bevægelse, kollision, input-tjek) skal ligge i draw, og du skal altid rydde med background() først og kalde drawSprites() sidst.Banen er 400×400 pixels: World.width = 400, World.height = 400. World.frameRate = billeder/sekund (ca. 30), World.seconds = sekunder siden start.
var spiller = createSprite(200, 200); // x, y
spiller.setAnimation("rumskib"); // fra Animation-fanen
spiller.scale = 0.5; // halv størrelse
spiller.visible = false; // skjul
// Tegn en firkant selv uden animation:
var mur = createSprite(50, 300);
mur.width = 100;
mur.height = 20;
mur.shapeColor = "gray";
Animationer laves i Animation-fanen (upload eller tegn). Skal et sprite bare være en kasse, sæt width/height og shapeColor i stedet.
// Sæt fart – Game Lab flytter selv spritet
spiller.velocityX = 4; // højre (negativ = venstre)
spiller.velocityY = -3; // op (negativ = op!)
bold.setVelocity(5, 2); // begge på én gang
bold.rotationSpeed = 5; // drej løbende
// Stop: farten ligger i y
bold.setVelocity(0, 0);
Husk: y-aksen peger nedad – velocityY = -3 flytter opad, og +3 nedad. Sæt farten én gang, ikke hver frame; Game Lab flytter spritet selv i hver draw-cyklus.
function draw() {
background("white");
if (keyDown("right")) spiller.x += 4;
if (keyDown("left")) spiller.x -= 4;
if (keyWentDown("space")) { // én gang pr. tryk
playSound("sound://skyd.mp3");
}
// Mus
spiller.x = World.mouseX;
spiller.y = World.mouseY;
drawSprites();
}
keyDown er sand hele tiden tasten holdes nede (bevægelse). keyWentDown er kun sand i én frame pr. tryk (skyd, hop). Taster: "up" "down" "left" "right" "space" og bogstaver "a".."z".
// 1. Tjek om de rører (sand/falsk)
if (spiller.isTouching(mønt)) {
point++;
mønt.destroy();
}
// 2. Fysik: bloker gennemtrængning
spiller.collide(mur);
// 3. Prel afbage
bold.bounce(vægge);
// 4. Overlap uden fysik (kan gå igennem)
fjende.overlap(spiller, ramt);
isTouching = spørg om røring. collide = kan ikke gå igennem. bounce = prel af. overlap = detekter uden fysik, med valgfri callback. Vælg efter hvad spillet skal føles som.
var mønter = createGroup();
for (var i = 0; i < 10; i++) {
var m = createSprite(randomNumber(0, 400),
randomNumber(0, 400));
m.setAnimation("mønt");
mønter.add(m);
}
// Kollision for HELE gruppen på én gang:
spiller.overlap(mønter, function(spil, mønt) {
mønt.destroy(); // fjern kun den ramte
point++;
});
Grupper gør, at du kan kollidere mod 10 (eller 100) mønter uden én if-sætning pr. mønt. Callbacken får den enkelte sprite som parameter – kald destroy() på den, ikke hele gruppen. Brug også gruppe.setVelocityEach(2) osv.
var point = 0;
function draw() {
background("black");
// Score øverst
fill("white");
textSize(20);
text("Point: " + point, 20, 30);
text("Tid: " + World.seconds, 300, 30);
// Game over efter 30 sekunder
if (World.seconds >= 30) {
textAlign(CENTER);
textSize(40);
text("GAME OVER", 200, 200);
noLoop = true; // se faldgruber!
}
drawSprites();
}
createEdgeSprites(); // usynlige vægge i kanterne
bold.bounceOff(edges); // prel af kanterne
// Rul verden, ikke spilleren:
camera.x = spiller.x; // kamera følger spiller
// Baggrund der bevæger sig (parallax):
sky.velocityX = -1; // langsommere end spiller
camera.x/y flytter hele verdenen – bruges til scrollende levels. camera.off() slår det fra igen.
function draw() {
background(240);
fill("red"); // fyldfarve
stroke("black"); // stregfarve
strokeWeight(3);
rect(50, 50, 100, 80); // x, y, bredde, højde
ellipse(200, 100, 60); // cirkel/ellipse
noFill();
line(0, 0, 400, 400); // diagonal streg
drawSprites();
}
playSound("sound://category_explosion/boom.mp3");
playSound("musik.mp3", true); // true = loop
stopSound(); // stop alle lyde
playSpeech("Game over", "male", "da-DK");
createSprite(x, y)ny sprite på positionen
setAnimation(navn)sæt udseende fra Animation-fanen
drawSprites()tegn alle sprites (sidst i draw)
background(farve)ryd skærmen (først i draw)
velocityX / velocityYfart; negativ y = opad
keyDown(tast)holdes tasten nede?
keyWentDown(tast)ét tryk (én frame)
isTouching(s)rører de hinanden?
collide / bouncefysik-blokering / prel
overlap(s, f)detekter + kald f ved ram
createGroup()samling af ens sprites
destroy()fjern spritet for altid
World.secondssekunder siden spilstart
text(tekst, x, y)skriv på canvas
drawSprites() → usynlige sprites. Glemt background() → stribe af kopier.velocityX = 4 hver frame i draw → virker, men x = x + 4 er bedre til tastestyrede bevægelser.velocityY += 0.5.createSprite inde i draw() → tusindvis af sprites og spillet fryser. Opret altid uden for draw.noLoop() – brug en variabel: var gameOver = true; og spring logikken over i draw.sprite.debug = true viser kollisions-boksen.