Welche Art von Anwendung werden wir hier in diesem Modul erstellen?
Wir werden eine Essens-App erstellen, eine App, in der wir einige Rezepte anzeigen, einige Favoriten favorisieren und auch Rezepte filtern können.
Dazu benötigen wir in dieser Anwendung eine Navigation.
Wir haben dort unsere Kopfzeile mit einem Titel in der Mitte und einem Menüknopf hier links,
mit dem wir eine Seitenschublade öffnen können, auf
die ich gleich zurückkommen werde, und am Ende dieser Seite
hier Wir haben Registerkarten, wir haben zwei Registerkarten - eine für alle Mahlzeiten, alle Rezepte und eine für unsere Favoriten, die wir
natürlich in dieser App hinzufügen können.
Jetzt auf dieser ganzen Seite haben wir ein Raster von
Kategorien, also im Grunde genommen etwas wie italienisches, exotisches, vielleicht deutsches Essen, also im Grunde verschiedene Lebensmittelkategorien, und wenn wir
auf eine dieser Kategorien
tippen, werden wir auf einem zweiten Bildschirm angezeigt Wo wir dann oben einen Zurück-Button haben, um
mit einem anderen Titel, dem Kategorietitel, zurückzukehren, und auf
diesem Bildschirm haben wir dann die Rezepte.
Dort haben wir also mehrere solcher Karten mit beispielsweise einem Bild, einem Titel, einigen zusätzlichen Informationen über das Rezept, wie lange
es dauert, es zu erstellen, und so weiter. Wenn wir also
auf die Schaltfläche "Zurück" klicken, sind wir natürlich hierher zurückgebracht.
Das ist ein Teil und das ist alles, wo wir uns dort unten auf
der Registerkarte Alle befinden. Wenn dies also die aktive Registerkarte ist. Jetzt sind wir in diesem Ablauf jedoch noch nicht fertig. Natürlich können wir
auf ein einzelnes Rezept tippen. Dadurch gelangen wir zu einer weiteren Seite, auf der wir die Details zu diesem Rezept anzeigen können.
Wo wir also auch einen Header und ein Bild dieses Rezepts haben und auch einen Zurück-Button, der
uns zurück zu dieser Seite hier führt, wo wir dann auch mehr Informationen über das Rezept haben, wie
zum Beispiel die Zutaten, die eine solche Liste sind und dann auch die Schritte, die nötig sind, um dieses Rezept zu erstellen, wie geschnittene Zwiebeln und
so weiter.
Das sind also die Informationen über das Rezept, das wir hier haben, und wir können zurückgehen.
Wichtig ist, dass wir dort auch die Funktionalität haben, ein Rezept als Favorit zu markieren. Zum Beispiel könnten wir hier in der Kopfzeile
ein Sternsymbol haben, mit dem wir das tun können. Nun, das ist ein hässlicher Stern,
aber das
könnten wir hier haben Um ein Rezept als Favorit zu markieren, fügen wir es dieser Favoritenliste hinzu, da dies
die andere Registerkarte ist, die wir hier haben, oder?
Das ist die zweite Registerkarte, die wir hier haben. Wenn wir hier auf diese Registerkarte drücken, wechseln wir im Grunde die
Registerkarte auf diesem Startbildschirm, auf dem
wir diese Menüschaltfläche haben. Wir haben hier immer noch unsere Registerkarten mit allen und mit
Favoriten, aber jetzt sagen wir, Favoriten sind die aktiven Registerkarten.
Nun, in diesem Fall, wenn Favoriten die aktive Registerkarte ist, sehen wir hier im Wesentlichen eine Liste von Rezepten,
die genau wie diese Liste von Rezepten hier aussieht, wenn wir
auf eine Kategorie klicken, aber jetzt nur mit einer Liste von Rezepten mit den Rezepten, die wir als markiert haben Liebling.
Jetzt können wir noch ein einzelnes Rezept erstellen lassen und werden dort oben zu dieser Rezeptdetailseite weitergeleitet. Wenn wir
jetzt die Zurück-Taste drücken würden, würden wir natürlich zu dieser Seite
zurückkehren, sodass die Zurück-Taste uns zu einer anderen führt Seiten je nachdem, woher wir kommen.
Was passiert nun, wenn wir diese Schublade hier drücken, wenn wir auf diese Menüschaltfläche tippen? Was passiert in diesem
Fall?
In diesem Fall öffnen wir eine Seitenschublade, über die wir zur Essens-App gehen können, mit der wir am Ende
beginnen. Dort haben wir alle Favoriten und auch den Filterbildschirm. Jetzt ist Filter ein brandneuer Bildschirm, den wir
in dieser Anwendung haben. Dort haben wir auch eine Menüschaltfläche, um zu demselben
Menü zu gelangen und möglicherweise zur Seite mit den Mahlzeiten zurückzukehren. Bei Filtern können wir Filter wie glutenfrei oder
vegan einstellen und wir Hier gibt es einige Schalter, mit denen wir diese Optionen ein- und ausschalten
können. Außerdem haben wir hier oben eine Schaltfläche zum Speichern, mit der wir unsere Auswahl
speichern und dann zurückgehen können. Die Rezepte, die wir hier sehen, werden angezeigt gefiltert durch unsere Auswahl auf dem Filterbildschirm.
Das ist also die Anwendung, die wir erstellen, und jetzt zeigt diese Skizze hier zwei Dinge
- zum einen sind meine Zeichenfähigkeiten nicht so großartig. Sollte aber nicht zu wichtig sein, da dies zum
Glück keine Zeichenklasse ist.
Das Wichtigste, was diese Skizze zeigt, ist, dass wir viel Navigation haben, Registerkarten haben, eine
Seitenschublade haben
und eine Navigation hin und her haben, also werden wir zwischen den Seiten hin und her gehen, wir werden haben Um den Titel
in der Kopfzeile basierend auf dem Ziel zu ändern, müssen wir den Inhalt auf dem Bildschirm
basierend auf dem Ziel ändern. Daher benötigen wir eine leistungsstarke Navigationslösung, bei der wir nicht nur if
verwenden prüft wie wir es bisher im kurs gemacht haben. Nicht nur, weil das Schreiben sehr
umständlich wäre, sondern auch, weil wir diese schönen Animationen, diese Übergänge zwischen Bildschirmen wollen und
das können wir dankenswerterweise auf relativ einfache Weise hinzufügen.