Šipky:

Příprava

Zde popíši způsob, jak vytvořit sadu šipek, otáčející se za kurzorem myši. Vytvořte nový movie clip a narýsujte do něj šipku o výšce 70 pixelů. y-ovou souřadnici ji dejte -70. Vložte ho mimo hlavní scénu (když spustíte animaci, neměla by šipka být vidět). A teď co se musí spočítat. Podívejte se na následující obrázek:

trojúhelník

Úsečka AC představuje vaši šipku a bod B kurzor myši. První (a vlastně i poslední...), co musíte spočítat, je úhel α. Bohužel, trojúhelník ABC není pravoúhlý (respektive může být, ale jen když bude mít kurzor myši stejnou y-ovou souřadnici jako pata šipky), tudíž nemůžete použít normální goniometrické funkce, ale musíte použít některou z vět.

Jelikož známe všechny strany (dají se dopočítat), bude asi vhodná kosinova věta. A jak zní kosinova věta? a2=b2+c2-2bc*co. cosα potřebujeme vypočítat a k tomu bude potřeba znát strany a,b,c. Strana c je jasná, rovná se velikosti šipky |c|=70. Strany a a b se musí dopočítat z pravoúhlých trojúhelníků:

nákres výpočtu stran trojúhelníku

Jestliže tedy odečtete x-ovou souřadnici bodu A od x-ové souřadnice bodu B, pak absolutní hodnota výsledku se rovná straně x'. Je to logické. Představte si normální číselnou osu a na ní dva body X a Y. X leží na 5 a Y na 8. Jak zjistíte jejich vzdálenost? Odečtete je od sebe a absolutní hodnota je pak jejich vzdálenost (byl by nesmysl, kdyby byla vzdálenost záporná, proto ta absolutní hodnota).

Stejně tak určíte ostatní strany. Strana c (úsečka AB) se pak vypočte pomocí pythagorovy věty a rovná se odmocnině z x'2+y'2 a strana a (úsečka BC) odmocnině z x"2+y"2. To jen krátce pro ty, co ještě nebrali (nebo už zapomněli) vektory. Teď už znáte všechny strany a jediné, co zbývá, je dopočítat úhel. Z kosinovy věty si musíte osamostatnit cosα:

cosα=(b2+c2-a2)/2bc

Skriptování

Teď už znáte všechno potřebné a tak pouze přidejte tento skript k instanci šipky na hlavní scéně.

onClipEvent(enterFrame) {
  x=_root._xmouse-_x;            //vypočtu stranu x'
  y=_root._ymouse-_y;            //vypočtu stranu y'
  c=Math.sqrt((x*x)+(y*y));      //pomocí pythagorovy věty vypočtu stranu c
  y2=_root._ymouse-_y+70;        //vypočtu stranu y"
  a=Math.sqrt((y2*y2)+(x*x));    //vypočtu stranu a opět pythagorovou větou
  b=70;                          //strana b se rovná výšce šipky
  cos=(((b*b)+(c*c)-(a*a))/(2*b*c));  //kosinova věta
  acos=(Math.acos(cos));         //arcuskosinus
  uhel=180/Math.PI*acos;         //převod z radiánů na stupně
  if (_root._xmouse<_x) {
    uhel=360-uhel;
  }
  _rotation=uhel;
}

Proměnné x a y jsou shodné s proměnnými x' a y' na obrázku nahoře. _root._xmouse a _root._ymouse potom odpovídá b1 a b2. _x a _y se rovnají a1 a a2.

Na dalším řádku vypočtete pomocí pythagorovy věty stranu c.

y2 se rovná na obrázku y" (musíme ještě při výpočtu připočíst výšku šipky). x" počítat nemusíme, je stejné jako x' (šipka má všude - nahoře i dole - stejnou x-ovou souřadnici, neboť je svislá).

Dále vypočtete stranu a, opět pomocí pythagorovy věty. Strany x" a y" jsme už vypočetli a nic víc k tomu nepotřebujeme (x"=x a y"=y2).

Straně b přiřadíte výšku šipky.

Proměnná cos je vlastně osamostatněná kosinova věta.

Proměnné acos je pak přiřazen arcuskosinus předchozí proměnné a proměnné "uhel" je přiřazen úhel ve stupních (předtím byl vyjádřen v radiánech).

Bez toho ifu by celý skript fungoval, jen pokud byste byli napravo od šipky, když byste dali kurzor nalevo, Flash by stupně od 180 odečítal a šipka by byla osově obrácená. Poslední příkazy tedy udávají správnou rotaci šipky.

Všimněte si, že v obrázku mám x'=|a1-b1|, ale ve Flashi žádnou absolutní hodnotu nemám. To proto, že ji potom stejně umocním na druhou (x*x) a cokoliv na druhou je kladné číslo, takže v tomto případě je absolutní hodnota zbytečná.

A jako poslední už jen duplikujte instance šipky. Skript hoďte do prvního snímku animace.

for (j=0; j<5; j++) {
  for (i=1; i<12;++i) {
    _root.sipka.duplicateMovieClip("sipka"+i+j, i+j*20);
    name="sipka"+i+j;
    _root[name]._x=i*40+20;
    _root[name]._y=j*100;
  }
}

Zde jsem použil dva vnořené cykly. Cykly budou probíhat takto: Nejdříve bude j=0. Za této podmínky se provede druhý cyklus, který 11-krát duplikuje instanci šipky a skončí. Celý skript se vrátí zpět k prvnímu cyklu, kde bude j=1. Druhý cyklus opět 11-krát duplikuje instanci a skript se vrátí na začátek - j=2 atd. V druhém cyklu ještě musíte nastavit souřadnice duplikovaných klipů a pozor na to, aby byl každý v jiné hloubce (i+j*20).

prohlédnout
stáhnout zdroják

hlavní stránka # o tento web se stará Lukáš Havrlant # lukas.havrlant@gmail.com