FLASH 5 - Kalkulačka v 2.0 - Grafika.cz - vše o počítačové grafice

Navigace:  » Úvodní stránka  » Rubriky  » Webdesign  

13. listopadu 2001, 00.00 | Navážeme na předchozí článek a budeme pokračovat ve vylepšování kalkulačky. Podstatným nedostatkem je velikost displeje, resp. počet zobrazovaných číslic, při zadávání čísel a také při konečném výsledku, který upravíme.

Navážeme na předchozí článek a budeme pokračovat ve vylepšování kalkulačky. Podstatným nedostatkem je velikost displeje, resp. počet zobrazovaných číslic, při zadávání čísel a také při konečném výsledku, který upravíme.

spam_email('.cz', '@', 'centrum', 'filip.zavadil');>

Do vlastností textového pole displej přidáme ještě + e, aby se čísla zobrazovala ve tvaru 2.71e+20 nebo 2.71e-20. Nyní nám zbývá vyřešit poslední problém, a tím je počet čísel zobrazovaných na displeji. Možná víte o možnosti Max. chars (max počet znaků) u textového pole typu input, takže bychom jednoduše dynamické textové pole displej mohli přeměnit, ale tohle je špatná cesta, protože omezení počtu znaků nebude fungovat (fungovalo by jen v případě přímého zápisu do tohoto pole). Proto budeme muset vytvořit funkci na omezení počtu znaků na displeji:

1) Funkce bude omezovat počet znaků při psaní na displej. Nezapomeneme na znaménko a také na to, že po napsání max. počtu znaků na displej budeme moci změnit znaménko "+/-", a v tomto případě musíme nadefinovat akci, která bude řešit i tuto možnost.

Do prvního framu vrstvy action našeho souboru přidáme proměnnou, kde nadefinujeme délku displeje disdelka="15"; na níž se budeme dále odkazovat (kdybychom později chtěli změnit délku displeje, stačí jen změnit implicitně nastavenou hodnotu na jinou). Funkci pridavani přeměníme následovně - viz. ActionScript pod textem, omezíme tak délku displeje. Musíme také počítat s tím, že je možné změnit u čísla znaménko (+/-) nebo může být záporné, tomu se budeme věnovat později. Můžeme tedy napsat pouze 15 čísel (za číslo se počítá i desetinná tečka).

stop ();
displej = "0";
// na displeji bude nula
pamet = "0";
// vynulovani pameti
disdelka = "10";
// delka displeje
function pridani (cislo) {
// funkce pro pridani cisel na displej
if (clear) {
clear = false;
decimal = false;
displej = "0";
}
// a kontrola delky cisla pri zadavani
if (displej == "0" && cislo != "." && displej.length  < disdelka) {
displej = cislo;
} else if {(displej.length < disdelka) {
displej = displej + cislo;
}
} 

2) Při početních operacích nemůžeme jednoduše odříznout zbytek reálného čísla nebo zaokrouhlit, protože by docházelo ke značnému zkreslení, i když by to bylo určitě jednodušší. Musíme počítat s hodně velkými (nebo malými) čísly ve tvaru 2.71234567890123456789e+20 (e-20), která musíme převést na danou délku displeje. K tomu bude sloužit následující funkce, kterou vytvořil a tímto mu chci poděkovat za spolupráci, přidal jsem k ní podrobné komentáře. Přidáme další vrstvu do hlavní scény s názvem kontrola a umístíme do ní funkci kontrola.

// PRIKLADY UVADENE V POZNAMKACH JSOU PRO DELKU DISPLEJE 10 (disdelka="10";)
function kontrola (); {
displej = displej.toString();
// prevede displej na string (textovy retezec)
znamenko = displej.substring(0,1);
displej = displej.substring(1);
porovnani = "";
// porovnani zjistuje, zda cislo, ktere ma byt zobrazeno, je vetsi nebo mensi nez cislo, 
// ktere se maximalne vejde na displej, napr.: displej ma pet mist, nejvetsi zobrazitelne
// cislo bez exponentu je 99999
for (i=1; i<disdelka; i++) {
// smycka for na zaklade udaje o delce displeje vygeneruje cislo, ve kterem jsou same devitky
// smycka bezi tak, ze v prvnim pruchodu vytvori string "9", ve druhem "99".... 
// a v zahlavi smycky je omezeni, dokud je "i" mensi nez disdelka
porovnani += "9";
}
if (displej.length>(disdelka-1) && displej.indexOf("e") != -1) {
// pokud bude napr. cislo 2.1234567890123456789e+22, 
// jsou vynechana nadbytecna des. mista a ponechá se exponent e+22
delic = displej.indexOf("e");
// pokud displej obsahuje "e"
string1 = displej.substring(0, delic);
// ohodnocen ma by retezec 0 a delic udava pocet znaku z leve strany, 
// ktere maji byt pouzity jako startovaci cara
string2 = displej.substring(delic);
// ohodnocen ma byt retezec delic
delkaVyrazu = disdelka-string2.length-1;
// delkaVyrazu = delka displej - ciselne ohodnoceny pocet znaku promenne string2 - 1
// -1 protoze jednu pozici zabira znamenko
displej = string1.substr(0, delkaVyrazu)+string2;
// displej = ohodnoceny string1 (napr. 2.123456) + string2 (napr. e+22)
}
if (displej.length>disdelka-1 && parseFloat(displej)>parseFloat(porovnani)) {
// pokud bude cislo delsi nez delka displeje (napr. 1234567890123456789), 
// jsou vynechana nadbytecna des. mista a cislo se uvede v exponencialnim tvaru
num = Math.round(parseFloat(displej));
// zaokrouhli displej
stringNum = num.toString();
// num je prevedeno na string; funkce toString zarucuje, ze bude pracovano s textovym retezcem,
// protoze retezcove operace s cisly nefunguji
pocetDesitek = stringNum.length-1;
// napr. delka stringNum je 10, pocet desitek pak 10-1=9
apendix = "e+"+pocetDesitek;
// apendix = e+9
delkaVyrazu = disdelka-apendix.length-1;
// delkaVyrazu = disdelka napr. 10 - 2 - 1 = 7
meziVypocet = (num/Math.pow(10, pocetDesitek)).toString();
// meziVypocet = (num/Math.pow(10,9)).toString(); vydeli tedy zaokrouhleny displej cislem
// 1000000000 a prevede na string
displej = meziVypocet.substr(0, delkaVyrazu)+apendix;
// displej = hodnota meziVypocet, kdy je pouzito 7 cisel zleva a prida se apendix = napr. 1234567e+9
}
if (displej.length>disdelka-1) {
// pokud je cislo delsi nez delka displeje, jsou vynechana nadbytecna des. mista
displej = displej.substr(0, disdelka-1);
if (displej.indexOf(".") == displej.length-1) {
// pokud je posledni znak po oriznuti des. tecka, vymaze se
delicT = displej.indexOf(".");
displej = displej.substring(0, delicT);
}
}
displej = znamenko+displej;

Number.toString
Syntaxe: myNumber.toString (zaklad);
Argument: zaklad specifikuje numerický základ (od 2 k 36) k použití pro number-to-string přeměnu. Jestliže nespecifikujete zaklad, implicitní hodnota je 10.
Popis: Metoda; vrací řetězcovou reprezentaci specifikovaného číselného objektu myNumber. Funkce toString zaručuje, že bude pracováno s textovým řetězcem, protože řetězcové operace s čísly nefungují.
Příklad:  
myNumber = new Number (1000);
(1000).toString (2);
Vrací řetězec, který obsahuje binární reprezentaci čísla 1000.

String.indexOf
Syntaxe: myString.indexOf (hodnota); myString.index of (hodnota, start);
Argumenty: 
hodnota je celé číslo nebo řetězec, který specifikuje podřetězec hledaný uvnitř myString
start je celé číslo, které specifikuje výchozí bod podřetězce, tento argument je nepovinný
Popis: Metoda; hledá řetězce a vrací pozici prvního výskytu z hodnoty, jestliže hodnota neexistuje, metoda vrací -1.
Příklad:  
myNumber = new Number (1000);
(1000).toString (2);
Vrací řetězec, který obsahuje binární reprezentaci čísla 1000.

Tuto funkci kontrola zavoláme do vrstvy vypocty, přidáme ji tedy do funkce vypocty následujícím zápisem - kontrola(); stejně jako do vrstvy proc, tedy funkce proc, a rovněž ji využijeme pro kontrolu délky displeje při změně znaménka (+/-). A to není všechno, kontrolovat musíme veškerá tlačítka, které nejsou zahrnuty do funkce vypocty nebo nejsou konstantami, takže do těchto tlačítek zavoláme funkci kontrola (sin, cos, tag, log, ...).

Určitě jste si všimli, že jsem jednotlivým tlačítkům přiřazoval pro lepší ovládání i klávesy, a pro ještě větší přehlednost si uděláme malou nápovědu nebo mapu kláves, kterými lze kalkulačku ovládat.
 

Tutéž nápovědu můžeme udělat i ve Flashi nějakým nápaditým způsobem - určitě vytvoříme tlačítko s otazníkem, u něhož se po kliknutí objeví nápověda s danými klávesami, ale to už nechám na vás. Samozřejmě si můžete klávesy předefinovat podle vlastních potřeb.

Zdrojový soubor po úpravě délky displeje.