, lave en video i realtid med as3,,,,, andel,,,,,,,, 4,,,,,,, det cyber - mandag envato tuts + kurser vil blive reduceret til $3.- og', miss. "goddag, kode freaks!denne lektion vil vise jer, hvordan man deler en løbende video i blokke, som om det er eksploderet.og alle med actionscript.for resten, vi vil bruge kameraet som video kilde, så du kan se ændringerne leve.,,,, endelige resultat forpremiere, lad os tage et kig på det endelige resultat, vi arbejder hen imod:,, klik og trække en blok til at flytte rundt på skærmen!(camera adgang påkrævet.), trin 1: fælde - ide, for denne forelæsning, vi vil bruge den flashdevelop ide om, du kunne bruge en as3 redaktør).hvis du ikke har det, og jeg vil forsøge, du kan tage det her fra.en grundlæggende forelæsning om oprettelse af flashdevelop på maskine kan blive fundet her. også hvis du har flash faglige monteret på din side, som vil arbejde for.alt du skal gøre er at skabe en ekstern klasse dossier som nævnt nedenfor, og knytte den til din flash - projektet som et dokument, der indeholder klasse. vores arbejdsmiljø,.,, trin 2: fælde - nyt projekt, skabe en ny as3 projekt i flashdevelop.,,, når det gøres, vil du have en, vigtigste, klasse, der blev skabt i srk folder, som set i den rigtige panel, trin 3: "- de vigtigste klasse, så vi er nødt til at gøre det, main.as, indgive en lille renere ved at fjerne en kode.først når du åbner den, main.as, sag, ville det have kode sådan noget, pakke (import flash.display.sprite; import flash. begivenheder. begivenhed; offentlige klasse vigtigste udvider sprite {offentlige funktion main(): ugyldig (hvis (tidspunkt) init(); andre addeventlistener (event.added_to_stage, lokalitet)} privat funktion lokalitet (e: tilfælde = null): ugyldig (removeeventlistener (event.added_to_stage, lokalitet); //indgangssted}}}, vi kan slette en del af koden for at få det til at se ud, renere.så du skal have denne:, pakke (import flash.display.sprite; import flash. begivenheder. begivenhed; offentlige klasse vigtigste udvider sprite {offentlige funktion main(): ugyldig (}), alle her er gjort, og det er tid til at dykke ned i en kode.,, trin 4: at erklære den video og kamera variabler vores første mål er at gøre den video på scenen med kameraet, for det, vi har brug for at erklære nogle variabler.disse erklæringer er lige over den vigtigste, klasse konstruktøren. //video - variabler private var camw: int = 300 og private var camh: int = 300 og private var video: video,,, camw - bredden af det kamera /video.,, camh - højden af kamera /video -.,, video -, video -, klasse f.eks.,, løntrin 5: forberedelse af den anordning, kamera, som tidligere nævnt, vil vi bruge kameraet produktion i videoen.så vi er nødt til at gøre den klar til kameraet.følgende kode bør gå til klassen konstruktøren., var kamera: kamera = kamera. getcamera(); vi her instantiate et kamera, f.eks. og få tilgængelige anordning kamera ved den statiske metode, getcamera(), af det kamera, klasse, kamera. setmode (camw, camh, 30), give en kamera indstillinger: bredde, højde og fps. vi har ikke kameraet variable globalt, fordi vi ikke har behov for at få adgang til det uden for denne funktion, som du vil se.i løbet af de næste skridt, vi nulstille, video, variable.,, trin 6: faktisk skabe den video!-, video - = nye video (camw, camh); video. attachcamera (kamera), har vi nu instantierede, video, variable og anvendt, attachcamera(), en metode til at lægge kameraet.det betyder, at nu videoen bruger kameraet produktion som kilde. færdig med video - og kameraet.husk, du er nødt til at indføre hensigtsmæssige kategorier i din kode.hele din klasse kode skal se sådan ud i dag:, pakke (import flash.display.sprite; import flash.events.event; import flash.media.camera; import flash.media.video; offentlige klasse vigtigste udvider sprite (//video - variabler private var camw: int = 300 og private var camh: int = 300 og private var video: video; offentlig funktion main():. {var kamera: kamera = kamera. getcamera(); kamera. setmode (camw, camh, 30); - = nye video (camw, camh); video. attachcamera (kamera)}}}, hvis du løber (f5 eller ctrl + ind i projektet lige nu, ville det være noget tidspunkt, men du sandsynligvis vil få et kamera adgang anmodning, som ansøgningen forsøger at få adgang til anordning med kamera.tillader det.grunden til, at du ikke ser noget, er det, fordi vi ikke ønsker at vise videoen, og vi har ikke tilføjet det til fase (display - liste).det vil blive anvendt som kilde for hver vores gader.hvis du vil prøve, at alt er fint, bare tilføje følgende linje sidst i de vigtigste, konstruktøren:, addchild (video); //fjerne denne linje efter prøvning, trin 7: at blokere variabler, så vi skaber de blokke - særskilt peices af videoen.og det første skridt er at erklære visse variabler, som er nødvendige for den.så gå videre og tilføje følgende variable erklæringer under den video variabler: //blok variabler private var rækker: int = 3; private var kol: int = 3; private var blockw: int = camw /kol; private var blockh: int = camh /rækker; private var pointcollection: formål = ny object();,, rækker - - antal rækker til at dele den video,.,, kol. - ja.det har du.antallet af søjler og dele den video,.,, blockw - hver blok er bredde.det er en afledte variabler, som det er blot beregnet af den, idet den samlede bredde (, camw) antal colums (, kol,.,, blockh - hver blok er højde, dvs. camh divideret med række,.,, pointcollection, endelig - men mest vigtige variabel.det er et overordnet system, som vi vil bruge til at oplagre det tilsvarende punkt i hvert felt.hvis f.eks. en blok er navn, block12,, så vil vi opbevarer det tilsvarende punkt, p12, sådan her: pointcollection ["block12"] = p12 //punkt er punkt klasse tilfælde her, trin 8: begynde at blokke, nu hvor vi har de krævede variabler er defineret, er vi faktisk begynde at skabe blokke.vi skal holde alle blok oprettelse kode i en funktion, initblocks(),.denne funktion vil blive kaldt fra de vigtigste, konstruktøren om videoen, så lad os først erklære en funktion, initblocks(), lige efter at det vigtigste, konstruktøren. privat funktion initblocks(): ugyldig (for (var - r: int = 0 f < rækker; r + +) (for (var - c: int = 0, c < kol; c + +) (//kode for at skabe hver blok}}}, bemærker de to, for vi har anbragt i løkker, som vil hjælpe os til at skabe blokke i 2d - nettet, række klogt.og så tilføje en opfordring til, at denne funktion ved udgangen af main(): offentlige funktion main(): ugyldig (var - kamera: kamera = kamera. getcamera(); kamera. setmode (camw, camh, 30); - = nye video (camw, camh); video. attachcamera (kamera); initblocks();} trin 9: komponenter af en blok, før at skabe blokke, lad os forstå, hvad en enkelt blok er lavet af.hver blok er faktisk:,,, sprite, med en, bitmap, inde i det, som i har brug for en, bitmapdata,,,, sprite, som den ydre beholder.helt tom. til at drage den blok, vi har brug for en, bitmap, der vil vise, at de tilsvarende video produktion. og endelig, bitmap, har brug for nogle oplysninger til at trække i den.det er givet i form af bitmapdata,.,, trin 10: skabe blok er base - sprite, den første del af en blok, som vi har drøftet, er en sprite.så lad os skabe en.den kode, som vi skriver til at skabe den blok, er at blive skrevet ind i, for loops., var newblock: sprite = nye sprite();, skaber vi en ny instans, sprite, klasse, newblock.name = "blokke" + r + c, så vi navn den sprite, så vi kan - det senere i kode.den navngivningskonvention er enkel: en blok på række r og i kolonne c, der hedder, block + r + c (+ betyder forurening).så en blok på linje 2 og kolonne 1 hedder, block21,.,, trin 11: placering, efter at have skabt den, er vi nødt til at holdning, som det på scenen i henhold til den række og kolonne.så lad os tilføje følgende kode., var p: punkt = ny litra c * blockw, r * blockh), bruger vi et punkt, klasse objekt til opbevaring af punkt er koordinater her.og så er vi ved at skabe en ny instans, punkt og passere, c * blockw, som x-value og f * blockh, som y-value.nu koordinaterne kan benyttes som blot, p.x, og p.y og anvendes senere til at hente hver blok er clippped region fra en komplet video ramme. husker hver blok er punkt rent faktisk er koordinaterne for øverst til venstre i nettet. hvis du er i tvivl om, hvordan situationen er beregnet her, følgende tal vil gøre det klart, newblock. x = c * (blockw + 1) + 20 newblock. y = r * (blockh + 1) + 20, vi holdning den sprite.den cordinates er mere eller mindre de samme forventer vi nu tilføje 20 give en udligning.også vi tilføje 1 til, blockw, og blockh, separate blokke af 1 pixel, som er synlig i demo ovenfor, pointcollection [newblock. navn] = p; endelig, vi redder vi beregnet i en tidligere, pointcollection,.,, at bitmap til trin 12: den blok, jeg kommer nu til den anden og tredje del af blok., var bmpd: bitmapdata = nye bitmapdata (blockw, blockh), skaber vi en, bitmapdata, f.eks. og give den nødvendige blok bredde og højde, vi havde før.som tidligere nævnt, en, bitmapdata, f.eks. er påkrævet at skabe en, bitmap, instans, som er vedtaget i den pågældende., var bmp: bitmap = nye bitmap (bmpd); bmp.name = "mybmp", nu er vi ved at skabe en, bitmap, f.eks. og kom med tidligere skabt, bmpd, konstruktøren.også vi kalde det bitmap, mybmp, så vi kan henvise det senere. newblock. addchild (bmp); addchild (newblock), i sidste ende vil vi tilføje bitmap, bmp - som et barn, newblock, og newblock, selv som barn af scenen, - - bare for at være sikker på. du er på rette spor, din main.as, kode skulle se sådan noget, pakke (import flash.display.bitmap; import flash.display.bitmapdata; import flash.display.sprite; import flash.geom.point; import flash.media.camera; import flash.media.video; offentlige klasse vigtigste udvider sprite (//video - variabler private var camw: int = 300 og private var camh: int = 300 og private var video: video; //blok variabler private var rækker: int = 3; private var koller. int= 3; private var blockw: int = camw /kol; private var blockh: int = camh /rækker; private var pointcollection: array = nye array(); offentlig funktion main(): ugyldig (var - kamera: kamera = kamera. getcamera(); kamera. setmode (camw, camh, 30); - = nye video (camw, camh); video. attachcamera (kamera); initblocks();} privat funktion initblocks(): ugyldig (for (var - r: int = 0 f < rækker; r + +) (for (var - c: int = 0, c < kol; c + +) (var - newblock: sprite = nye sprite(); newblock.name = "blokke" + r + c var p: punkt = ny litra c * blockw, r * blockh); newblock. x = c * (blockw + 1) + 20 newblock. y = r * (blockh + 1) + 20 pointcollection [newblock. navn] = p.var bmpd: bitmapdata = nye bitmapdata (blockw, blockh) var bmp: bitmap = nye bitmap (bmpd); bmp.name = "mybmp" newblock. addchild (bmp); addchild (newblock)}}}}}, trin 13: ajourføring af blokke - koncept, selv om vi har de blokke, der i den rigtige holdninger, vi kan stadig ikke se noget om gennemførelsen af projektet.det er, fordi vi stadig har ikke udarbejdet noget inde i blok bitmaps. vores næste skridt er at drive en konstant at sløjfe, som udfører følgende aktiviteter:,, få den nuværende video ramme., loop gennem alle blokke., hent hver blok er punkt og bitmap barn., trækker den tilsvarende del af videoen. ramme på blokken er bitmap.,, så lad os gøre det.før gennemførelsen af loop - kode, hvad vi har brug for, er en sløjfe funktion (en slags leg loop).der tilføjes følgende funktion erklæring under, initblocks(), funktion:, privat funktion updateblocks e: begivenhed): tomrum {}, som er synlige fra funktion parameter, det ser ud som en begivenhed til at lytte, og ja, det er.det er en lytter funktion, at vi tillægger det, enter_frame, tilfælde af scenen.at knytte den til at lytte, tilføje denne linje ved slutningen af det, main(), konstruktøren. offentlige funktion main(): ugyldig (var - kamera: kamera = kamera. getcamera(); kamera. setmode (camw, camh, 30); - = nye video (camw, camh); video. attachcamera (kamera); initblocks(); addeventlistener (event.enter_frame, updateblocks)), og punkt 14: opsamling ramme, er dette den første operation, at vi udfører vores loop -, updateblocks(), funktion, som kaldes på hvert billede.læg følgende kode ind, updateblocks(), funktion, var srcbmpd: bitmapdata = nye bitmapdata (camw, camh), hver bitmap er data i actionscript 3 skal være indeholdt i en, bitmapdata, f.eks. og så skaber vi en.vi vil fylde dette eksempel med den nuværende ramme oplysninger næste video., srcbmpd. træk (video); her har vi brugt, draw(), funktion, bitmapdata, klasse.det kræver et objekt i en klasse, der gennemfører, ibitmapdrawable interface.For eg. Sprite, MovieClip, BitmapData etc. What it does is simply take the visual data of the object passed and stores it in the ,BitmapData, instance.,So now we have the current video frame (or, you could say, a screenshot) in the variable ,srcBmpd,., Step 15: Let's Loop,As we need to update every block, we create a double ,for,-loop, similar to the one we wrote for creating the blocks.\tSo go ahead and add it.,The function should look similar to this right now:, private function updateBlocks(e:Event):void { \tvar srcBmpd:BitmapData = new BitmapData(camW, camH); \tsrcBmpd.draw(video); \tfor (var r:int = 0; r < rows; r++) { \t\tfor (var c:int = 0; c < cols; c++) { \t\t\t//update code here \t\t} \t} }, Step 16: Retrieve the Block's Bitmap og punkt, huske på, at vi ved navn start på en bestemt måde og samtidig skabe dem, så vi kan henvise en blok med en række og kolonne nummer.det er, hvad vi skal bruge til at komme hver blok er reference., var b_mc: sprite =. getchildbyname ("blokke" + r + c) som sprite, vi bruger, getchildbyname, funktion, fase (,), der igen en henvisning til en genstand, hvis navn passer - døde.også vi sat i bås med, sprite, klasse, bare for at være sikker på, at de returnerede objekt er en sprite.nu blokere henvises i den variabel, b_mc,., var bmp: bitmap = b_mc. getchildbyname ("mybmp"), som bitmap;, på samme måde, som vi finder henvisningen til bitmap, der blev tilføjet som et barn af blok sprite., var p: nr = pointcollection [b_mc. navn]; endelig får vi den nuværende blokering (, b_mc) koordinater fra det system, hvor vi opbevarer det tidligere ved hjælp af blok navn. skridt 17: gøre det!nu, hvor vi har alle de nødvendige oplysninger om, hvad at gøre, hvor vi rent faktisk kan gøre det.vores motiv er at få det rektangulære region af video ramme (dvs. srcbmpd) med den øverste venstre punkt, da de fik punkt p, bredde, som blockw og højde, som blockh,., til det formål har vi brug for, copypixels(), metode for, bitmapdata, klasse.det er faktisk kopier den region i en anden kilde, bitmapdata, angivet ved en, rektangel, genstand, bmp. bitmapdata. copypixels (srcbmpd, nye rektangel (p.x, p.y, blockw, blockh), nye point()), draw(), funktion, der er tale om praksis, er, bitmapdata, ejendom.de parametre, gik ind i det, er:,, kilde, bitmapdata, obeject.den skærmbillede af video - i dette tilfælde (, srcbmpd). et rektangel, genstand, som angiver den øverste venstre, bredde og kolonne i regionen i kilden til at blive kopieret.det punkt i den destnation, hvor den ramte del er at blive kopieret.(0,0) i dette tilfælde.så vi kun give et nyt punkt, objekt., færdig!nu er det tid til at køre deres projekt og se fantastisk virkning. gå 18: at slæbe - og funktionalitet, at tilføje ud og smid træk, som set i demo, vi skal bare lægge to mus lyttere til hver blok, - - for det, mouse_down, omstændigheder og en anden for det tilfælde, mouse_up,.så gå videre og fastlægge to mus kontaktperson funktioner i slutningen af klasse:, privat funktion onmousedown e: mouseevent): ugyldig (sprite (e.currenttarget). startdrag();} privat funktion onmouseup e: mouseevent): ugyldig (sprite (e.currenttarget). stopdrag();}, alt, hvad vi gør i de lytter funktioner få den henvisning til tilfælde sender blok med, currenttarget, tilhører den begivenhed, genstand, sat i bås til en sprite, (som det er, hvad vores gader er) og kalder den, startdrag(), og stopdrag(), til at håndtere hiv og ned. det er ikke helt endnu.vi har stadig brug for at knytte disse tilhørere til deres tilsvarende begivenheder.så lægger disse to linjer på, initblocks(), funktion, privat funktion initblocks(): ugyldig (for (var - r: int = 0 f < rækker; r + +) (for (var - c: int = 0, c < kol; c + +) (var - newblock: sprite = nye sprite(); newblock.name = "blokke" + r + c var p: punkt = ny litra c * blockw, r * blockh); newblock. x = c * (blockw + 1) + 20 newblock. y = r * (blockh + 1) + 20 pointcollection [navn] newblock. = p. var bmpd: bitmapdata = nye bitmapdata (blockw, blockh) var bmp: bitmap = nye bitmap (bmpd); bmp.name = "mybmp" newblock. addchild (bmp); addchild (newblock); newblock. addeventlistener (mouseevent.mouse_down, onmousedown); newblock. addeventlistener (mouseevent.mouse_up, onmouseup);}}}, skridt 19: sidste detalje, en sidste ting, bare for at få det til at se mere interaktiv.måske har du lagt mærke til, hvordan blokke forsvinder ind og ud, når presset og løsladt.det er en alpha manipulation, vi gør i lyttere.ændre deres lyttere til noget, der ligner:, privat funktion onmousedown e: mouseevent): ugyldig (sprite (e.currenttarget). alpha = 0, 4; sprite (e.currenttarget). startdrag();} privat funktion onmouseup e: mouseevent): ugyldig (sprite (e.currenttarget). alpha = 1; sprite (e.currenttarget). stopdrag();} og der har du alfa ændrer virkning., konkluderes, at den virkning har en masse potentiale skal anvendes til forskellige formål.jeg har udviklet et puslespil med for nylig, der bruger det. bortset fra, at det kan bruges til at skabe overgang virkninger for videoafspillere, eller i forbindelse med 3d til tekstur en overflade med en video., jeg håber at se nogle seje ting, folk kommer med ved hjælp af denne virkning.,