Příklad: Vytvoření základní aplikace. Jak vytvořit flash aplikaci ve flash editoru Flash aplikace
Každý, kdo má zájem o vytváření aplikací pro VKontakte, se připojte ke skupině VKontakte vk.com/club17157755. V něm se dozvíte o nových lekcích a zdrojích, které vám pomohou naučit se vytvářet vlastní aplikace ve VKontakte.
Abyste mohli vytvořit vlastní aplikaci ve VKontakte, potřebujete znalosti programování. Proces získávání těchto znalostí je velmi dlouhý a obtížný. Budete muset přečíst spoustu knih a hodně cvičit. Pokud nemáte osobního učitele, budete muset na spoustu věcí přijít sami.
Jste připraveni věnovat několik let učení programování? Pak na tomto webu najdete užitečné materiály, které vám pomohou začít rozumět programování. Další znalosti získáte v procesu samostatné praxe, kdy už víte, jakou knihu o konkrétním programovacím jazyce číst.
Jak se naučit programovat
Vytváření aplikací v kontaktu je programování. Bez schopnosti programovat nebudete moci okamžitě začít vytvářet dobré aplikace.
Chcete-li se naučit vytvářet kontaktní aplikace, musíte se nejprve naučit kódovat. Musíte pochopit, co jsou proměnné, funkce, podmínky, smyčky atd. Než se začnete pokoušet vytvořit aplikaci speciálně pro kontakt, musíte získat základy programování.
Pro ty, kteří mají s programováním málo zkušeností nebo se s programováním vůbec nesetkali, v tématu „Všem začátečníkům v programování! “popisuje, kolik úsilí musíte vynaložit, abyste pochopili základy programování.
Vývoj flash aplikací pro VKontakte
Vývoj aplikací VKontakte
Teprve poté, co se naučíte základy programování, můžete přejít k učení, jak vytvořit aplikaci pro sociální síť VKontakte.
V závislosti na tom, jaký typ aplikace jste si vybrali - Flash nebo IFrame, si můžete přečíst lekce, které vám pomohou zjistit, jak pracovat s VKontakte API.
Pokud se nechcete učit programovat
Pokud se nechcete učit programovat, můžete si zkusit vytvořit vlastní aplikaci VKontakte IFrame pomocí služby 3apps.ru - IFrame Application Designer.
Problémy při vytváření aplikací
Pokud máte malé zkušenosti s programováním nebo je úkol obtížný i pro profesionály, můžete požádat o pomoc
Začněme
Chcete-li vytvořit flash aplikaci, musíte o ní mít konkrétní představu. Jde o to, abyste si promysleli alespoň hrubý scénář aplikace. Poté můžete začít pracovat přímo ve flash editoru.
Nejprve musíte určit velikost budoucí aplikace. Pokud se jedná například o standardní banner, jeho rozměry budou 468 mm x 60 mm. Tyto parametry zadejte v části Vlastnosti filmu v polích Šířka a Výška – označují šířku a výšku. Poté vyberte barvu hlavního pozadí flash aplikace. Pro dokončení nastavení zadejte počet snímků za sekundu do pole Frame Rate.
S vytvořením flash aplikace vám pomůže speciální program
Ihned po dokončení nastavení klikněte levým tlačítkem myši na tlačítko OK. Nyní přichází na řadu samotný flash editor, který vám pomůže vytvořit flashovou aplikaci.
Začínáme vytvářet animované aplikace – například pohyblivý nápis. Chcete-li to provést, vyberte nástroj Text a otevřete panel nastavení – Panely oken Znaky. V zobrazené nabídce Písmo klikněte na panel Znaky a vyberte písmo, například Times New Roman. Nastavte jeho barvu a požadovanou velikost, například 26, napište jim zprávu nebo návrh. Základní základ vaší flashové aplikace je připraven!
Flashovou aplikaci můžete vytvořit v animované podobě
Poté to můžete udělat. Chcete-li to provést, musíte převést to, co jste napsali, na symbol. Chcete-li to provést, použijte příkaz Vložit Převést na symbol. Pojmenujte jej také, abyste jej mohli později uložit na pevný disk.
Poté vyberte snímek č. 20 na časové ose a vložte úplně první, tzv. klíčový snímek, příkazem Vložit klíčový snímek. V tomto případě na levé straně nového rámečku uvidíte šedý pruh běžící ve směru klíčového rámečku.
Nyní stačí flashovou aplikaci aktivovat. Chcete-li to provést, vraťte se znovu k prvnímu snímku a přesuňte vytvořený nápis za jeho okraj na libovolné místo za pravý okraj. Poté, aniž byste odstranili výběr z prvního snímku, otevřete panel Rámeček panelů oken a okamžitě přepněte na kartu Rámeček.
Jediné, co musíte udělat, je vybrat typ animace, kterou potřebujete, z nabídky Tweening. Ihned poté se šedý pruh oddělující klíčové rámečky změní na modrý. To je vše, jednoduchá flashová aplikace je připravena!
ActionScript 3.0 lze použít v několika prostředích pro vývoj aplikací, včetně nástrojů Flash Professional a Flash Builder a libovolného textového editoru.
Tento příklad vás provede kroky k vytvoření a modernizaci jednoduché aplikace ActionScript 3.0 pomocí Flash Professional nebo Flash Builder. Aplikace, kterou vytvoříte, je jednoduchý model pro použití externích souborů třídy ActionScript 3.0 v nástrojích Flash Professional a Flex.
Návrh aplikace ActionScript
Tento příklad je standardní aplikací jazyka ActionScript s názvem „Hello World“, která má jednoduchou strukturu.
Aplikace se jmenuje HelloWorld.
Zobrazí jediné textové pole se slovy "Hello World!"
Aplikace používá jednu objektově orientovanou třídu Greeter. Tato struktura umožňuje použití třídy v projektu Flash Professional nebo Flex.
Tento příklad nejprve vytvoří základní verzi aplikace. Poté jsou přidány funkce, aby uživatel mohl zadat své jméno a aplikace zkontroluje, zda je jméno v seznamu známých uživatelů.
Po této stručné definici můžete začít vytvářet aplikaci.
Vytvoření projektu HelloWorld a třídy Greeter
Návrhový brief aplikace Hello World uvádí, že její kód by měl být snadno znovu použitelný. K dosažení tohoto cíle používá aplikace jedinou objektově orientovanou třídu Greeter. Tato třída se používá v aplikaci vytvořené v aplikaci Flash Builder nebo Flash Professional.
Vytvoření projektu HelloWorld a třídy Greeter ve Flex
V aplikaci Flash Builder zvolte Soubor > Nový > Projekt Flex.
Do pole Název projektu zadejte HelloWorld. Ujistěte se, že je Typ aplikace nastaven na "Web (spouští v Adobe Flash Player)" a potom klikněte na Dokončit.
Flash Builder vytvoří projekt a zobrazí jej v okně Průzkumník balíčků. Ve výchozím nastavení projekt obsahuje soubor s názvem HelloWorld.mxml, který se otevře v editoru.
Chcete-li nyní vytvořit vlastní soubor třídy ActionScript v aplikaci Flash Builder, zvolte Soubor > Nový > Třída jazyka ActionScript.
V dialogovém okně Nová třída jazyka ActionScript do pole Název zadejte Pozdravit jako název třídy a klikněte na Dokončit.
Chcete-li vytvořit třídu Greeter v aplikaci Flash Professional, postupujte takto:
V aplikaci Flash Professional zvolte Soubor > Nový.
V dialogovém okně Nový dokument vyberte soubor ActionScript a klepněte na OK.
Nyní se zobrazí okno pro úpravu nového souboru ActionScript.
Třída Greeter definuje objekt Greeter, který se používá v aplikaci HelloWorld.
Přidání kódu do třídy Greeter
Zadejte následující kód do nového souboru (některý kód již mohl být přidán):
Balíček ( public class Greeter ( veřejná funkce sayHello():String ( var pozdrav:String; pozdrav = "Ahoj světe!"; zpětný pozdrav; ) ) )
Třída Greeter obsahuje jednu metodu, sayHello(), která vrací řetězec s frází "Hello World!"
Chcete-li uložit tento soubor ActionScript, zvolte Soubor > Uložit.
Třída Greeter je nyní připravena k použití ve vaší aplikaci.
Vytvořte aplikaci pomocí kódu ActionScript
Třída Greeter, kterou jsme právě vytvořili, definuje samostatnou sadu softwarových funkcí, ale nepředstavuje úplnou aplikaci. Chcete-li třídu použít, musíte vytvořit dokument Flash Professional nebo projekt Flex.
Při vytváření kódu musíte použít instanci třídy Greeter. Následující text popisuje postup pro použití třídy Greeter v aplikaci.
Chcete-li vytvořit aplikaci ActionScript pomocí nástroje Flash Professional, postupujte takto:
Zvolte Soubor > Nový.
V dialogovém okně Nový dokument vyberte Soubor Flash (ActionScript 3.0) a klepněte na OK.
Otevře se okno pro vytvoření dokumentu.
Na paletě nástrojů Flash Professional vyberte textový nástroj. Přetažením na scénu definujte nové textové pole, které je přibližně 300 pixelů široké a 100 pixelů vysoké.
Na panelu Vlastnosti s textovým polem stále vybraným v pracovní oblasti nastavte typ textu na Dynamický text a zadejte mainText jako název instance textového pole.
Klepněte na první snímek časové osy. Otevřete panel Akce výběrem Okna > Akce.
Na panelu Akce zadejte následující skript:
Var myGreeter:Greeter = new Greeter(); mainText.text = myGreeter.sayHello();
Uložte soubor.
Chcete-li vytvořit aplikaci ActionScript pomocí nástroje Flash Builder, postupujte takto:
Štítek
Štítek
Štítek
Štítek
Otevřete soubor HelloWorld.mxml a přidejte kód podle následujícího výtisku:
Tento projekt Flex obsahuje čtyři značky MXML:
Kód ve značce
Chcete-li aplikaci uložit, zvolte Soubor > Uložit.
Publikování a testování aplikace ActionScript
Vývoj softwaru je interaktivní proces. Jakmile je kód napsán, musí být kompilován a upravován, dokud plně nesplňuje cíle. Musíte spustit zkompilovanou aplikaci a ověřit, že provádí úkoly popsané v zadání. Pokud ne, musíte kód upravovat, dokud nezískáte požadovaný výsledek. Vývojová prostředí Flash Professional a Flash Builder poskytují několik způsobů, jak publikovat, testovat a ladit aplikace.
Níže jsou uvedeny hlavní kroky pro testování aplikace HelloWorld v každém ze zmíněných prostředí.
Chcete-li publikovat a otestovat aplikaci ActionScript pomocí nástroje Flash Professional, postupujte takto:
Publikujte svou aplikaci a zkontrolujte, zda v ní nejsou chyby kompilace. V aplikaci Flash Professional zvolte Spravovat > Testovat film, zkompilujte kód ActionScript a spusťte aplikaci HelloWorld.
Pokud otestujete svou aplikaci a uvidíte chyby a varování v okně Výstup, opravte chyby v souboru HelloWorld.fla nebo HelloWorld.as. Poté znovu zkontrolujte aplikaci.
Pokud se nevyskytnou žádné chyby při kompilaci, zobrazí se v okně přehrávače Flash Player aplikace Hello World.
Po úspěšném vytvoření jednoduché, ale úplné objektově orientované aplikace ActionScript 3.0 můžete začít .
Chcete-li publikovat a otestovat aplikaci ActionScript pomocí nástroje Flash Builder, postupujte takto:
Pokud otestujete svou aplikaci a uvidíte chyby a varování v okně Výstup, opravte chyby v souboru HelloWorld.mxml nebo Greeter.as. Poté znovu zkontrolujte aplikaci.
Pokud se nevyskytnou žádné chyby kompilace, v okně prohlížeče, které se otevře, se objeví aplikace Hello World. Na obrazovce by se měl zobrazit text „Ahoj světe!“
Vyberte Spustit > Spustit HelloWorld.
Spustí se aplikace HelloWorld.
Poté, co úspěšně vytvoříte jednoduchou, ale kompletní objektově orientovanou aplikaci ActionScript 3.0, můžete začít s modernizací aplikace HelloWorld.
Upgrade aplikace HelloWorld
Aby byla aplikace zajímavější, můžete do ní zadat potvrzení uživatelského jména po kontrole s daným seznamem jmen.
Nejprve musíme aktualizovat třídu Greeter a rozšířit její funkčnost. Dále byste měli aplikaci aktualizovat, aby mohla využívat nové funkce.
Aktualizace souboru Greeter.as
Otevřete soubor Greeter.as.
Změňte obsah souboru následovně (nové a změněné řádky jsou vyznačeny tučně):
Balíček ( public class Greeter ( /** * Definuje jména, která obdrží správný pozdrav. */ public static var validNames:Array = ["Sammy", "Frank", "Dean"]; /** * Vytvoří řetězec pozdravu pomocí zadaného jména. */ veřejná funkce řekni Ahoj( uživatelské jméno:String = ""):String ( var pozdrav:String; if (uživatelské jméno == "") { greeting = "Dobrý den. Zadejte prosím své uživatelské jméno a poté stiskněte klávesu " + "Enter."; } else if (validName(userName)) { pozdrav = "Dobrý den, " + uživatelské jméno + "."; } jiný { pozdrav = "Omlouvám se " + uživatelské jméno + ", nejste na seznamu."; } zpětný pozdrav; ) /** * Kontroluje, zda je jméno v seznamu validNames. */ veřejná statická funkce validName(inputName:String = ""):Boolean { if (validNames.indexOf(inputName) > -1) { vrátit true; } jiný { vrátit false; } } } }
Třída Greeter má nyní nové vlastnosti:
Pole validNames obsahuje seznam povolených uživatelských jmen. Po načtení třídy Greeter je pole nastaveno na seznam tří jmen.
Metoda sayHello() převezme uživatelské jméno a změní pozdrav v závislosti na určitých podmínkách. Pokud je uživatelské jméno userName zadáno jako prázdný řetězec (""), vlastnost pozdravu je nastavena tak, aby vyžadovala zadání uživatelského jména. Pokud je uživatelské jméno přijato, pozdrav vypadá takto: „Dobrý den, uživatelské jméno.“ A nakonec, pokud nejsou splněny předchozí dvě podmínky, proměnná pozdravu se nastaví takto: „Promiňte uživatelské jméno, nejste na seznamu." („Omlouváme se, [uživatelské jméno], nejste na seznamu“).
Metoda validName() vrátí hodnotu true, pokud je zadaný inputName nalezen v poli validNames, a vrátí hodnotu false, pokud se název nenajde. Příkaz validNames.indexOf(inputName) kontroluje každý řádek pole validNames proti řetězci zadaného názvu, inputName . Metoda Array.indexOf() vrací pozici indexu první instance objektu v poli. Vrátí -1, pokud objekt není v poli nalezen.
Potom musíte upravit soubor aplikace, ve kterém existuje odkaz na třídu jazyka ActionScript.
Chcete-li změnit aplikaci pomocí nástroje Flash Professional, postupujte takto:
První dva řádky jednoduše nastavují hranice pro dvě textová pole.
Vstupní textové pole, jako je textIn , má sadu událostí, které může distribuovat. Metoda addEventListener() umožňuje zadat funkci, která se spustí, když dojde k události určitého typu. V tomto případě bude touto událostí stisknutí klávesy na klávesnici.
Vlastní funkce keyPressed() kontroluje, zda bude stisknuta klávesa Enter. Pokud je stisknuta požadovaná klávesa, metoda sayHello() objektu myGreeter předá text z textového pole textIn jako parametr. Tato metoda vrací pozdravný řetězec na základě hodnoty, která jí byla předána. Vrácený řetězec je pak přiřazen k vlastnosti text textového pole mainText.
Otevřete soubor HelloWorld.fla.
Změňte skript ve snímku 1 tak, aby prázdný řetězec ("") přešel do metody sayHello() třídy Greeter:
Var myGreeter:Greeter = new Greeter(); mainText.text = myGreeter.sayHello("");
Vyberte textový nástroj z palety Nástroje. V pracovní oblasti vytvořte dvě nová textová pole. Umístěte je vedle sebe pod stávající textové pole hlavního textu.
Do prvního nového textového pole, kterým je štítek, zadejte text uživatelské jméno:.
Vyberte jiné textové pole a nastavte jeho typ v inspektoru Vlastnosti na Vložit text. Jako typ čáry vyberte Single line. Vstupte textIn jako název instance.
Klepněte na první snímek časové osy.
V panelu Akce přidejte na konec existujícího skriptu následující řádky:
MainText.border = true; textIn.border = true; textIn.addEventListener(KeyboardEvent.KEY_DOWN, keyPressed); function keyPressed(event:KeyboardEvent):void ( if (event.keyCode == Keyboard.ENTER) ( mainText.text = myGreeter.sayHello(textIn.text); ) )
Nový kód přidává následující funkce:
Kompletní skript pro snímek 1 vypadá takto:
Var myGreeter:Greeter = new Greeter(); mainText.text = myGreeter.sayHello(""); mainText.border = true; textIn.border = true; textIn.addEventListener(KeyboardEvent.KEY_DOWN, keyPressed); function keyPressed(event:KeyboardEvent):void ( if (event.keyCode == Keyboard.ENTER) ( mainText.text = myGreeter.sayHello(textIn.text); ) )
Uložte soubor.
Chcete-li spustit aplikaci, vyberte příkazy „Spravovat“ > „Testovat film“.
Při spuštění aplikace budete vyzváni k zadání uživatelského jména. Pokud je jméno programem akceptováno, objeví se potvrzovací zpráva „ahoj“.
Chcete-li upravit aplikaci pomocí nástroje Flash Builder, postupujte takto:
Otevřete soubor HelloWorld.mxml.
Poté změňte štítek
Nyní přidejte následující řádky přímo za uzavírací značku
Atribut enter určuje akce, které se provedou, když uživatel stiskne klávesu Enter v poli userNameTxt. V tomto příkladu kód předá text zadaný do pole metodě Greeter.sayHello(). Pozdrav v poli mainTxt se odpovídajícím způsobem změní.
Soubor HelloWorld.mxml vypadá takto:
Uložte upravený soubor HelloWorld.mxml. Pro spuštění aplikace vyberte Spustit > Spustit HelloWorld.
Při spuštění aplikace budete vyzváni k zadání uživatelského jména. Pokud program přijme jméno (Sammy, Frank nebo Dean), zobrazí se potvrzovací zpráva „Ahoj, uživatelské jméno».
Před zahájením samotného příspěvku si přečtu malé prohlášení:
Před vytvořením nové aplikace se musíte zamyslet, co je pro vás, co je pro ostatní, bude to prospěšné pro ostatní, můžete na aplikaci dokonce vydělat dobré peníze! Další podrobnosti o - pravidla pro umístění aplikací. Pokud jste o všem přesvědčeni, můžeme začít!
Úvod
Aplikaci napíšeme v jazyce ActionScript 3.0, což je aktuálně nejnovější a nejpohodlnější verze. Nebojte se, žádné velké potíže zde nebudou! Softwarové prostředí pro vývoj aplikace ve Flashi si můžete vybrat sami, ale doporučuji Adobe Flash Professional a vysvětlím proč:- Není to poprvé, co jsem na tom pracoval, takže mohu s jistotou říci, že je to snadné
- Neklade hranice mezi funkčností a designem
- Můžete dokonce vytvářet aplikace pro telefony
Kde začít? Spojovací rámy.
Vytvořte dokument ActionScript:V okně „Časová osa“ vytvořte „vrstvy“, uložte jejich název a pořadí: 
Každých 5 snímků stiskněte „F6“, na konci „F5“. Mělo by to vypadat jako na snímku obrazovky.
Myslím, že zde není co vysvětlovat:
Vrstva „ActionScript“ je místo, kde bude kód umístěn.
Vrstva „Značky“ - aby se snímky neztratily z dohledu, budou očíslovány, ale téměř jako další vrstva.
Vrstva „Tlačítka“ – obsahuje tlačítka, která budou na stejné pozici v celém projektu, také s vrstvami „Pozadí“ a „Materiály“. Nyní očíslujme snímky, ne nadarmo vznikla vrstva „Značky“. Klikněte na rámečky, které jste vytvořili ve vrstvě „Značky“, viz typ „Rámec“, zadejte název rámečku. 
Vrstva „Značky“ nemá žádný zvláštní účel, jsou vytvořeny pouze jako pomoc. Takže jsme se naučili vytvářet rámy!
Symboly a zdroje
Teď to bude stejně snadné jako dřív. Klikněte na vrstvu „Pozadí“ na libovolném snímku a vložte obrázek z počítače. Nejprve to bude jako rastrový obrázek, tam můžeme změnit šířku, výšku. Pozadí necháme tak, jak je.
Stejný postup provedeme s vrstvou „Tlačítka“, pouze nyní převedeme rastrový obrázek na symbol kliknutím pravým tlačítkem na „Převést na symbol“:
Instanci tlačítka nazýváme, jak chceme. Říkejme tomu „Postava 1“. Typ: Fragment videa. Poté přiřadíme název instance samotnému symbolu a jeho typu, jak je znázorněno na snímku obrazovky:
Aktivace stránky
Dále musíme stránky aktivovat přes vrstvu „ActionScript“, kliknout na vrstvu a stisknout „F9“. Zobrazí se prázdné okno pro aktivaci, zadejte kód:Importovat flash.events.MouseEvent;
stop();
btn1.addEventListener(MouseEvent.CLICK,OnClickDve);
Funkce OnClickDve(e:MouseEvent):void
{
gotoAndStop("Dva");
}
Myslím, že přijdeš na to, co je co! Poznámka: při spuštění aplikace se nejprve spustí rám Adyn.
Vyplnění přihlášky s materiály
Klikněte na vrstvu „Materiály“, konkrétně na ty rámečky, pod kterými jsou ve vrstvě „Značky“ označeny slovem „Adyn“, princip načítání fotografie je stejný, takže zbytek bude snadný a můžete také stáhněte si test!
Chcete-li zkontrolovat, zda jsem vás oklamal, klikněte na „Spravovat, testovat video, testovat video“. Klikněte na tlačítko vlevo nahoře a zobrazte text!
