Actionscript 3 tutorials?

[GunnarGul]

Hei!

 

Jeg driver å lærer meg flash, og har behov for å bli flinkere med programmeringen. Prøver å finne meg en side med gode tutorials, men meste parten er enten gammelt eller urelevant for meg. Mange sider har tutorials for hvordan man lager forskjellige komponenter, men ingen som handler om programmering i actionscript 3 generelt.

 

For øyeblikket kan jeg bare enkle ting, som å lage knapper, bruke muselyttere, og å definere variabler etc på meget enkelt nivå.

 

Noen som kan annbefale noen gode grunnlegene tutorials der man lærer seg å bruke looper osv, og deretter mer avanserte ting etterhvert?

 

Linker til tutorials der man lager noen fete websider hadde også vært fint.

 

Takker for alle svar

[RAD1V]

God bok, den lærte meg mye.

http://www.bokklubben.no/SamboWeb/produkt....oduktId=2982915

 

Tutvid sin youtube kanal har også lært meg en del

http://www.youtube.com/user/tutvid#p/c/A6E5FB31FA1DBDD6

 

 

så spør du her om du skulle sitter fast

[GunnarGul]

Takk for svar!

 

Nå må jeg nesten le litt av meg selv. Den boka har jeg faktisk.

 

Går på IT2, men har en helt elendig lærer, og vi gjør ingenting i timen, så har ikke engang tenkt på å bruke boka. Har for det meste surret rundt på egen hånd og lett etter tutorials.

 

Skal sjekke ut de youtube videoene også, men holder meg til boka først.

[GunnarGul]

Nå sitter jeg litt fast. Den ene oppgaven i boka går ut på å at man skal kunne lage en strek ved å dra musa og så slippe den. Omtrent som når man lager streker i paint.

 

Koden jeg har laget så langt er som følger:

var startx:Number = mouseX
var starty:Number = mouseY

stage.addEventListener(MouseEvent.MOUSE_MOVE, flyttMus);
stage.addEventListener(MouseEvent.MOUSE_DOWN, musNed);

function musNed (evt:MouseEvent) {
startx = mouseX
starty = mouseY
}

function flyttMus(evt:MouseEvent) {
graphics.clear();
graphics.lineStyle(2,0x000000,1);
graphics.moveTo(startx, starty);
graphics.lineTo(mouseX, mouseY);
evt.updateAfterEvent();
}

 

Denne koden lager en strek når man trykker med musa, men streken fortsetter å følge musa etter man har sluppet den. Hvis man klikker igjen så starter det en ny strek som har utgangspunkt der man trykket.

 

Hva kan jeg gjøre for å fikse dette?

[RAD1V]

var startx:Number=mouseX;
var starty:Number=mouseY;
var aktiv:Boolean=false;


stage.addEventListener(MouseEvent.MOUSE_MOVE, flyttMus);
stage.addEventListener(MouseEvent.MOUSE_UP, musOpp);
stage.addEventListener(MouseEvent.MOUSE_DOWN, musNed);

function musNed(evt:MouseEvent) {
startx=mouseX;
starty=mouseY;
aktiv=true;
}
function musOpp(evt:MouseEvent) {
aktiv=false;
}

function flyttMus(evt:MouseEvent) {
if (aktiv) {
	graphics.clear();
	graphics.lineStyle(2,0x000000,1);
	graphics.moveTo(startx, starty);
	graphics.lineTo(mouseX, mouseY);
	evt.updateAfterEvent();
}
}

 

Slik?

 

Forklarer koden seg selv?

[GunnarGul]

Slik ja! Takk!

 

Koden forklarer seg selv ja

Endret 22. januar 2010 av GunnarGul

[GunnarGul]

Hva må jeg skrive for at jeg skal kunne lage flere streker?

 

Har prøvd meg litt fram med å lage et nytt movieclip kalt "strek":

 

var strek:MovieClip = new MovieClip();

 

strek.graphics.clear();

strek.graphics.lineStyle(2,0x000000,1);

strek.graphics.moveTo(startx, starty);

strek.graphics.lineTo(mouseX, mouseY);

evt.updateAfterEvent();

addChild(strek);

 

etc

 

Det ser ikke ut til å gjøre noe forskjell, og jeg forstår hvorfor, men hva mer må jeg gjøre? Er det riktig tankegang at jeg må lage et movieclip som heter strek, eller er det like greit å bare bruke graphics.blabla?

[RAD1V]

var startx:Number=mouseX;
var starty:Number=mouseY;
var aktiv:Boolean=false;


stage.addEventListener(MouseEvent.MOUSE_MOVE, flyttMus);
stage.addEventListener(MouseEvent.MOUSE_UP, musOpp);
stage.addEventListener(MouseEvent.MOUSE_DOWN, musNed);

function musNed(evt:MouseEvent) {
startx=mouseX;
starty=mouseY;
aktiv=true;
}
function musOpp(evt:MouseEvent) {
aktiv=false;
var strek:MovieClip = new MovieClip();
strek.graphics.lineStyle(2,0x000000,1);
strek.graphics.moveTo(startx, starty);
strek.graphics.lineTo(mouseX, mouseY);
addChild(strek);
}

function flyttMus(evt:MouseEvent) {
if (aktiv) {
	graphics.clear();
	graphics.lineStyle(2,0x000000,1);
	graphics.moveTo(startx, starty);
	graphics.lineTo(mouseX, mouseY);
	evt.updateAfterEvent();
}
}

 

 

Som du ser her; den strikken man ser når man drar musa, er ikke direkte relatert til streken som står igjen når man begynner å dra en ny, det er to forskjellige funksjoner

Endret 22. januar 2010 av datastol

[Arti-Ravnos]

var startx:Number=mouseX;
var starty:Number=mouseY;

stage.addEventListener(MouseEvent.MOUSE_DOWN, musNed);
[b]// Fjernet lytterne her[/b]

function musNed(evt:MouseEvent) {
   startx=mouseX;
   starty=mouseY;
   [b]
   //Registrer lyttere
   stage.addEventListener(MouseEvent.MOUSE_MOVE, flyttMus);
   stage.addEventListener(MouseEvent.MOUSE_UP, musOpp);
   [/b]
}
function musOpp(evt:MouseEvent) {
   [b]
   //Fjern lyttere
   stage.removeEventListener(MouseEvent.MOUSE_MOVE, flyttMus);
   stage.removeEventListener(MouseEvent.MOUSE_UP, musOpp);
   [/b]
   var strek:MovieClip = new MovieClip();
   strek.graphics.lineStyle(2,0x000000,1);
   strek.graphics.moveTo(startx, starty);
   strek.graphics.lineTo(mouseX, mouseY);
   addChild(strek);
}

function flyttMus(evt:MouseEvent) {
       graphics.clear();
       graphics.lineStyle(2,0x000000,1);
       graphics.moveTo(startx, starty);
       graphics.lineTo(mouseX, mouseY);
       evt.updateAfterEvent();
}

 

Hadde det ikke vært bedre, med tanke på bruk av minne (irrelevant i dette eksempelet, men viktig ved større prosjekter) og bare lytte på MOUSE_UP og MOUSE_DOWN hendelser dersom musen er presset ned..? Så kan du fjerne dem igjen når musen løftes.

Eneste forskjellen mellom

stage.addEventListener(MouseEvent.MOUSE_UP, musOpp);

og

stage.removeEventListener(MouseEvent.MOUSE_UP, musOpp);

er at ordet add er byttet ut med remove. Det er viktig at argumentene (det som står inne i parantesene) er like.

 

Nå er det sikkert lettere for en nybegynner å bare bruke en boolean verdi, men tenkte det kunne være greit å vise hvordan du kan optimisere koden. Det har ingen hensikt å kalle flyttMus() og musOpp() når musen ikke er presset ned.

 

Endret 24. januar 2010 av Arti-Ravnos

[RAD1V]

Enig i at din måte er bedre ja.

Takk for tipset

[GunnarGul]

Takk for svar

 

Har vært borte en liten stund, så har ikke fått vært innom her før nå.

 

Skjønte begge metodene og er enig at nummer 2 var best. Visste ikke om removeEventListener, så nå har jeg lært noe nytt

[GunnarGul]

Nå har jeg laget et program der man kan velge mellom å lage streker, tegne, og lage sirkler.

 

Programmet fungerer fint, men jeg lurer på om det er mulig å forbedre eller optimalisere koden.

 

Programmet består av en meny, inne i menyen er det 3 knapper og 3 frames(en for hver knapp) kaldt tab1, tab2, tab3. På hver frame ligger det forskjellig kode, en for tegning av streker, 1 for tegning, og en for å lage sirkler.

 

I tab1, ligger følgende kode:

 

stop();

stage.removeEventListener(MouseEvent.MOUSE_MOVE, flyttMus5);
stage.removeEventListener(MouseEvent.MOUSE_UP, musOpp5);
stage.removeEventListener(MouseEvent.MOUSE_DOWN, musNed5);
stage.removeEventListener(MouseEvent.MOUSE_DOWN, musNed9);
stage.removeEventListener(MouseEvent.MOUSE_UP, musOpp9);

var startx:Number=mouseX;
var starty:Number=mouseY;

stage.addEventListener(MouseEvent.MOUSE_DOWN, musNed);

function musNed(evt:MouseEvent) {
startx=mouseX;
starty=mouseY;

stage.addEventListener(MouseEvent.MOUSE_MOVE, flyttMus);
stage.addEventListener(MouseEvent.MOUSE_UP, musOpp);
}

function musOpp(evt:MouseEvent) {

stage.removeEventListener(MouseEvent.MOUSE_MOVE, flyttMus);
stage.removeEventListener(MouseEvent.MOUSE_UP, musOpp);

var strek:MovieClip = new MovieClip();
strek.graphics.lineStyle(2,0x000000,1);
strek.graphics.moveTo(startx, starty);
strek.graphics.lineTo(mouseX, mouseY);
addChild(strek);
}

function flyttMus(evt:MouseEvent) {
	graphics.clear();
	graphics.lineStyle(2,0x000000,1);
	graphics.moveTo(startx, starty);
	graphics.lineTo(mouseX, mouseY);
	evt.updateAfterEvent();
}

 

I tab2 ligger:

stop();
stage.removeEventListener(MouseEvent.MOUSE_DOWN, musNed);
stage.removeEventListener(MouseEvent.MOUSE_MOVE, flyttMus5);
stage.removeEventListener(MouseEvent.MOUSE_UP, musOpp5);
stage.removeEventListener(MouseEvent.MOUSE_DOWN, musNed5);

stage.addEventListener(MouseEvent.MOUSE_DOWN, musNed9);
stage.addEventListener(MouseEvent.MOUSE_UP, musOpp9);

var strek:MovieClip = new MovieClip();

function musNed9 (evt:MouseEvent) {
stage.addEventListener(MouseEvent.MOUSE_MOVE, flyttMus9);
strek.graphics.moveTo(mouseX, mouseY);
}

function flyttMus9(evt:MouseEvent) {
strek.graphics.lineStyle(2,0x000000,1);
strek.graphics.lineTo(mouseX, mouseY);
evt.updateAfterEvent();

addChild(strek);
}

function musOpp9(evt:MouseEvent) {
stage.removeEventListener(MouseEvent.MOUSE_MOVE, flyttMus9);
}

 

I tab3 ligger:

stop();
stage.removeEventListener(MouseEvent.MOUSE_DOWN, musNed);
stage.removeEventListener(MouseEvent.MOUSE_DOWN, musNed9);
stage.removeEventListener(MouseEvent.MOUSE_UP, musOpp9);

var startx3:Number=mouseX;
var starty3:Number=mouseY;

stage.addEventListener(MouseEvent.MOUSE_DOWN, musNed5);

function musNed5(evt:MouseEvent) {
startx=mouseX;
starty=mouseY;

stage.addEventListener(MouseEvent.MOUSE_MOVE, flyttMus5);
stage.addEventListener(MouseEvent.MOUSE_UP, musOpp5);
}

function musOpp5(evt:MouseEvent) {
stage.removeEventListener(MouseEvent.MOUSE_MOVE, flyttMus5);
stage.removeEventListener(MouseEvent.MOUSE_UP, musOpp5);

var radius:Number = Math.sqrt((mouseX - startx)*(mouseX - startx) + (mouseY - starty)*(mouseY - starty));

var sirkel:MovieClip = new MovieClip;
sirkel.graphics.lineStyle(2,0x000000,1);
sirkel.graphics.drawCircle(startx,starty,radius);

addChild(sirkel);
}

 

 

Finnes det en bedre måte å gjøre dette på? Er det mulig å ha all koden i samme frame, uten å måtte legge alt på forskjellige frames?

 

I tillegg så er det mulig å tegne på menyen. Er det mulig å forhindre dette?

 

Skjønner godt hvis ingen gidder å svare på dette. Kanskje litt mye å lese bare for å hjelpe meg

 

EDIT: Hvordan gjør jeg sånn at man kan scrolle i "code" vinduene?

ost.zip

Endret 27. januar 2010 av GunnarGul

[RAD1V]

Akkurat som du har gitt variablene dine angitte datatyper(:Number etc.), kan du gi funksjonene dine :void som datatype, fordi ingen av funksjonene dine returnerer noe.

 

f.eks.:

 

function flyttMus5(evt:MouseEvent):void {
}

 

_______________________________________________

 

 

Du kan ha all koden på samme plass ved å for eksempel teste hvor på tidslinja du er:

 

if (currentFrame==10) {
trace("tab 2!");
}

_______________________________________________

 

 

Forumkode:

 

bruk:

[kodeboks]
kode
[/kodeboks]


istedenfor

[code]
kode
[ /code]

 

_______________________________________________

 

Personlig ville jeg ikke lagt koden inne i meny-movieclipet. Gir du meny instansen instanse navnet "meny", refererer du til kanpp1 ved å skrive meny.kanpp1, istedenfor bare knapp1. Enda mer ryddig er det å legge koden i egen .as fil, men et kommer ikke før senere i boka.

 

_______________________________________________

 

Ikke tegn på menyen:

 

function blablabla(evt:MouseEvent):void {
if(evt.currentTarget=="[object meny_1]"){
	trace("Her kan du ikke tegne");
}
}

 

 

Du kan fortsatt tegne over menyen om du begynner å tegne ved siden av.

Jeg har ikke brukt de setChildIndex etc. funksjonene på lenge, så gidder ikke å fundere på hvordan man skal formulere det nøyaktig, men i korte ord blir slik at hele meny movieclipet(som trenger intanse navn) alltid skal øverst(høyest nummer) i displaylista. Dette tror jeg det er enklest å gjøre utenfor movieclipet, altså fra hovedtidslinja.

 

Om du fortsatt vil ha koden inne i menye instansen må du forandre:

 

addChild(blabla);

 

til:

 

stage.addChild(blabla);

 

Funker det?

Endret 27. januar 2010 av datastol

[GunnarGul]

Heisann. Har ikke vært innom her på en liten stund, men nå trenger jeg hjelp igjen.

 

Oppgaven lyder som følger:

 

Forandre sirkel-funksjonen slik at annenhver sirkel får forskjellig farge. La den andre fargen også være en parameter i funksjonen.

 

Koden i den originale sirkel oppgaven brukte jeg koden:

 

function sirkler(x:int, y:int, radius:Number, antall:uint, farge:Number, alfa:Number) {

var radiusTrekk:Number = radius/antall;

var teller:int = 0;

 

while(teller < antall) {

graphics.lineStyle(3,farge,alfa);

graphics.drawCircle(x, y, radius);

radius = radius - radiusTrekk;

alfa = alfa + 0.1;

teller++;

}

}

sirkler(200,200,300,20,0x00ff00,0);

 

Hvordan kan jeg forandre koden så det blir som oppgaven vil?

 

Takker for svar .)

[RAD1V]

function sirkler(x:int, y:int, radius:Number, antall:uint, _farge:Number, _farge2:Number, alfa:Number) {
var radiusTrekk:Number=radius/antall;
var teller:int=0;
var farge:Number=_farge;

while (teller < antall) {
	graphics.lineStyle(3,farge,alfa);
	graphics.drawCircle(x, y, radius);
	radius=radius-radiusTrekk;
	alfa=alfa+0.1;
	teller++;
	if (farge==_farge) farge=_farge2;
	else farge=_farge;
}
}
sirkler(200,200,300,20,0x00ff00, 0x00ffff,0);

Endret 9. mars 2010 av datastol

[GunnarGul]

Takk