reklama

Začínáme s Flash MX 2004 – 28. díl – přehrávání FLV souborů

Dnes se vrátíme k restu z předešlých dílů ohledně přehrávání videa ve FLV formátu a ukážeme si jednu z možností v ovládání uvedených videosouborů.

Ovládání videa

Otevřeme si zdrojový soubor z 25. dílu, který si lze stáhnout zde. Uvedenou ukázku upravíme pro pohodlné ovládání přehrávaného videa. Ovladačem bude posuvník, který bude zároveň sloužit jako indikátor aktuálního času videa.

Od posuvníku budeme požadovat, aby se při tažení přesunulo video na požadované místo (čas). Po kliknutí na posuvník chceme, aby se video zastavilo a pokud s posuvníkem nikam nepohneme, chceme, aby se video opět rozběhlo.

Navíc budeme v informačním textovém poli zobrazovat informace o aktuálním stavu přehrávání videa.

Úprava AS hlavní osy

V otevřeném zdrojovém souboru klikneme na první snímek a zobrazíme si panel akcí. Původní skript nahradíme následujícím:

delka = 43;
var netConn:NetConnection = new NetConnection();
netConn.connect(null);
var netStream:NetStream = new NetStream(netConn);
my_video.attachVideo(netStream);
netStream.setBufferTime(5);
netStream.play("video.flv");

Nezměnilo se téměř nic, smazali jsme proměnnou „stat“, která nás informovala o aktuálním stavu bufferu a přehrávání. Přibyla nám zde proměnná „delka“, kterou určujeme celkovou délku videa v sekundách. Nelze totiž automaticky zjistit celkovou délku videa, proto zde musíme „ručně“ nastavit jeho délku.

Celkovou délku videa zjistíme, když si otevřeme knihovnu objektů, klikneme pravým tlačítkem myši na objekt videa, zobrazíme okno vlastností „Properties“ a odečteme uvedenou délku.

Vytvoření posuvníku

Pro ovládání videa použijeme objekt posuvníku. Nejdříve si nakreslíme obdélník, který bude mít délku 160px a výšku zhruba 10px. Nakreslení obdélník celý vybereme a klikneme na něj pravým tlačítkem myši. Zvolíme „Convert to Symbol“ a převedeme obdélník na MC, který pojmenujeme „posuv“.

Klepněte pro větší obrázek

Dvojlklikem na vytvořený MC jej otevřeme a vytvoříme samotný objekt pro přetahování. Vytvoříme další vrstvu, do které nakreslíme malý obdélník, široký zhruba 4px, vysoký 20px a umístíme jej nad nakreslené pozadí celého MC. Pravým tlačítkem klikneme na zvolený nakreslený obdélník a převedeme jej na MC, který pojmenujeme „posuvnik“. Zkontrolujeme, jestli máme nastaven registrační bod nového objektu do levého horního rohu.

Klepněte pro větší obrázek

Klikneme na nově vytvořený objekt a zarovnáme jej k levé straně objektu, tvořícího pozadí.

Klepněte pro větší obrázek

Posledním objektem, který vložíme na scénu, je dynamické textové pole, které pojmenujeme „inf“ a umístíme je na hlavní scénu dokumentu.

Klepněte pro větší obrázek

Objekty máme připravené a můžeme se podívat na doplnění AS.

AS posuvníku

Dvojklikem na objekt posuvníku jej otevřeme, zvolíme malý obdélník, kterým budeme chtít ovládat video a otevřeme si panel akcí, kam napíšeme následující kód:

onClipEvent (load) {
  dragging = false;
}
onClipEvent (enterFrame) {
  this._parent._parent.inf.text = "Celkem dat: " + _root.netStream.bytesTotal + " Z toho již staženo: " + _root.netStream.bytesLoaded + newline + "Do vyrovnávací paměti staženo: " + _root.netStream.bufferLength+"s"+newline + "Aktuální čas animace: " +_root.netStream.time;
  if (!dragging) {
    if (this._x<160) {
      this._x = (_root.netStream.time/_root.delka)*160;
    }
  }
}
on (press) {
  _root.netStream.pause(true);
  dragging = true;
  startDrag(this, false, 0, -4.5, 160, 0);
  aktX = this._x;
}
on (release, releaseOutside) {
  dragging = false;
  stopDrag();
  xNew = this._x;
  if (aktX != xNew) {
    this._x = Math.floor(xNew);
    if (this._x != 0) {
      _root.netStream.pause(false);
      procent = this._x/160;
      _root.netStream.seek(_root.delka*procent);
    }
  } else {
    _root.netStream.pause(false);
  }
}

Nejdříve se pozastavíme u události „enterFrame“. Zde zobrazujeme v textovém poli aktuální informace o celkových a načtených datech videa a dále informujeme o stavu vyrovnávací paměti a aktuální pozici přehrávaného videa. Následuje podmínka, kde testujeme proměnnou „dragging“.

Proměnná „dragging“ informuje o situaci, když právě objekt přetahujeme. Pokud jej nepřetahujeme, zjišťujeme aktuální čas animace a podle něj objekt automaticky přesouváme. Pokud ovšem s objektem táhneme, nechceme, aby se nám aktuální stav animace promítal do pozice přesouvaného objektu.

Událost „press“, tedy po stisknutí myši na objektu, vyvolá zastavení videa („pause“) a začneme objekt přetahovat. Tažení probíhá pouze v mezích x-ové souřadnice v kladném směru do vzdálenosti 160px (délka pozadí celého objektu).

Proměnnou „dragging“ nastavíme na „true“, máme tak zaručeno, že se objekt bude opravdu přesouvat s myší a nebude jeho poloha ovlivněna aktuálním časem zastavené animace.

Následuje událost při uvolnění tlačítka myši („release“). Zde přirozeně ukončíme přetahování objektu. Následuje testování proměnných, pomocí kterých zjistíme, jestli jsme objekt vůbec někam přetáhli. Pokud ano (souřadnice původní a aktuální se neshodují), pomocí metody „seek“ se přesuneme na požadovaný čas (s) přehrávaného videa.

V případě, že jsme s objektem vůbec neposouvali, pouze znovu spustíme video.

V případě, že bychom chtěli vytvořit samostatné tlačítko pro pauzu videa, můžeme vynechat parametr „true/false“ u metody „pause“. Pokud napíšeme metodu bez uvedených parametrů, bude nám tato metoda automatiky zastavovat a spouštět video při klikání na příslušné tlačítko. Nemusíme zde zjišťovat aktuální stav přehrávání a stačí vypsat pouze uvedenou funkci.

Poslední metoda, kterou zde již jen zmíním je „close()“. Pokud ji použijeme, dojde k ukončení načítání videa, dosud stažená data se vymažou a my můžeme začít zobrazovat další videosoubor.

Zdrojová data dnešní ukázky ke stažení zde.

Ukázka dnešní lekce zde.

Témata článku: Software, Programování, Video, Flash, Stat, Convert

5 komentářů

Nejnovější komentáře

  • OBr 2. 10. 2005 16:37:40
    ve zkratce odkážu na tento díl:...
  • Johny 30. 9. 2005 21:26:08
    Vrať se prosím k webu.. Byl bych Ti strašně vdečný za díl, který by...
  • gully, gully 26. 9. 2005 16:51:43
    Tak si ho stáhni z http://zaciname-s-flash-mx-2004.wz.cz/htm/
reklama
Určitě si přečtěte

Pojďme programovat elektroniku: Sestavíme si mobil a pošleme SMS

Pojďme programovat elektroniku: Sestavíme si mobil a pošleme SMS

** Kolik stál váš mobilní telefon? ** Základní GSM modem koupíte za stovku ** Umí telefonovat, posílat SMS a zvládne i GPRS

13.  1.  2017 | Jakub Čížek | 26

Do nitra zákeřného ransomwaru. Takto vypadá útok na počítače personalistek

Do nitra zákeřného ransomwaru. Takto vypadá útok na počítače personalistek

** Jmenuje se Rolf a chce práci ** Jeho životopis je ale trošku jiný ** Rolf je totiž ransomware

11.  1.  2017 | Jakub Čížek | 44

Auta budoucnosti: V tomto se budete za pár let vozit

Auta budoucnosti: V tomto se budete za pár let vozit

** Velký prostor patřil na letošním veletrhu CES automobilům ** Automobilová budoucnost je elektrická a inteligentní ** Podívejte se, jak je vývoj futuristických autonomních aut daleko

12.  1.  2017 | David Polesný | 33


Aktuální číslo časopisu Computer

99 nejlepších programů pro váš počítač

Zvykejte si na umělou inteligenci

Velké testy PC zdrojů a gamepadů

Alternativní zdroje energie

reklama
reklama