-
Du har allerede lært at
definere og bruge dine egne variable.
-
Nu skal vi lære om to specielle variable:
-
mouseX og mouseY.
-
Du behøver ikke selv at
definere disse to variable,
-
og faktisk skal du aldrig gøre det,
for de eksisterer allerede.
-
Ser du, programmet sætter automatisk
værdien af disse variable i baggrunden,
-
og sørger for at værdien af mouseX
er altid x positionen af din musemarkør,
-
og at værdien af mouseY
er altid y positionen af din musemarkør.
-
Det gør det rigtig nemt at lave
seje, interaktive ting
-
baseret på musen's position.
-
Lad os se på den ellipse
jeg tegner her.
-
Lige nu, tegner jeg den
altid ved 200, 200.
-
Hvis jeg bruger mouseX og mouseY,
disse specielle variable,
-
så kan jeg faktisk tegne den
ved mouseX og mouseY.
-
Hvis jeg så nu forsøger at bevæge musen
over tegneområdet, kan du se
-
at ellipsen altid bliver tegnet hvor
min musemarkør er --
-
så den følger min muse rundt.
-
Det er ret sejt; kan du se
hvad jeg tegner? Juhuuu!
-
Hvis du bruger mouseX og mouseY,
skal du sørge for at
-
du bruger dem inde i
draw-funktionen
-
for se hvad der sker
-
hvis vi flytter disse to linjer kode
uden for draw = function ().
-
Kan du se?
-
Nu vil koden her kun blive kørt én gang,
-
så den her ellipse bliver kun tegnet en gang,
-
og den bliver tegnet der hvor musen
nu lige var
-
helt, helt i starten af programmet
-
Det er derfor vi bliver nødt til
bruge dem inde i draw = function ().
-
fordi draw = function ()
er den funktion
-
der bliver kaldt igen og igen
mens vores program kører.
-
Så vi vil have at når den bliver kaldt,
så ser den på den nuværende værdi
-
af mouseX og mouseY, og derefter
tegnet den ellipsen på den position.
-
Hvis du tænker over det, så
er det lidt ligesom en animation --
-
det ændrer sig over tid,
bare på en anden måde.
-
Okay, nu kan vi gøre alle mulige sjove ting.
-
Hvad hvis, i stedet for at tegne den
ved mouseX og mouseY,
-
så tegne vi den stadig ved mouseX,
men holdt mouseY fast ved 300?
-
Nu kan du se at ellipsen
kun følger mit x koordinat,
-
og ignorer hvad jeg gør i y-retningen.
-
Hvad nu hvis jeg går tilbage, og
tegner ved mouseX og mouseY*,
-
men fjerner baggrunden,
bare ved at udkommentere det?
-
Woo! Se nu, jeg har fået en funky malerpensel!
-
Det er ret sejt.
-
Eller, jeg kunne endda ændre
disse variable.
-
Lad os få baggrunden tilbage.
-
Jeg ændrer de variable her,
mouseX og mouseY,
-
og ser hvad der sker.
-
Nu føles det hele rigtig, rigtig mærkeligt.
-
Jeg kan styre med musen,
men der sker det modsatte
-
af hvad jeg forventer den gør.
-
Men det er sejt, du kunne måske forestille
dig et helt spil
-
der handler om at tegne noget
eller gøre noget
-
mens man bruger inverteret musestyring
-
Det var alt om mouseX og mouseY --
faktisk ret sjovt. Hav det godt!
