Share
Her er det den siste delen av videoopplæringen vår! Alt vi trenger å gjøre nå er å få tidsindikatoren til å arbeide, legg til vår hjemmeknapp-klikkfunksjon, plasser og størrelse den nåværende videoen og få den fremhevede linjen fylt med videoer sammen med sin skrubber. La oss komme i gang!
Først må vi legge til en lytter til scenen kalt videoTimeEnterFrame som oppdaterer videotiden hver ramme. Legg denne linjen til videoItemClick-funksjonen.
stage.addEventListener (Event.ENTER_FRAME, videoTimeEnterFrame); // kjører denne funksjonen hver gang vi skriver inn en ny ramme
La oss nå legge til videoTimeEnterFrame-funksjonen.
funksjon videoTimeEnterFrame (event: Event): void var totalSeconds: Number = ns.time; // variabel for å holde ns.time var totalSeconds2: Number = duration; // variabel for å holde varigheten var minutter: Number = Math.floor (totalSeconds / 60); // variabel for å holde avrundet totalSekunder divideres med 60 var minutes2: Number = Math.floor (totalSeconds2 / 60); // variabel for å holde avrundet totalSekunder2 dividert med 60 var sekunder = Math.floor (totalSeconds)% 60; // variabel for å få 60 prosent av totalSeconds var seconds2 = Math.floor (totalSeconds2)% 60; // variabel for å få 60 prosent av totalSecond2 hvis (sekunder < 10) // if the seconds variable is less than 10 then… seconds = "0" + seconds; // the seconds variable is equal to 0:seconds if(seconds2 < 10) // if the seconds2 variable is less than 10 then… seconds2 = "0" + seconds2; // the seconds2 variable is equal to 0:seconds videoTimeTxt.text = minutes + ":" + seconds + " / " + minutes2 + ":" + seconds2; // update the videoTimeTxt field with the total time and current time.
Hvis du legger til klikklytteren for startknappen, kan vi gå tilbake til det øverste nivået av gjeldende galleri vi er på. Legg dette til toppen av koden under våre andre funksjoner vi har ved oppstart.
homeBtn.addEventListener (MouseEvent.CLICK, homeBtnClick); // lytter etter når hjemme-knappen er klikket
funksjon homeBtnClick (event: MouseEvent): void if (currentGallery == 0) // hvis currentGallery variabel er lik 0 Tweener.addTween (container_mc, ala: 0, tid: .5, overgang: "easeOut", onComplete : removeGallery0); // tween av container_mc og kjør removeGallery0 funksjonen hvis (currentGallery == 1) Tweener.addTween (container_mc, ala: 0, tid: .5, overgang: "easeOut", onComplete: removeGallery1); hvis (currentGallery == 2) Tweener.addTween (container_mc, ala: 0, tid: .5, overgang: "easeOut", onComplete: removeGallery2);
Test filmen din, klikk på et galleri for å se listen over videoer. Klikk nå på Hjem-knappen. Spilleren din vil nå fade av gjeldende videoer og erstatte dem med de nåværende kategoriene.
For å sette videoWidth & videoHeight må vi legge til noe kode for først å få verdiene. Vi må legge til denne koden i videoItemClickFunction over ns.play-linjen.
videoWidth = xml.GALLERY [currentGallery] .CATEGORY [categoryItemName] .ITEM [videoItemName] .file_width; // får videobredden fra xml videoHeight = xml.GALLERY [currentGallery] .CATEGORY [categoryItemName] .ITEM [videoItemName] .file_height; // får videohøyden fra xml video.width = videoWidth; // Sett videoens bredde til videoWidth-variabelen video.height = videoHeight; // Sett videoens høyde til videoHeight-variabelen
Nå har vi videosettet til riktig bredde og høyde. Den siste tingen å gjøre er å plassere den midt i visningsområdet. Legg denne linjen til videoItemClickFunction over ns.play (currentVideo): void line.
positionVideo ();
Legg deretter til funksjonen for å håndtere posisjonVideo-hendelsen.
funksjon posisjonVideo (): void video.x = 0; // sett videoen x til 0 video.y = 0; // sett videoens y til 0 var vidWidthDif = videoBlackBox.width - videoWidth; // få forskjellen på videoBlackBox bredde og videobredden - hold den i denne variabelen var vidHeightDif = videoBlackBox.height - videoHeight; // få forskjellen på videoBlackBox høyde og video høyde - hold den i denne variable video.x = vidWidthDif / 2; // plassere videoens x video.y = vidHeightDif / 2; // plassere videoens y
Klipp og lim inn denne linjen til bunnen av posisjonVideo-funksjonen.
ns.play (currentVideo);
Nå, hvis du tester filen, får du videoen til å få bredden og høyden vi angir i XML, og endre dens dimensjoner, og spill av videoen.
Disse variablene vil opprette og holde inne våre funksjoner i et filmklipp.
var featuredContainer: MovieClip; // lage en ny filmklipp for å holde de utvalgte videoelementene var omtaltThumbLoader: Loader; // lage en ny laster for å laste de utvalgte videoene var featuredItemName; // opprett en ny featuredItemName-variabel for å holde navnet på det utvalgte elementet vi vil klikke
For å se etter utvalgte videoer i XML, legg til denne koden i myXmlLoaded-funksjonen. Det vil gå gjennom alle videoene og returnere de som er satt til ekte.
checkForFeaturedVids (); // Kjør denne funksjonen når xml er lastet
Denne funksjonen er akkurat som makeGalleryItems-funksjonen vi har satt opp i del 2. Vi vil opprette the featuredItem movieclips for featuredContainer basert på xml, legge dem ut og plassere dem riktig, laste inn miniatyrbildet og fjerne forhåndsinnlasteren med en separat funksjonen nedenfor.
Redaktørens notat: Vel, her er vi igjen ... De av dere som bruker FireFox, ville ha funnet siden fryser takket være denne lille blokk ActionScript. For å holde tingene løpende, her er koden for nedlasting. Beklager bryet.
Nå må vi sette en lytter til å håndtere hva som skjer når vi klikker på et utvalgt element movieclip. Legg denne linjen til if-setningen i funksjonen checkForFeaturedVids under myFeaturedItems btnOver & btnOut lytterne.
myFeaturedItem.addEventListener (MouseEvent.CLICK, myFeaturedItemClick);
Dette skjer når vi klikker på et utvalgt element:
funksjon myFeaturedItemClick (event: MouseEvent): void featuredItemName = event.target.name; // få gjeldende element og sett det til den valgteItemName variabel currentVideo = xml.GALLERY.CATEGORY.ITEM.file_path [featuredItemName]; // sett vår nåværendeVideo-variabel til den fremhevede videoen i xml videoTitleTxt.text = xml.GALLERY.CATEGORY.ITEM.file_title [featuredItemName]; // Sett videotitlene navn videoWidth = xml.GALLERY.CATEGORY.ITEM.file_width [featuredItemName]; // få videobredden videoHeight = xml.GALLERY.CATEGORY.ITEM.file_height [featuredItemName]; // få videohøyden video.width = videoWidth; // angi videobredden video.height = videoHeight; // Sett videohøydeposisjonVideo (); // Kjør denne funksjonen stage.addEventListener (Event.ENTER_FRAME, videoTimeEnterFrame); // endre videoavspillingstid
Først legg til variabel for å holde navnene til korte navn på filmklipp.
var featuredScrollTrack: MovieClip = featuredBox_mc.featuredScrollbar_mc.featuredScrollbarTrack_mc; var featuredScrollThumb: MovieClip = featuredBox_mc.featuredScrollbar_mc.featuredScrollbarThumb_mc; var featuredScrollMask: MovieClip = featuredBox_mc.featuredScrollbar_mc.featuredMasker_mc; var xOffset: tall; var xMin: tall = 0; var xMax: tall; var featuredThumbDif: Number;
Legg deretter til disse linjene øverst i koden under de andre lytterne som starter når filen åpnes.
featuredScrollThumb.addEventListener (MouseEvent.MOUSE_OVER, btnOver); featuredScrollThumb.addEventListener (MouseEvent.MOUSE_OUT, btnOut); featuredScrollThumb.buttonMode = true; featuredScrollThumb.mouseChildren = false;
Her vil vi gjøre noe som ligner funksjonen checkFeaturedContainerWidth i del 2.
funksjon checkFeaturedContainerWidth (): void if (featuredContainer.width> featuredScrollMask.width) linkFeaturedScroller (); featuredScrollThumb.addEventListener (MouseEvent.MOUSE_DOWN, featuredScrollbarThumbDown); stage.addEventListener (MouseEvent.MOUSE_UP, featuredScrollbarThumbUp); featuredScrollThumb.visible = true; featuredScrollThumb.alpha = 0; Tweener.addTween (featuredScrollThumb, alfa: 1, tid: .5, overgang: "easeOut"); else featuredScrollThumb.removeEventListener (MouseEvent.MOUSE_DOWN, sideScrollbarThumbDown); stage.removeEventListener (MouseEvent.MOUSE_UP, featuredScrollbarThumbUp); Tweener.addTween (featuredScrollThumb, ala: 0, tid: .5, overgang: "easeOut", onComplete: hideFeaturedScrollbarThumb); funksjon hideFeaturedScrollbarThumb (): void featuredScrollThumb.visible = false;
Legg til funksjonene for å gå med lytterne i funksjonen checkFeaturedContainerWidth.
funksjonslinkFeaturedScroller (): void featuredScrollThumb.x = 0; featuredContainer.mask = featuredScrollMask; xMax = featuredScrollTrack.width - featuredScrollThumb.width; funksjonen featuredScrollbarThumbDown (event: MouseEvent): void featuredScrollThumb.removeEventListener (MouseEvent.MOUSE_OVER, btnOver); featuredScrollThumb.removeEventListener (MouseEvent.MOUSE_OUT, btnOut); stage.addEventListener (MouseEvent.MOUSE_MOVE, featuredScrollbarThumbMove); xOffset = mouseX - featuredScrollThumb.x; funksjonen featuredScrollbarThumbUp (event: MouseEvent): void featuredScrollThumb.addEventListener (MouseEvent.MOUSE_OVER, btnOver); featuredScrollThumb.addEventListener (MouseEvent.MOUSE_OUT, btnOut); featuredScrollThumb.gotoAndStop ( "over"); Tweener.addTween (featuredContainer, _Blur_blurX: 0, tid: 1, overgang: "easeOut"); stage.removeEventListener (MouseEvent.MOUSE_MOVE, featuredScrollbarThumbMove); funksjonen funksjonerSkrollbarThumbMove (hendelse: MouseEvent): void featuredScrollThumb.x = mouseX - xOffset; if (featuredScrollThumb.x <= xMin) featuredScrollThumb.x = xMin; else if(featuredScrollThumb.x >= xMax) featuredScrollThumb.x = xMax; featuredThumbDif = featuredScrollThumb.x / xMax; Tweener.addTween (featuredContainer, x: ((- featuredThumbDif * (featuredContainer.width - featuredScrollMask.width)) + 25), _Blur_blurX: 5, tid: 1, overgang: "easeOut"); event.updateAfterEvent ();
Så der har du det, gi deg en klapp på baksiden hvis du er ferdig og begynn å sette noen videoer opp på nettet!
!
Accentsconagua