Spelprogrammering.nu - Ritprogram

Från Wikiskola
Hoppa till navigering Hoppa till sök

Bygg ett ritprogram

Enkelt ritprogram

enkelt ritprogram från exemplen i kapitel 2.

Undersök hur du kan

  • byta färg att rita med genom att ändra i koden
  • ändra storlek på ritfläcken

Mer funktionellt ritprogram

Titta på mitt utvecklade ritprogram. Det finns i arkivs och heter: Ritprogram med flera färger (hemsida öppnas)
Programmet är inte klart men det visar på (halv)-färdiga lösningar som du kan bygga vidare på.
Utveckla det med fler färger och att man byter färg med en tangenttryckning.
Lägg till färgade boxar och text i en palett.
Byt färg om man pekar på en box.
  • Bygg vidare på ritprogrammet med paletter att klicka på, punktstorlek, mm.

En pulserande fläck

<source>

 var x0 = 150;
 	  y0 = 200;
 	radie = 20;
 bredd = 100;
 höjd = 200;
 
 function update()
 {
   
   clearScreen()  // ritar om allt nedanför
   rectangle(x0 - bredd /2, y0 - höjd / 2, 
             bredd, höjd, "pink");
   
   circle(x0, y0, radie +  2, "red");
   circle(x0, y0, radie, "green");
   
   //      x0 = x0 + 0.3;
   //   y0 = y0 + 0.3;
   
   //     radie = radie + 0.3;
   
   //   if (radie >= 40) {radie = 0};
 }

</source>

Tips för tusentals färger

Nedan finns ett exempel på kod som ger tusentals färger med hjälp av variablerna r, g, b.


  var r = 20;
      g = 30;
      b = 10;
  function update()
  {
	fill("green")
    triangle(170, 10, 30, 100, 320, 100, mixColor(r, g, b))

    r = r + 6;
    g = g + 2;
    b = b + 3;
    
    if (r >= 255) {r = 0};
    if (g >= 255) {g = 0};
    if (b >= 255) {b = 0};
   
  }

Om att hämta hem kod

På Mac hämtar du koden genom att klicka på Utvecklare och visa källa. Ett alternativ är att högerklicka på länken i arkivet och ladda ner sidan till din dator


Filen Advanced.js

här hittar du en del objekt som används i koden.

http://spelprogrammering.nu/advanced.js