1 00:00:02,770 --> 00:00:07,410 Welche Art von Anwendung werden wir hier in diesem Modul erstellen? 2 00:00:07,450 --> 00:00:15,580 Wir werden eine Essens-App erstellen, eine App, in der wir einige Rezepte anzeigen, einige Favoriten favorisieren und auch Rezepte filtern können. 3 00:00:15,820 --> 00:00:19,370 Dazu benötigen wir in dieser Anwendung eine Navigation. 4 00:00:19,390 --> 00:00:25,810 Wir haben dort unsere Kopfzeile mit einem Titel in der Mitte und einem Menüknopf hier links, 5 00:00:25,810 --> 00:00:29,210 mit dem wir eine Seitenschublade öffnen können, auf 6 00:00:29,470 --> 00:00:33,610 die ich gleich zurückkommen werde, und am Ende dieser Seite 7 00:00:33,610 --> 00:00:42,700 hier Wir haben Registerkarten, wir haben zwei Registerkarten - eine für alle Mahlzeiten, alle Rezepte und eine für unsere Favoriten, die wir 8 00:00:42,700 --> 00:00:45,310 natürlich in dieser App hinzufügen können. 9 00:00:45,310 --> 00:00:49,800 Jetzt auf dieser ganzen Seite haben wir ein Raster von 10 00:00:49,810 --> 00:00:59,310 Kategorien, also im Grunde genommen etwas wie italienisches, exotisches, vielleicht deutsches Essen, also im Grunde verschiedene Lebensmittelkategorien, und wenn wir 11 00:00:59,470 --> 00:01:02,100 auf eine dieser Kategorien 12 00:01:02,200 --> 00:01:09,490 tippen, werden wir auf einem zweiten Bildschirm angezeigt Wo wir dann oben einen Zurück-Button haben, um 13 00:01:09,490 --> 00:01:13,660 mit einem anderen Titel, dem Kategorietitel, zurückzukehren, und auf 14 00:01:13,660 --> 00:01:17,110 diesem Bildschirm haben wir dann die Rezepte. 15 00:01:17,110 --> 00:01:24,910 Dort haben wir also mehrere solcher Karten mit beispielsweise einem Bild, einem Titel, einigen zusätzlichen Informationen über das Rezept, wie lange 16 00:01:24,910 --> 00:01:29,250 es dauert, es zu erstellen, und so weiter. Wenn wir also 17 00:01:29,260 --> 00:01:33,220 auf die Schaltfläche "Zurück" klicken, sind wir natürlich hierher zurückgebracht. 18 00:01:33,250 --> 00:01:37,300 Das ist ein Teil und das ist alles, wo wir uns dort unten auf 19 00:01:37,300 --> 00:01:44,470 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 20 00:01:44,890 --> 00:01:50,590 auf ein einzelnes Rezept tippen. Dadurch gelangen wir zu einer weiteren Seite, auf der wir die Details zu diesem Rezept anzeigen können. 21 00:01:50,650 --> 00:01:56,530 Wo wir also auch einen Header und ein Bild dieses Rezepts haben und auch einen Zurück-Button, der 22 00:01:56,530 --> 00:02:02,950 uns zurück zu dieser Seite hier führt, wo wir dann auch mehr Informationen über das Rezept haben, wie 23 00:02:02,950 --> 00:02:11,740 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 24 00:02:11,800 --> 00:02:12,860 so weiter. 25 00:02:13,390 --> 00:02:17,370 Das sind also die Informationen über das Rezept, das wir hier haben, und wir können zurückgehen. 26 00:02:17,710 --> 00:02:26,050 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 27 00:02:26,050 --> 00:02:31,710 ein Sternsymbol haben, mit dem wir das tun können. Nun, das ist ein hässlicher Stern, 28 00:02:31,720 --> 00:02:32,850 aber das 29 00:02:32,880 --> 00:02:39,790 könnten wir hier haben Um ein Rezept als Favorit zu markieren, fügen wir es dieser Favoritenliste hinzu, da dies 30 00:02:39,790 --> 00:02:43,210 die andere Registerkarte ist, die wir hier haben, oder? 31 00:02:43,220 --> 00:02:50,980 Das ist die zweite Registerkarte, die wir hier haben. Wenn wir hier auf diese Registerkarte drücken, wechseln wir im Grunde die 32 00:02:51,040 --> 00:02:53,540 Registerkarte auf diesem Startbildschirm, auf dem 33 00:02:53,740 --> 00:02:58,500 wir diese Menüschaltfläche haben. Wir haben hier immer noch unsere Registerkarten mit allen und mit 34 00:02:58,510 --> 00:03:01,750 Favoriten, aber jetzt sagen wir, Favoriten sind die aktiven Registerkarten. 35 00:03:02,050 --> 00:03:10,660 Nun, in diesem Fall, wenn Favoriten die aktive Registerkarte ist, sehen wir hier im Wesentlichen eine Liste von Rezepten, 36 00:03:10,660 --> 00:03:15,700 die genau wie diese Liste von Rezepten hier aussieht, wenn wir 37 00:03:15,700 --> 00:03:24,790 auf eine Kategorie klicken, aber jetzt nur mit einer Liste von Rezepten mit den Rezepten, die wir als markiert haben Liebling. 38 00:03:24,790 --> 00:03:30,890 Jetzt können wir noch ein einzelnes Rezept erstellen lassen und werden dort oben zu dieser Rezeptdetailseite weitergeleitet. Wenn wir 39 00:03:30,970 --> 00:03:35,050 jetzt die Zurück-Taste drücken würden, würden wir natürlich zu dieser Seite 40 00:03:35,080 --> 00:03:40,130 zurückkehren, sodass die Zurück-Taste uns zu einer anderen führt Seiten je nachdem, woher wir kommen. 41 00:03:40,180 --> 00:03:47,980 Was passiert nun, wenn wir diese Schublade hier drücken, wenn wir auf diese Menüschaltfläche tippen? Was passiert in diesem 42 00:03:47,980 --> 00:03:49,110 Fall? 43 00:03:49,120 --> 00:03:56,860 In diesem Fall öffnen wir eine Seitenschublade, über die wir zur Essens-App gehen können, mit der wir am Ende 44 00:03:56,860 --> 00:04:05,830 beginnen. Dort haben wir alle Favoriten und auch den Filterbildschirm. Jetzt ist Filter ein brandneuer Bildschirm, den wir 45 00:04:05,860 --> 00:04:12,730 in dieser Anwendung haben. Dort haben wir auch eine Menüschaltfläche, um zu demselben 46 00:04:12,850 --> 00:04:22,150 Menü zu gelangen und möglicherweise zur Seite mit den Mahlzeiten zurückzukehren. Bei Filtern können wir Filter wie glutenfrei oder 47 00:04:22,490 --> 00:04:30,740 vegan einstellen und wir Hier gibt es einige Schalter, mit denen wir diese Optionen ein- und ausschalten 48 00:04:31,160 --> 00:04:38,690 können. Außerdem haben wir hier oben eine Schaltfläche zum Speichern, mit der wir unsere Auswahl 49 00:04:38,720 --> 00:04:48,430 speichern und dann zurückgehen können. Die Rezepte, die wir hier sehen, werden angezeigt gefiltert durch unsere Auswahl auf dem Filterbildschirm. 50 00:04:49,070 --> 00:04:54,270 Das ist also die Anwendung, die wir erstellen, und jetzt zeigt diese Skizze hier zwei Dinge 51 00:04:54,290 --> 00:05:00,500 - zum einen sind meine Zeichenfähigkeiten nicht so großartig. Sollte aber nicht zu wichtig sein, da dies zum 52 00:05:00,590 --> 00:05:02,360 Glück keine Zeichenklasse ist. 53 00:05:02,390 --> 00:05:07,330 Das Wichtigste, was diese Skizze zeigt, ist, dass wir viel Navigation haben, Registerkarten haben, eine 54 00:05:07,370 --> 00:05:08,170 Seitenschublade haben 55 00:05:08,180 --> 00:05:15,760 und eine Navigation hin und her haben, also werden wir zwischen den Seiten hin und her gehen, wir werden haben Um den Titel 56 00:05:15,800 --> 00:05:21,080 in der Kopfzeile basierend auf dem Ziel zu ändern, müssen wir den Inhalt auf dem Bildschirm 57 00:05:21,080 --> 00:05:26,510 basierend auf dem Ziel ändern. Daher benötigen wir eine leistungsstarke Navigationslösung, bei der wir nicht nur if 58 00:05:26,510 --> 00:05:33,200 verwenden prüft wie wir es bisher im kurs gemacht haben. Nicht nur, weil das Schreiben sehr 59 00:05:33,200 --> 00:05:39,800 umständlich wäre, sondern auch, weil wir diese schönen Animationen, diese Übergänge zwischen Bildschirmen wollen und 60 00:05:40,250 --> 00:05:44,220 das können wir dankenswerterweise auf relativ einfache Weise hinzufügen.