V tomto bloku si ukážeme aplikáciu Moo!, kde ukážeme:

• prehrávanie zvukov cez MediaPlayer
• použitie obrázkov cez vykresliteľné prostriedky aplikácie, tzv. drawables
• úvod do životného cyklu aplikácie

Vízia aplikácie¶

Aplikácia bude obsahovať statický obrázok kravy, na ktorý môžeme kliknúť a počuť zabučanie.

Áno, to je všetko. Ak je to kravina (ehm), pozrite si na úspešnú aplikáciu Yo!

Kostra projektu¶

Kostra projektu obsahuje dva elementy. Nájdeme v ňom:

• obrázok kravy
• a zvuk bučania v .mp3.

Stiahnite si kostru projektu, aby ste ju o pár krokov využili pri nastavení vášho projektu.

Založenie novej aplikácie¶

Vytvorme v Android Studiu nový projekt s názvom Krava.

Používateľské rozhranie a.k.a. GUI¶

Používateľské rozhranie bude tvorené jedným obrázkom.

Otvoríme súbor pre layout a prepneme sa do textového režimu.

Zadefinujeme jediný komponent ImageView, ktorý bude obsahovať obrázok kravy.

<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/cow"
    android:onClick="cowClick"
    />

Definujeme štyri elementy. Šírka a výška (layout_width a layout_height) sa budú prispôsobovať obrázku (wrap_content). Ak je obrázok príliš veľký, naškáluje sa tak, aby sa zmestil na displej.

Atribút android:src s hodnotou @drawable/cow obsahuje odkaz na zatiaľ neexistujúci drawable resource (vykresliteľný prostriedok). Keďže Android Studio zatiaľ nepodporuje priamy import obrázkov do kódu aplikácie, musíme to urobiť ručne. V hlavičke okna Studia vidíme cestu k adresáru s našim projektom. Pomocou Prieskumníka či iného správcu súborov sa dopracujme do adresára app/src/main/res/drawable v projekte. Ak adresár drawable neexistuje, musíme ho vytvoriť.

Na mojom stroji je to v adresári c:\Users\novotnyr\AndroidStudioProjects\Krava\app\src\main\res\drawable.

Ak sa vrátime do Studia, uvidíme v strome projektu v položke drawables náš obrázok.

Poslednou položkou je atribút onClick, ku ktorému sa vrátime neskôr.

Odkaz na drawable¶

Zároveň sa tým opraví odkaz na @drawable/cow. Predpona @drawable/ znamená odkaz na súbor v adresári drawable. Názov súboru za predponou sa udáva bez prefixu, ktorú si Android doplní sám. Podporované obrázky sú: .png, .jpg, .gif a to v tomto poradí.

Spustíme aplikáciu!¶

Už teraz môžeme skúsiť spustiť aplikáciu. Uvidíme finálne používateľské rozhranie!

Aplikácia teraz nedokáže robiť nič. Ak sa podarí omylom "kliknúť" na obrázok, aplikácia spadne!

Force Close¶

Sme svedkami úkazu familiárne nazývaného Force Close, ktorý zodpovedá pádu aplikácie. V programe nastala chyba, ktorú sme neošetrili a operačný systém ho ukončil a oznámil nám to.

Príčinu pádu aplikácie uvidíme v Studiu, v okne Logcat, kde uvidíme javácku výnimku vedúcu k pádu aplikácie.

Oprava Force Close -- obsluha klikania na kravu¶

Aplikácia padá, pretože sme korektne neobslúžili kliknutie na obrázok kravy.

V layoutovom súbore sme definovali:

android:onClick="cowClick"

To znamená, že v kóde aktivity sa hľadá Java metóda s nasledovnou hlavičkou:

public void cowClick(View v)

Je jasné, že metóda tam nie je a preto aplikácia radostne umrie, pretože nevie, čo má robiť po našom kliku.

Dodajme tam obsluhu!¶

Obsluha kravokliku bude jednoduchá: spustíme prehrávanie MP3ky s bučaním.

Prehrávač médií a raw resources¶

Na bučanie budeme potrebovať dve veci: samotnú MP3ku so zvukom a prehrávač médií.

MP3 so zvukom¶

MP3ka so zvukom predstavuje typ assetu, či prostriedku, ktorý sa musí pribaliť k aplikácii presne tak, ako sa to deje s obrázkami. Na zaradenie takýchto neobrázkových prostriedkov existuje špeciálny adresár raw. Vytvorme ho opäť ručne v Prieskumníkovi, Finderovi, či inom správcovi súborov tak, aby bol "súrodencom" adresára drawable a skopírujme doňho MP3ku s bučaním.

Na mojom počítači bude bučanie v adresári ˙C:\Users\novotnyr\AndroidStudioProjects\Krava\app\src\main\res\raw\cow.mp3`

Prehrávač médií¶

Na prehratie bučania použijeme zabudovanú triedu MediaPlayer, ktorá dokáže veľmi jednoducho prehrávať raw prostriedky.

Ak ho chceme korektne použiť, potrebujeme spoznať základné metódy životného cyklu aktivity.

Životný cyklus aktivity: časť 1.¶

Aktivita v Androide prechádza rozličnými fázami životného cyklu: od pôrodu až po zánik a vie na jednotlivé prepínania fáz reagovať.

Fáz života je mnoho, ale zatiaľ si spomenieme tri:

• pôrod aktivity
• odchod aktivity na pozadie, ak je prekrytá inou aktivitou
• príchod aktivity na popredie.

Pôrod aktivity¶

Na pôrod aktivity môžeme reagovať metódou onCreate(). V tejto metóde sa tradične definuje layout prvkov v aktivite, ktorý vznikne načítaním a spracovaním layout súboru v XML.

V našom prípade sa zavolá rodičovská implementácia a načíta sa súbor v XML prostriedku activity_main, ktorý zodpovedá súboru activity_main.xml v adresári layout.

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

}

Android automaticky naparsuje XML a zobrazí príslušné komponenty.

Príchod aktivity na popredie¶

Takmer ihneď po pôrode prichádza aktivita na popredie a stáva sa tak aktívnou, čiže je k dispozícii používateľovi, ktorý môže do nej „patlať prstami”. Na túto udalosť môžeme reagovať metódou onResume().

To je skvelé miesto, kde môžeme vytvoriť inštanciu nášho prehrávača médií!

@Override
protected void onResume() {
    super.onResume();
    mediaPlayer = MediaPlayer.create(this, R.raw.cow);
}

Nezabudneme zavolať rodičovskú implementáciu cez super.onResume(). Inak sa neinicializuje rodičovská implementácia a môžu sa diať fakt čudné veci (FČV!).

Prehrávač médií MediaPlayer vytvoríme pomocou továrenskej metódy create(), kde dodáme dva parametre: kontext (teda aktivitu, ktorá bude vlastníkom prehrávača, v tomto prípade ja) a odkaz na súbor s MP3 súborom.

Ak sa chceme odkázať na prostriedok v súbore, máme v kóde k dispozícii triedu s poetickým názvom R (R ako resource), kde raw znamená odkaz na adresár raw a cow odkaz na súbor cow.mp3. Podobne ako v prípade obrázkov ImageView sa prípony súborov zanedbajú.

Prehrávač médií budeme potrebovať aj v iných metódach, preto ho uložíme do inštančnej premennej aktivity:

private MediaPlayer mediaPlayer;

Odchod aktivity na popredie¶

Protipólom udalosti "prichádzam na popredie" je odchod na pozadie. Deje sa vo chvíli, keď súčasnú aktivitu prekrýva iná aktivita. Volá vám niekto? Zjaví sa aktivita s možnosťou zdvihnutia či zrušenia hovoru, a vaše kravy odchádzajú na pozadie.

Táto udalosť sa odohrá aj v prípade, že je vaša aktivita prekrytá len čiastočne, teda je ju vidieť na pozadí, ale je prekrytá inou aktivitou.

Reagovať na tútu aktivitu možno v metóde onPause(). Názov pauza nie je nečakaný: vašu aktivitu je možné vidieť, ale všetko v nej by sa malo pozastaviť.

Pauza a prehrávač médií¶

Ak aktivita odchádza do diaľav, treba ju zastaviť a to je dôvod, prečo treba vypnúť aj prehrávač médií. Ak prehrávač médií nevypneme, ostane visieť na pozadí a bude zbytočne požierať systémové prostriedky a tým pádom vyčerpávať drahocennú baterku.

Uvoľnenie prehrávača médií dosiahneme jeho metódou release().

@Override
protected void onPause() {
    mediaPlayer.release();
    super.onPause();
}

Späť k prehrávaču médií!¶

Ak už ovládame správne vytváranie a rušenie prehrávača médií, môžeme ho konečne použiť!

Pamätáte si na metódu obsluhujúcu klik? Teda tú, ktorú sme "zabudli" dopísať? Je najvyšší čas.

public void cowClick(View v) {
    mediaPlayer.start();
}

Vždy, keď klikneme na kravu, spustí sa prehrávanie prostriedku, ktorý je obsluhovaný naším prehrávačom.

Záver¶

To je všetko! Máme jednoduchú aplikáciu, na ktorej sme si ukázali hneď sedem vecí a v budúcnosti na tom môžeme stavať.

Zdrojové kódy celej aplikácie sú zverejnené na GitHube.