Nové výhodné předplatné namísto kreditů je tu! Více informací. Upravili jsme také naše provozní podmínky.
NOVINKA: Staň se datovým analytikem a získej jistotu práce, lepší plat a nové kariérní možnosti. Více informací:

Lekce 10 - Aplikace ToDo - Navigace a dokončení

V minulé lekci, Aplikace ToDo - Využití AsyncStorage, jsme začali pracovat na ToDo aplikaci a seznámili jsme se s AsyncStorage.

V následujícím tutoriálu vývoje multiplatformních mobilních aplikací v React Native se především naučíme pracovat s více stránkami. Zaměříme se na vzhled naší ToDo aplikace, její logiku a navigaci. Celou ToDo aplikaci dokončíme.

Aplikace s více stránkami

Jelikož budeme chtít pracovat s více úkoly najednou, budeme v aplikaci potřebovat dvě různé stránky. Konkrétně to bude:

  • stránka pro výpis úkolů (ToDoListPage),
  • stránka pro vytvoření nebo editaci úkolu (ToDoDetailPage).

Stránky do projektu přidáme do nové složky Routes/ a pojmenujeme je ToDoListPage.js a ToDoDetailPage.js.

Navigace

Aby bylo možné se mezi stránkami přepínat, budeme potřebovat navigaci, a tedy i nějakou tu logiku. My budeme využívat knihovnu React Navigation. Každá stránka v React Native je reprezentována komponentou a je uložena v navigačním zásobníku. Navigační zásobník funguje na principu Last-in, First-out, což znamená, že poslední stránka, kterou jsme otevřeli, bude ta, na kterou se vrátíme jako první.

Knihovna React Navigation poskytuje tři základní metody pro navigaci mezi stránkami:


 

...konec náhledu článku...
Pokračuj dál

Znalosti v hodnotě stovek tisíc získáš za pár korun

Došel jsi až sem a to je super! Věříme, že ti první lekce ukázaly něco nového a užitečného.
Chceš v kurzu pokračovat? Přejdi do prémiové sekce.

Před koupí tohoto článku je třeba koupit předchozí díl

Obsah článku spadá pod licenci Premium, koupí článku souhlasíš s Provozními podmínkami.

Co od nás v dalších lekcích dostaneš?
  • Přístup k jednotlivým lekcím dle způsobu pořízení.
  • Kvalitní znalosti v oblasti IT.
  • Dovednosti, které ti pomohou získat vysněnou a dobře placenou práci.

Popis článku

Požadovaný článek má následující obsah:

V tutoriálu React Native vytvoříme vzhled aplikace a dokončíme logiku ToDo aplikace. Naučíme se využívat navigaci mezi více stránkami.
Článek pro vás napsal Štěpán Kraus
Avatar
Aktivity