Erstelle eine Wettervorhersage-App mit . NET MAUI

1. Einführung: Hallo, mein Name ist S1 und ich führe dich durch diesen Kurs. Ich bin ein Software-Ingenieur und wertvollste Profi von Microsoft. Ich habe diesen Kurs so gestaltet, dass Sie wunderschöne plattformübergreifende mobile Anwendungen von Anfang bis Ende wunderschöne plattformübergreifende mobile Anwendungen erstellen können. Am Ende dieses Kurses können Sie die mobilen Anwendungen im Dalton-Film mit RESTful-APIs entwickeln . Egal, ob Sie mit Dotted Movie noch nicht vertraut sind oder ob Sie daran denken, plattformübergreifende mobile Anwendungen zu erstellen , Diskurs ist eine perfekte Starthilfe für Sie. Ordnung? Worauf wartest du? Diesen Kurs belegen? Und lass uns anfangen zu lernen. 2. Wetter-App Übersicht: In diesem Abschnitt erhalten wir die Wettervorhersage-Anwendung mit Dotnet-Film. Lassen Sie mich Ihnen die Anwendung zeigen, mit der wir diese Anwendung zum ersten Mal erstellen werden. Dann sehen wir diesen Onboarding-Bildschirm oder den Bildschirm „ Erste Schritte“. Okay, machen wir weiter und wählen im Hintergrund unseres Geräts unseren Standort aus, und dann erhalten wir die Wetterdaten entsprechend unserem Standort. Nehmen wir an, wir wollen die Wetterdaten für eine andere Stadt überprüfen . Dann müssen Sie nur noch nach einer anderen Stadt suchen. Und los geht's. Dieses Mal erhalten wir unterschiedliche Wetterdaten. Ordnung, in dieser Anwendung werden die restlichen APIs für Open Weather Map verbraucht . Lassen Sie uns jetzt das Zillus-Studio starten. Und dann fügen wir ein neues Filmprojekt hinzu. Wählen wir diese gepunktete Anwendung aus und klicken auf Weiter. Ich werde dieses Projekt der Wetter-App nennen. Okay, jetzt hol dir dieses Projekt. Und hier in der neuesten Version von RStudio wird der aktuelle Pitch zu sehen sein. Das brauchen wir nicht. Also entfernen wir die App-Shell. In ähnlicher Weise entfernen wir auch das Hauptseitenbeispiel und die Doppelpunkt-CSS-Datei der Hauptseite . Jetzt in der abs ML dot CSS-Datei sehen wir diesen Fehler, weil wir keine Hauptseite haben, unsere App-Shell-Pitch. Wir klicken mit der rechten Maustaste und wählen Neuer Gegenstand. In dieser Version von Video Studio fügte Microsoft S dann eine separate Vorlage für gepunktete monatliche Basis hinzu. Also würde ich ab jetzt den Mojave benutzen. Und dann wählen wir diese gepunktete Molly-Inhaltsseite mit XAML-Vorschau. Ordnung, lassen Sie uns diesen Bereich nach Seite und Bearbeitung innerhalb unseres Projekts benennen . Okay, los geht's. nun in der ML-Punkt-CSS-Datei der App Lassen Sie uns nun in der ML-Punkt-CSS-Datei der App die Hauptseite gleich der Seite festlegen. Lassen Sie uns nun unsere Arbeit in der nächsten Lektion fortsetzen. 3. Wie man Wetter Api: In dieser Lektion zeige ich Ihnen, wie wir die Wetter-API erhalten können. Nun, es gibt viele Wetter-API-Anbieter, aber wir verwenden diese Open Weather Map hauptsächlich für Wetteranwendungen. Okay, in diesem Kurs verwenden wir die Open Weather Map API. Gehen wir auf diese Website. Und dort klicken wir auf diese API. Und wir werden verschiedene API-Optionen sehen. Wir könnten jede dieser APIs verwenden, um die Wetterdaten abzurufen, z. B. wird diese Option verwendet, um dunkle aktuelle Wetterdaten zu erhalten. Diese Option wird verwendet, um die Wetterdaten von vier Tagen abzurufen. Ebenso haben wir verschiedene Möglichkeiten. Wir können auch diese Tagesprognose verwenden, 16, diese Option, ob Daten. Im Moment ist dies jedoch nicht kostenlos und in allen kostenpflichtigen Abonnementplänen für einen anderen Plan enthalten allen kostenpflichtigen Abonnementplänen , der kostenlos ist. Diese fünftägige t, unsere Prognose ist kostenlos. Also wählen wir diese Option. Diese Option liefert dem Tierarzt die Daten von fünf Tagen. Und weil dies ein kostenloser Plan ist, erhalten wir die Wetterdaten nicht nach jeder Stunde. Wir erhalten die Wetterdaten nach 3 h. Okay, jetzt klicken wir auf diese APA-Dokumentation. Und er wird die URL sehen , über die die Wetterdaten abgerufen werden. In dieser URL müssen wir Filterelemente wie Breitengrad, Längengrad und App-ID oder APA-Schlüssel übergeben . Kopieren wir diese URL und fügen sie in andere Schulden ein. Gehen wir jetzt zu Google. Und dort finden Sie den Breiten- und Längengrad Ihres Standorts. Ordnung, kopieren wir den Breiten- und Längengrad und fügen ihn in Ihre API-URL ein. Dann erhalten wir die Wetteranwendung in gepunktetem mv0 und ermöglichen dann unserer Anwendung, ermöglichen dann unserer Anwendung den Standort des Geräts auszuwählen. Beim Testen sagt die API im Webbrowser, dass die Koordinaten manuell übergeben werden. Okay, jetzt suchen wir die App ID, unseren API-Schlüssel. Um den API-Schlüssel zu erhalten, muss ich mich auf der Open Weather Map anmelden. Also erstelle ich mein Konto. Sobald ich mein Konto eingerichtet habe, sehe ich hier im Dropdown den API-Schlüssel. Wählen Sie dies einfach aus. Und hier können wir den Standard-API-Schlüssel verwenden oder einen neuen generieren. Okay, jetzt kopieren wir diesen ABA-Schlüssel und fügen ihn in die URL ein. Okay, drücken wir die Eingabetaste und Sie erhalten den Kern und die Antwort. Kopieren wir diese bestimmten Daten. Und jetzt suche nach dieser Website, Jason Beauty, Fire. Eintreten. Lassen Sie uns die JSON-Daten einfügen und verschönern. Okay, hier auf der rechten Seite sehen wir die anständigen Daten im Codierungsformat. Wir können auch andere Optionen wählen, um die Daten anzuzeigen. Richten wir die Anzeigeoption ein. Und hier im Objekt werden verschiedene Dinge zu sehen sein. Wenn wir die Option Stadt erweitern, sehen Sie verschiedene Attribute wie den Namen der Stadt, Koordinaten, Sonnenaufgang, Sonnenuntergang usw. Wir wählen die Stadt aus, um die aktuellen Wetterdaten zu erhalten. Jetzt sehen wir hier die Liste, die uns sagt, dass diese Liste die folgende Anzahl von Datensätzen enthält. Lassen Sie uns die Liste erweitern. Und hier sehen wir verschiedene Bereiche. Lassen Sie uns diesen erweitern. Und hier in der Hauptsache werden Daten für Temperatur, Druck, Luftfeuchtigkeit usw. Im Vektorfeld werden die Wetterdaten wie Beschreibung angezeigt . Und ich kann das bessere haben. In ähnlicher Weise haben wir im Wind Geschwindigkeit usw. Wir verwenden diese JSON-Daten in einer gepunkteten Filmanwendung. Okay, in der nächsten Lektion löschen wir die C-Sharp-Klassen aus diesen JSON-Daten. Wir sehen uns in der nächsten Lektion. 4. Generate Kurse von JSON generieren: Nur wenn wir die API auf Wetter getestet haben. In dieser Lektion erhalten wir nun die C-Sharp-Klassen aus dieser Entfernungsreaktion. Hier im Webbrowser sehen Sie diese JSON-Daten. Wir müssen nur diesen Jason kopieren und dann nach dieser Website suchen. Steigen Sie zu C-Sharp ab Ordnung, hier fügen wir nur einige Daten ein und konvertieren sie in C-Sharp-Klassen und -Eigenschaften. Hier sehen wir die C-Sharp-Klassen und -Eigenschaften. Sie können die Immobilien auch im Fall Pascal spenden. Aber Algen und Kleinbuchstaben, die Wahl liegt ganz bei Ihnen. Ich kann jetzt zu unserem Tochter-Maggie-Projekt gehen und einen neuen Ordner hinzufügen und ihm Models nennen. Nun fügen wir in diesem Ordner eine Beschlagnahmungsklasse hinzu und nennen sie root. Okay, lass uns diese Klasse hinzufügen. Jetzt denken Sie darüber nach, warum wir diese Klasse als Route benannt haben. Denn nach unserem Anstand sind Überschüsse zu sehen. Diese Stammklasse ist die übergeordnete Klasse. Sie können auch sehen , dass darüber hinaus erwähnt wird, dass wir, wenn wir diese erwähnt wird, dass wir, wenn wir JSON-Daten deserialisieren wollen, verwenden müssen das benachbarte Objekt convert dot dc lies der Root-Klasse verwenden müssen. Kopieren wir diese Daten. Gleich danach. Im Videostudio wird dieser Routenname entfernt. Und dann das die Daten , die wir kopiert haben. Hier haben wir unsere Modellbrille aus den JSON-Daten erstellt . In der nächsten Lektion erstellen wir nun die API-Serviceklasse. Wir sehen uns in der nächsten Lektion. 5. Api Service Kurs erstellen: In dieser Lektion erstellen wir die API-Serviceklasse. Was wir also tun werden, ist einen neuen Ordner in unserem Projekt hinzuzufügen. Und dann Dean in diesem Ordner zu Services. In diesem Ordner wird dann ein neuer C-Sharp-Klassennamen-ID-API-Dienst hinzugefügt . Wenden wir uns nun dem Klassenzugriffsmodifikator für die Öffentlichkeit zu. Ordnung? In dieser API-Serviceklasse erhält man eine Methode und benennt sie, get weather. Innerhalb dieser Methode wird nun ein neuer HTTP-Client erstellt. Wenn wir nun die restlichen APIs aufrufen, dann den HTTP-Client , der eine Anfrage an den Server weiterleitet. Dann müssen wir mit diesem HTTP-Client die Methode in Rest-APIs aufrufen. Wenn wir den Datensatz hinzufügen , verwenden wir Post Request. Wenn wir den Datensatz aktualisieren, verwenden wir die PUT-Anfrage. Und im Falle des Löschens des Datensatzes wird die Löschmethode verwendet. Nun, im Falle des Abrufs unserer FASTA-Daten, benötigen wir eine GetMethod mit diesem HTTP-Client, der die Methode get string async aufruft. Und diese Methode sendet die Anfrage und wir erhalten die Antwort im JSON-Format. Hier, VD, um unsere API-URL hinzuzufügen. Was wir also tun werden, ist unsere API-URL zu kopieren unsere API-URL und sie hier einzufügen. Hier übergeben wir unsere Koordinaten wie Breiten- und Längengrad. In dieser Methode fügen wir also zwei Parameter vom Typ double hinzu und nennen sie Breitengrad und Längengrad. Okay, dann werden in dieser URL die Breiten- und Längengrade verkettet. Also werden wir diese URL-String-Punkt-Format-Funktion umschließen. Und dann wird anstelle von Breiten- und Längengrad ein Platzhalter wie 0,1 in die geschweiften Klammern eingefügt. Nach dieser URL wird ein Kommatrennzeichen hinzugefügt und dieser Breiten- und Längengrad übergeben , der von dieser Funktion erhalten wird. Sie erinnern sich, dass dies eine asynchrone Methode ist. Also müssen wir hier das Schlüsselwort await verwenden. Und jetzt bekommen wir einen Fehler, weil er ohne async nicht verwendet werden kann. Wir müssen diese Methode also asynchron machen , indem wir das Schlüsselwort async verwenden. Ordnung, speichern wir das Ergebnis in einer Variablen. Und dann diese Variable zur Reaktion. Grundsätzlich enthält die Variable „this is false“ die JSON-Daten, die von dieser API-URL abgerufen werden. Sobald wir die Daten erhalten haben, müssen wir diese Daten in C-Sharp-Klassen analysieren , damit wir sie in unserer mobilen Anwendung anzeigen können. Wenn wir also die Daten im JSON-Format erhalten, konvertieren wir diese JSON-Daten in CCF-Klassen indem wir nur das deserialisierte Objekt inkrementieren . Dieser Jason konvertiert Punkt d serialisiertes Objekt. Wir brauchen ein NuGet-Paket, das nur in.net oder Newton soft dot json ist. Im Paketmanager, der das Paket durchsucht und installiert. Sobald wir dieses Paket installiert haben, schließen wir dieses Fenster. Und gleich danach werden wir das in einer Art Punkt D serialisiertes Objekt verwenden . Dann gibt es den ganzen Namensraum für Newton Soft Door, GSM. Jetzt müssen wir im digitalisierten Objekt den Klassennamen und die anständigen Daten übergeben. Sehen Sie sich die anständigen Daten aus der Antwortvariablen an. Übergeben Sie die Antwort hier. Und wir müssen diese Entscheidung anhand des Routenglases abbilden, denn Glas ist die übergeordnete Klasse. Also werden wir den DSM entsprechend unserem Wurzelglas abbilden. Lassen Sie uns das nun tun, indem wir die Anweisung return verwenden. Und unsere Methode gibt die Antwort entsprechend der Root-Klasse zurück . Aber wir bekommen einen Fehler. Und das liegt daran, dass wir das Weiß verwenden. Und hier geben wir diese Daten gemäß der Root-Klasse zurück . Wenn wir also den Typ dieser Methode, die Wurzel, festlegen , erhalten wir immer noch einen Fehler. Und das liegt daran, dass wir, wenn wir die Methode Async machen , die Aufgabe t verwenden müssen. Wenn wir jedoch nichts zurückgeben, verwenden wir das Schlüsselwort task. Aber wenn wir etwas zurückgeben würden, dann wenn das Gewebe die Aufgabe des Typs hat. Und dieser Typ könnte alles Mögliche sein. Es kann ein String, eine Ganzzahl, Float, eine Liste oder sogar ein Objekt sein. Weil wir die Daten gemäß der Root-Klasse zurückgeben . Also machen wir den Typ dieser Methode für Aufgaben abseits der Route. Ordnung, wir werden unsere Arbeit in der nächsten Lektion fortsetzen. 6. Wetter nach Stadt: In der letzten Lektion haben wir eine Methode in der API-Serviceklasse hinzugefügt . Und diese Methode wird verwendet , um die Wetterdaten anhand der Koordinaten wie Breiten- und Längengrad zu erhalten. Gemäß unserer Anwendung möchten wir aber auch die Wetterdaten entsprechend dem Namen der Stadt erhalten . Was wir also tun werden, ist fünf Tage lang zur Open Weather Map API zu gehen . Und dort auf der rechten Seite sehen wir diese Option. Ermitteln Sie, ob nach Stadtnamen. Wählen wir das aus. Und dies ist eine URL, die verwendet wird, um die Wetterdaten entsprechend dem Namen der Stadt abzurufen. Okay, wir verwenden diese URL. Lass mich dir eins sagen. Diese beiden URLs, die eine mit den Koordinaten und die andere mit dem Namen der Stadt. Sie tendieren zur gleichen Entfernungsreaktion. Wir müssen also kein weiteres C-Sharp-Modell erstellen. Klassen wählen die Klassen , die wir zuvor erstellt haben. Das einzige, was eine andere Methode in der APA-Serviceklasse erstellt . Gehen wir also zur API-Serviceklasse, und dann kopieren wir diese Methode und fügen sie hier ein. Nun, sehen wir es uns in dieser Methode an, um herauszufinden, ob nach Stadt, in Ordnung, dann entfernen wir diese URL. Gleich danach. Lassen Sie uns diese URL kopieren, um herauszufinden , ob Sie nach Stadtnamen suchen, und fügen Sie sie hier ein Hier übergeben wir den gleichen API-Schlüssel , den wir in der ersten Methode verwendet haben. Und in der Stadt wird der Name die Stadt passieren, die von dieser Methode erhalten wird. In dieser Methode übergeben wir einen Parameter vom Typ string und dann City. Ordnung? Und dann verketten wir die Stadt hier. Hier haben wir die APA-Serviceklasse erstellt. Nun, wann werden diese API-Serviceklassenmethoden in einigen anderen Klassen verwendet, z. B. ob pH. Dann müssen wir die neue Instanz der API-Serviceklasse erhalten. Und mit Schulden können wir die APA-Serviceklassenmethoden nennen. Aber wir werden diese Klasse und diese Methode static hinzufügen , sodass wir die Klasse nicht instanziieren müssen , wenn wir diese API-Service-Klassenmethoden verwenden möchten, dann können wir einfach den Namen der Klasse verwenden. Und damit können wir diese Methoden nennen. Ordnung, also ist es besser, wenn wir diese Klasse und diese Methoden auf static setzen . Ordnung, das ist alles für diese Lektion. Jetzt sehe ich dich in der nächsten. 7. Design Wetterseite: In dieser Lektion entwerfen wir die Wetterseite. Gehen wir also zur XML-Datei der Bearbeitungsseite, und dann können wir unseren XAML-Code neu schreiben. Aber vorher werfen wir einen Blick auf dieses Bild, das wir entwerfen werden. Nun, auf dieser Seite wählen wir das Rasterlayout aus. Und hier wird es dieses Design in verschiedene Teile zerlegen . Dies ist die erste Reihe und die Höhe ist Otto. Dann haben wir diese zweite, dritte, vierte und fünfte Reihe. Und die Höhe all dieser Reihen ist Otto. Ich möchte Ihnen sagen, dass ich nur wenige Säuren hergestellt habe. In der zweiten Einheit laden Sie einfach diese Säuren zusammen mit diesem Video herunter. Und gleich danach Judy diese Säuren in den Ordner Images ein , der sich unter dem Ordner Ressourcen hier befindet die all diese Assets hinzugefügt haben. Lassen Sie uns nun diese Anwendung ausführen , da wir mit Hilfe der Hot-Reload-Option ein Design erstellen . Hier läuft unsere Anwendung mit einer Textnachricht. Lass uns das entfernen. Und jetzt fügen wir ein Grid-Layout hinzu. Und dann füge die Zeilendefinition gleich hinzu. Und dann fügen wir fünf Zeilen mit der Höhe von auto hinzu. Gleich danach. Stellen wir den Zeilenabstand von zwanziger Einheiten ein. Dann erstellen wir ein Design für diese erste Reihe. Diese erste Zeile enthält zwei untergeordnete Elemente. Verwenden wir hier also das Stack-Layout und setzen das Stapel-Layout in den Rasterpunkt rho gleich Null. Dann legen wir den Rand von 20 Einheiten von links, oben und rechts fest. Und wir brauchen keinen Spielraum von unten. Also setzen wir Null. Wir wollen diese Steuerelemente in horizontaler Richtung. Stellen Sie also die Ausrichtung dieser Tag-Wolke gleich horizontal ein. Ordnung? Dann brauchen wir in diesem Stack-Layout zwei Dinge. Das erste ist Ihr Standort und das zweite ist das Suchsymbol. Um dies zu erreichen, wählt Ihre Standortsteuerung den Pegelregler aus und stellt fest, dass der Text Ihrem Standort entspricht, und die Telefongröße entspricht der Standardeinstellung. Ordnung? Aber wir brauchen diese Art von Kontrolle. Also wickeln wir dieses Etikett in den Rahmen. Und standardmäßig beträgt die Polsterung des Rahmens 20 Einheiten. Stellen wir es also auf zehn Einheiten ein. Dann stellen wir den Eckenradius auf 35 Einheiten ein, hat die Schatteneigenschaft gleich true und die Rahmenfarbe ist wahrscheinlich gleich. Jetzt fügen wir ein weiteres Steuerelement für dieses Suchsymbol hinzu. Zu diesem Zweck fügen wir einen Bild-Button hinzu. Stellen Sie dann die Quelle dieses Bildes gleich ein. Lassen Sie mich Ihnen das Bild zeigen, das wir im Ordner Images verwenden werden. Wir haben dieses Bild für die Suche Symbol würde dieses Bild hier verwenden. Dann setzen wir die Anforderung für Höhe und Breite auf 30 Einheiten und stellen die gesamte zentrale Option zum Erweitern ein. Ordnung? Jetzt werden wir uns mit dem Design der zweiten Reihe befassen. Nun, in dieser Rolle werden zwei Dinge benötigt, Stadtname und die Beschreibung. Zuerst füge ich ein Stack-Layout hinzu und lege es in den Rasterpunkt Rho ist gleich eins. Und wir legen fest, dass die Ausrichtung dieser Textebene vertikal ist. Standardmäßig ist eine versetzte Ausrichtung vertikal. Okay, jetzt fügen wir ein Level Control hinzu und nennen es LBL city. Stellen Sie dann die Schriftgröße auf 40 Einheiten ein. Okay, gleich danach, wer die horizontale Option setzt, ist gleich Mitte und Text ist gleich Grau. Stellen Sie auch den Text dieses Etiketts nach vorne ein. Fügen wir eine beliebige Stadt hinzu. Wenn Sie die API verwenden, entfernen wir diesen hartcodierten Stadtnamenwert. Aber gerade entwerfen wir diese Wetterseite. Also fügen wir hier den fest codierten Wert hinzu. Ich mag dieses Maß an Kontrolle nicht, wir brauchen eine andere Kontrolle. Hier setzen wir den Namen gleich LPL. Lesen Sie die Beschreibung. Schriftgröße ist gleich mittel, horizontal, Option ist gleich Mitte bei Textfarbe gleich Schiefergrau. Dann fügen wir hier etwas fest codierten Text hinzu , der später entfernt wird. Ordnung. Jetzt gehen wir zur dritten Reihe. Und diese Zeile fügt nur ein Bildsteuerelement hinzu, da es in dieser Zeile nur ein Steuerelement gibt. Soul benutzt kein Layout. Dieses Image-Going-Tool wird das direkte untergeordnete Element unseres Grid-Layouts sein. Also fügen wir ein Bildsteuerelement hinzu und setzen es in einen Rasterpunkt, der gleich zwei ist. Dann setzen wir den Namen dieses Bildes auf IMT-Wettersymbol. Optionen zum Starten. Und die Anforderung für Höhe und Breite entspricht 200 Einheiten. Dann legen wir die Quelle dieses Bildes fest. Und hier übergeben wir jedes zufällige Bild aus dem Bilderordner. Bewege das später. Okay, jetzt lass uns in eine andere Reihe gehen. Und diese Reihe wird ein weiteres gutes Layout hinzufügen. Also fügen wir ein Gitter hinzu und setzen es in einen Rasterpunkt. Rho ist gleich drei. Dann im Streit werden zwei Zeilen mit der Höhe von auto und drei Spalten mit einem Gewicht von 0,3 t statisch für alle diese hinzugefügt zwei Zeilen mit der Höhe von auto und drei Spalten mit einem Gewicht von . Dann addieren Sie den Rand, der 20 Einheiten entspricht. Jetzt fügen wir ein Bildsteuerelement hinzu und setzen es in eine Nullzeile, eine Nullspalte. Das heißt, die Löcher sind zwei Optionen gleich Mitte und Höhenanforderung von 25 Einheiten. Gleich danach setzen wir die Quelle dieses Bildes auf gleich. Und hier wird es diesen Bildnamen für Luftfeuchtigkeit übergeben , der aus unserem Bilderordner stammt. Ordnung, jetzt füge ich eine Label-Steuerung hinzu, intime LBL-Feuchte. Dann setzen wir dies in den Rasterpunkt Rho ist gleich eins und klicken Punktspalte gleich Null. Gleich danach setze die ganze subtile Option gleich Mitte. Im Moment setzen wir die Texteigenschaft und fügen hier eine beliebige Zufallszahl hinzu. Dann fügen wir eine weitere Kontrollstufe und Navy LBL-Temperatur hinzu. Und wir werden dieses Etikett anbringen. Guter Punkt Rho ist gleich Null und Gitterspalte ist gleich Eins. Dann verwenden wir Grid dot, rowspan entspricht horizontalen Optionen zum Zentrieren. Schriftgröße von 40 Einheiten bei Schriftattributen fett. Übergeben wir eine beliebige Zufallszahl in der Texteigenschaft. Okay, jetzt kopieren wir diese beiden Steuerelemente für Luftfeuchtigkeit, Bild und Füllstand. Und dann fügen wir es hier ein. Okay, zuerst setzen wir dieses Bild in einen roten Punkt, der gleich Null ist. Gute dunkle Farbe entspricht zwei. Und für diese Ebene wählen Sie Rasterpunkt Rho ist gleich eins und Greet-Punkt-Doppelpunkt gleich zwei. Dann ändern wir den Namen dieses Labels in LBL Vint. Und für diese Bildquelle wird das Bild festgelegt , das aus unserem Bilderordner stammt. Ordnung, jetzt in der nächsten Lektion werden wir unsere Sammlungsansicht behandeln, die wir in diese letzte Zeile einfügen werden. Wir sehen uns in der nächsten Lektion. 8. Collection für Wetterdaten: In dieser Lektion fügen wir die Sammlungsansicht auf der Wetterseite hinzu. Zuvor haben wir dieses Design erstellt. Jetzt fügen wir eine Sammlungsansicht hinzu und fügen sie in diesen Rasterpunkt ein. Rho ist gleich vier. Setzen Sie den Namen dieser Sammlungsansicht auf CV, ob wir auch festlegen die Höhenanforderung 100 Einheiten entspricht. Wir haben die Sammlungsansicht bereits früher in der Früchte-Anwendung und in der Nachrichtenanwendung behandelt . Dieses Mal sparen wir Zeit und verwenden die Copy-Paste-Technik. Also, was ich tun werde, ist diesen Code für die Sammlungsansicht hinzuzufügen. Hier haben wir eine Sammlungsansicht mit einem Raster. Und innerhalb dieses Rasters haben wir Werkzeuge genommen. Eine ist für das Bild, zweite für die Temperatur und die dritte für Datetime. In Ordnung? Und wir wollen diese Art von Design mit nur einer Reihe und in horizontaler Richtung. Deshalb haben wir das lineare Artikellayout verwendet. In der nächsten Lektion verwenden wir nun diese API und zeigen die Wetterdaten auf dieser Wetterseite an. Okay, wir sehen uns in der nächsten Lektion. 9. Anzeige der aktuellen Stadt und Weather: In dieser Lektion verwenden wir die Wetter-API, um die aktuellen Wetterdaten und die Wetterseite anzuzeigen . Gehen wir also zum Code hinter der Datei oder besser gesagt der Seite. Und sie werden von vorne beginnen. Wir wollen diese Daten bekommen, dann landen wir auf dieser Seite. Deshalb verwenden wir unsere eigene ansprechende Methode. Okay, lasst uns die eigene Meinungsmethode außer Kraft setzen. Und darin rufen wir unsere API auf, um die Wetterdaten zu erhalten. Wählt die APA-Dienstklasse und löst den Namespace auf. Dann rufen wir die get-Methode auf, die den Breiten- und Längengrad annimmt. Im Moment Übergeben wir hier einige statische Werte. Und später, wenn wir mit dem Gerätestandort arbeiten, übergeben wir die Koordinaten entsprechend unserem Gerätestandort. Nun, das ist eine asynchrone Methode, also lasst uns hier warten. Und natürlich müssen wir ein Sing zusammen mit der eigenen ansprechenden Methode hinzufügen . Okay, jetzt speichern wir das Ergebnis in einer Variablen. Und wir haben das Ergebnis nicht getroffen. Mit diesem Ergebnis können wir die Eigenschaften unserer Modellklassen auswählen . In unserer Bewerbung. Zuerst finden wir die Stadt und die Wetterbeschreibung. Zum Anzeigen. Die Stadt wird zum Jason-Schönheitsfeuer gehen. Und in der Stadt wird ein Stadtname zu sehen sein. Okay, um den Namen der Stadt zu erhalten, wird das Ergebnis verwendet, das tatsächlich die Antwort von der API enthält. Und es ist vom Typ Root Class. Dann, nach unseren anständigen Daten, wählen wir die Stadt, und dann wählen wir den Namen der Stadt. Ordnung. Jetzt haben wir in der XAML-Datei der Veda-Seite dieses Label für die Stadt hinzugefügt. Entfernt einfach den fest codierten Textwert. Und dann weisen wir dieser LBL-Stadt den Wert im Code hinter der Datei zu. Weisen wir diesen Wert der Texteigenschaft LBL City dot zu. In ähnlicher Weise werden wir eine bessere Beschreibung finden. Also zurück zum JSON-Luftreiniger. Da. Öffnen wir diesen ListNode , weil wir die aktuellen Wetterdaten erhalten möchten. Soldaten diesen Nullknoten. Der Rest der Knoten enthält Daten für weitere fünf Tage mit einem Intervall von t Stunden. Nach dem Erweitern erweitert der Nullknoten das Wetter. Und hier sehen wir die Beschreibung. Um auf diese Beschreibung zuzugreifen. Zuerst müssen wir dieses Ergebnis verwenden eine anständige Antwort enthält. Dann wählen wir den Listenknoten aus und übergeben hier Null , weil wir die Daten und den Nullknoten abrufen wollen. Ordnung? Dann wählen wir den Vendor Node und übergeben hier auch Null. Wie im Jason Beauty Fire erwähnt. Jetzt können wir die Beschreibungseigenschaft auswählen. Okay, Sie sehen, wie einfach es ist, komplexe Daten zu festigen. Jetzt weisen wir diese Daten unserer LPL zu, egal ob Beschreibung Punkt Texteigenschaft. Dann gehen wir zur XAML-Datei der Webseite. Und dann brauchen wir diesen fest codierten Wert nicht für die Beschreibung. Also entfernen wir das einfach. Okay, jetzt lass uns diese Anwendung ausführen. Und los geht's. Sie können sehen, dass wir hier einen Stadtnamen und eine Beschreibung erhalten . Jetzt, in der nächsten Lektion, haben wir mit den Bildern gearbeitet und werden auch sehen, wie wir die Temperatur ermitteln können. Ordnung, wir sehen uns in der nächsten Lektion. 10. Anzeige aktueller Wetterdaten: In dieser Lektion zeigen wir die Wetterdaten an. Wir haben mit der Stadt gearbeitet und ob Beschreibung. Und jetzt in dieser Lektion zeigen wir die Wetterdaten wie Temperatur, Luftfeuchtigkeit und Windgeschwindigkeit an. Zuerst gehen wir zum DSM-Luftreiniger. Und sie werden diesen Listenknoten Null erweitern. Und wir werden diese Hauptleitung sehen und darunter sehen wir unsere Temperatur. Okay, also im Code hinter der Datei verwenden wir das als L-Punkt-Liste Nullindexpunkt Min, Punkttemperatur. Und zusammen mit dem verketten wir das Grad-Celsius-Symbol. Sie können das Grad-Celsius-Symbol von Google finden. Ordnung, los geht's. Jetzt weisen wir diese Temperatur der Texteigenschaft LDL-Temperaturpunkt zu. Und auf der XAML-Datei - oder Ordnerseite werden die fest codierten Temperaturdaten entfernt. Okay, jetzt lass uns diese Anwendung ausführen. Und los geht's. Sie können sehen, dass wir diese Temperatur bekommen, aber sie liegt nicht in Celsius bis Fahrenheit. Es gibt also viele Möglichkeiten, Fahrenheit in Celsius umzurechnen. Das erste ist, dass wir in C-Sharp eine Logik erstellen können, um unsere Fahrenheit-Temperatur Celsius umzurechnen. Aber laut der Open Weather Map ist API für uns nur ein Kinderspiel. Laut ihrer Dokumentation übergeben wir einfach die Uterus-Gleichheitsmetrik in der API-URL. Und das ist alles, wir erhalten die Temperaturdaten in Celsius. Was wir also tun werden, ist, zur API-Serviceklasse zu und sie übergeben die Metrik „Einheiten gleich “ in diesen beiden APA-Brillen. Lassen Sie uns diese Anwendung noch einmal ausführen. Jetzt sehen Sie dieses Mal das Wetter, die Temperatur in Celsius. Dies ist ein weiteres Problem, und das heißt, wir brauchen diesen Wert des Punktes nicht. Wir müssen diesen Wert abrunden. Gehen wir zu den Modellklassen und sie sind innerhalb der Hauptklasse, werden diese feuchte Eigenschaft sehen , die die Temperatur darstellt. Okay, wir fügen eine weitere Eigenschaft vom Typ double hinzu und nennen sie Temperatur. Und dann ordnen wir unsere Temperatur der Temperatureigenschaft zu. Gleich danach. Wir schließen diese Temperatur und die falsche Funktion „Mat Dot“ ein. Nun, Matt ist eine Klasse in C Sharp und die Disrupt-Funktion wird verwendet , um die Zahl abzurunden. Jetzt wird im Code dahinter, anstatt die Temperatur zu verwenden, die Temperatureigenschaft verwendet. Okay, lass uns diese Anwendung ausführen. Und hier auf dem Gerät wird die Temperatur auf eine nette Art und Weise angezeigt . Okay, jetzt lass uns mit unserer Luftfeuchtigkeit und Vint arbeiten. Also zurück zum Jason Beauty Fire. Und im Hauptknoten haben wir diese Temperatureigenschaft , die wir zuvor verwendet haben. Und jetzt. Im selben Hauptknoten wird diese Feuchtigkeitseigenschaft angezeigt. Wir verwenden also dieselbe Logik, um auf die Luftfeuchtigkeit zuzugreifen , mit der wir auf diese Temperatur zugegriffen haben. Im Code hinter der Datei wählen wir einen Selbstpunkt. Wählen Sie dann die Liste der Null-Index-Punkt-, Min - und Punkt-Feuchtigkeitseigenschaften und verketten Sie das Prozentsymbol am Ende. Jetzt weisen wir diese Luftfeuchtigkeit der Texteigenschaft LBL humidity dot zu. Und in der XAML-Datei, ob die Seite den fest codierten Feuchtigkeitswert entfernt. Okay, fangen wir jetzt mit der Windgeschwindigkeit im Jason Beauty Fire an, die dies öffnet, wenn Knoten. Und dort sehen wir die Speed-Eigenschaft. Um darauf zuzugreifen, verwenden wir das als Del-Dot-Liste der Null-Index-Punkt-Windgeschwindigkeit. Und zusammen mit dem werden wir Kilometer pro Stunde verketten. Dann weisen wir diesen Wert dem LBL-Windgeschwindigkeitspunkttext zu. Und vergessen Sie nicht, den fest codierten Wert für die Windgeschwindigkeit in der XAML-Datei des Datenbankpunkts zu entfernen . Ordnung, los geht's. Jetzt lassen Sie uns diese Anwendung noch einmal ausführen. Hier auf dem Gerät werden die Wetterdaten wie Temperatur, Luftfeuchtigkeit und Windgeschwindigkeit angezeigt . In der nächsten Lektion werden wir nun mit Darth Vader-Bildern arbeiten. Wir sehen uns in der nächsten Lektion. 11. Wetterbilder anzeigen: In dieser Lektion werden wir mit den Wetterbildern arbeiten. Anstelle der Veteranenanwendung wird ein fest codiertes Bild angezeigt. Jetzt wird das Bild gemäß der Wetter-API angezeigt. Also gehen wir zum benachbarten Luftreiniger unter der Liste, werde das besser erklären. Hier haben wir ein Icon mit etwas Code. Um nun auf die Wetterbilder zugreifen zu können, müssen wir die Bildrichtlinien für offene Wetterkarten befolgen. Gehen wir zu dieser URL. Um auf die Bilder zugreifen zu können, müssen wir diese URL verwenden. Dazu müssen wir den Bildcode hinzufügen. Ich kopiere diese URL und füge sie in einen anderen Tab ein und drücke die Eingabetaste. Ordnung, los geht's. Jetzt fügen wir hier einen anderen Bildcode und drücken die Eingabetaste und wir sehen ein anderes Bild. Ordnung, also müssen wir diese Bildrichtlinien befolgen , um auf die Bilder zugreifen zu können. Gehen wir zu unserem Projekt. Und sie werden in die Modellklassen gehen. Innerhalb der Vector-Klasse. Fügen wir die Eigenschaft vom Typ string hinzu und nennen sie die vollständige Icon-URL. Dann kopieren wir die Bild-URL und weisen sie dieser Eigenschaft zu. Okay, jetzt, in der Bild-URL wird das Symbol verkettet, was wir als anständige Antwort erhalten. Also werden wir diese URL-String-Punkt-Format-Funktion umschließen. Und anstelle von Ich kann codieren, fügen wir einen Platzhalter hinzu. Dann nach dieser URL wird ein Kommatrennzeichen hinzugefügt und dann das Symbol hier hinzugefügt. Ordnung. Verwenden wir nun im Videoseitencode hinter der Datei den Ergebnispunkt. Dann wollen wir auf die Icon-Eigenschaft zugreifen. Um auf dieses Symbol zugreifen zu können, benötigen wir zunächst eine Liste mit Nullindex. Dann brauchen wir einen Wert von Null Index. Gleich danach können wir die Eigenschaft icon verwenden. Und weil wir eine vollständige Icon-URL-Eigenschaft hinzugefügt haben, also dieses vollständige Symbol verwenden, werden Sie hier Eigentum haben. Dann weisen wir dieses Symbol dieser IMG-Wetterpunkt-Quelleigenschaft zu. Und im Bundesbit entfernt XAML-Datei den hartcodierten Quell-Drop D dieses Bildes. Okay, jetzt versuchen wir, diese Anwendung auszuführen. Und dieses Mal bekommen wir ein dynamisches Wettersymbol. Mal sehen, ob wir diese dunklen Icons brauchen. Und wir wollen Icons anpassen. Wir haben bereits die Symbole im Ordner Bilder mit diesen standardmäßigen Namenskonventionen hinzugefügt . Oder ich kann den Namen mit einem Icon-Unterstrich beginnen. Dann haben wir den Icon-Code. Jetzt fügen wir in dieser roten Klasse eine weitere Eigenschaft hinzu und nennen sie ein benutzerdefiniertes Symbol. Dann wählen wir den Lambda-Operator und gleich danach wählen wir die Zeichenfolgenpunktformatfunktion. Und darin werden doppelte Anführungszeichen hinzugefügt und der Name des Symbols hinzugefügt. Im Bilderordner haben wir viele Wettersymbole und all dies beginnt mit dem Unterstrich des Symbols, und dann hat jedes Symbol einen eindeutigen Code. Und danach haben wir die Punkt-PNG-Erweiterung. Fügen Sie also einen Unterstrich hinzu. Und anstelle von Ich kann codieren, fügen wir einen Platzhalter hinzu. Und gleich danach fügen wir die Punkt-PNG-Erweiterung hinzu. Okay, jetzt fügen wir ein Komma-Trennzeichen hinzu und fügen dieses Symbol hier hinzu. Mit dieser Zeile können wir unsere benutzerdefinierten Symbole verwenden. Jetzt im Datenbankcode hinter der Datei, wer benutzt einfach das benutzerdefinierte Symbol. Und dann führen wir diese Anwendung aus. Hier. Sie werden sehen, dass wir dieses Mal unser benutzerdefiniertes Symbol erhalten. Das ist also alles für diese Lektion. Jetzt sehe ich dich in der nächsten. 12. Weather: In dieser Lektion fügen wir Ansicht der stündlichen Wetterdatenerfassung hinzu. Zuvor haben wir mit den aktuellen Wetterdaten gearbeitet. Lassen Sie uns nun unsere Arbeit mit der Collection View beginnen. Im Code hinter der Datei. Gehen wir zur eigenen ansprechenden Methode. Und dort haben wir bereits eine Wetter-API konsumiert. Und dieses Ergebnis enthält die Daten, die von der API stammen. Jetzt fügen wir eine foreach-Schleife hinzu, weil wir die Liste der Wetterdaten erhalten möchten. Also fügen wir für jede Schleife eine Schleife hinzu. Und hier drin wollen wir eine Liste, ob wir die Wurzelklasse hydratisieren wollen . Wir haben diese Listeneigenschaft, und diese Eigenschaft wird unsere stündlichen Wetterdaten enthalten. In der for each Schleife wird also mit diesem Ergebnis auf die Eigenschaft list zugegriffen. Erinnern wir uns nun an die ListView - und CollectionView-Konzepte, die wir in der Listenansicht und in der Sammlungsansicht besprochen haben . Zuerst fügen wir eine Liste hinzu, dann fügen wir die Daten in die Liste ein. Und schließlich weisen wir die Liste der Elementquelle der Sammlungsansicht zu. Fügen wir also eine Liste im anderen Seitencode hinter der Datei hinzu. Jetzt ist die Frage, was ist der Typ dieser Liste? Diese Liste wird vom Typ Listenklasse sein , die in unserem Models-Ordner vorhanden ist . Okay, jetzt lasst uns diese Liste in Liste umbenennen. Die Indexstruktur. Lassen Sie uns diese Liste initialisieren. nun in der for-each Schleife Fügen wir nun in der for-each Schleife die Daten innerhalb dieser Wetterliste hinzu, indem wir die Hilfsmethode add verwenden. Und außerhalb dieser Foreach-Schleife wird die CV-Wetterpunkt-Elementquelle verwendet , die gleich ist, ob Liste, Das Lebenslaufwetter ist unser Sammlungsansichtsname. Und wir haben diese Sammlungsansicht in der Wetterbit-XAML-Datei erstellt . Ordnung, jetzt in der nächsten Lektion binden wir die Datenerfassung, die WE kontrolliert. Okay, wir sehen uns in der nächsten Lektion. 13. DataBinding in der Weather: In dieser Lektion verwenden wir diese Datenbindung in unserer Sammlungsansicht, damit wir die Wetterdaten in der Sammlungsansicht anzeigen können. Auf der anderen Seite sehen wir drei Steuerelemente in der Sammlungsansicht, das Bild und zwei Beschriftungen in der Ferne verschönert. Wir können sehen, dass, um das Bild zu erhalten, eher den Null-Index wählen wird. Und dann wählen wir die Icon-Eigenschaft aus. Aber in jeder Modellklasse haben wir ein benutzerdefiniertes Symbol verwendet. Wir binden dieses benutzerdefinierte Symbol, unabhängig von der Bildsteuerung. Also was wir tun werden, ist auf die Webseite zu gehen. Da. Lassen Sie uns die Quelle des Bildes mit dem benutzerdefinierten Symbol Wetter des Null-Index-Punkts finden. Ordnung, jetzt binden wir diese Leveltext-Eigenschaft mit der Temperatureigenschaft. Laut dem verschönerten DSM ist die Temperatureigenschaft innerhalb einer Hauptklasse vorhanden. Verwenden wir also die Hauptpunkttemperatur. In der Hauptklasse haben wir eine benutzerdefinierte Eigenschaft für die Temperatur hinzugefügt, haben wir eine benutzerdefinierte Eigenschaft für die Temperatur hinzugefügt sodass wir die Temperatur in einer Runde von 4 Bit erhalten können, die von diesem Leveltext ohne Haupt-Punkt-Temperatureigenschaft verkauft wird . Ordnung, in ähnlicher Weise wird diese zweite Ebene mit der Eigenschaft date verknüpft. Jetzt wird im anständigen Schönheitsfeuer ein Datum im Unix-Zeitformat angezeigt . Und wir müssen dies in menschenlesbares Datumsformat konvertieren. also im Models-Ordner wir also im Models-Ordner zu dieser Listenklasse. Und da haben wir diesen Eigenschaftsnamen d t. Nun, wir brauchen eine andere Eigenschaft vom Typ string, die verwendet wird, um unsere Unix-Zeit in die UTC-Zeit zu konvertieren. Bevor wir die Eigenschaft hinzufügen, gehen wir zum NuGet-Paket. Da. Dieses Paket zur Konvertierung der Unix-Zeit in die UTC-Zeit. Ordnung, wir werden dieses NuGet-Paket installieren. Jetzt wird einmal dieses NuGet-Paket installiert. Dann fügen wir eine Eigenschaft vom Typ string hinzu und nennen sie datetime. Dann verwenden wir den Lambda-Operator. Und gleich danach verwenden wir einen UTC-Zeitstempel. Und für diesen UTC-Zeitstempel müssen wir diesen Namespace importieren. Okay, jetzt mit diesem UTC-Zeitstempel wird diese Methode in UTC konvertiert. Und diese Methode nimmt das Datum im Unix-Format an. Also geben wir dieses D, D hier weiter. Ordnung. Jetzt konvertiert diese Zeile eine sehr Unix-Zeit in UTC-Zeit. Okay, wenn Sie dieses NuGet-Paket nicht zum Konvertieren der Unix-Zeit verwenden möchten , könnte sie diesen Code einfach verwenden, um Durst Sie beim nächsten Mal in UDC-Zeit zu konvertieren. Ich werde diesen Codeausschnitt zusammen mit diesem Video anhängen. Okay, jetzt lass uns auf die Webseite gehen. Und dort finden wir die Texteigenschaft dieses Labels mit der Datetime, weil das DT oder datetime ein direktes untergeordnetes Element der Liste ist. Wir brauchen also vor dem Datum und der Uhrzeit nichts, genau wie wir es zuvor mit dem Bild und der Temperatur getan haben. Weil das Bild und die Temperatur nicht in der Listenklasse vorhanden sind, aber die DateTime in der Listenklasse vorhanden ist. Also werden wir direkt positiv sein. Ordnung, jetzt ist es Zeit , diese Anwendung auszuführen. Sobald wir diese Anwendung ausgeführt haben, sehen wir diese Wetterseite. Und unten auf dieser Seite sehen wir eine Sammlungsansicht mit Wetterdaten. Das ist alles aus dieser Lektion. Jetzt sehe ich dich im nächsten. 14. Gerätestandort: In dieser Lektion arbeiten wir mit dem Ortungsdienst. Derzeit haben wir den Breiten- und Längengrad in der Wetter-API fest codiert . Aber jetzt wollen wir den Breiten- und Längengrad entsprechend unserem Gerät ermitteln. Also gehen wir zum Webseitencode hinter der Datei. Und dann schreiben wir unseren Code, um den Standort des Geräts zu ermitteln. Zuvor möchte ich Ihnen jedoch mitteilen, dass Microsoft Team zum Zeitpunkt der Aufnahme dieses Videos die Dokumentation des Xamarin Essentials-Plug-ins nicht aktualisiert hat . Der neue Name ist Molly Essentials. In Xamarin Essentials und Molly Essentials Plugin wird alles gleich sein . Also gehen wir zu Google und suchen nach der Geolokalisierung von Xamarin Essentials. Ordnung, öffnen wir diesen Link. Jeder hat unterschiedliche Plattformen wie Android, iOS und Windows. Ich zeige Ihnen, wie Sie die Berechtigung in Android hinzufügen. Also kopiere ich diese Berechtigungen. Und laut Dokumentation müssen wir diese Berechtigungen in der Android-Manifestdatei hinzufügen . Also gehen wir zu den Plattformen, erweitern das Android und öffnen die Android-Manifestdatei. Dort würden diese Berechtigungen eingefügt. Jetzt speichern wir die Datei und schließen sie. In ähnlicher Weise müssen wir im iOS diese Berechtigungen in der Datei info.plist hinzufügen. Ich habe Ihnen bereits in der Nachrichtenanwendung gesagt , wie wir Berechtigungen im iOS-Projekt hinzufügen können. Ich habe diese Aufgabe für Sie überlassen, um diese Berechtigungen und das Iris-Projekt hinzuzufügen. Okay, jetzt in der Akkordeonakte, lies die Seite. Fügen wir eine AC-Methode vom Typ Dämmerung hinzu und nennen sie, Standort abrufen. Okay, bei dieser Methode verwenden wir den Code, um den Standort zu ermitteln. Laut der Dokumentation müssen wir diese await Geo-Location-Klasse und diese Methode get location async verwenden , um die Standortdaten abzurufen. Soul Juice, Gewicht, Geolokalisierungsglas, und dann nennen Sie die GetLocation ist stigmatisch. Jetzt speichern wir das Ergebnis in einer Variablen und nennen es „location“. Mit Dislokation können wir viele Dinge auswählen, aber wir müssen nur den Breiten- und Längengrad verkaufen. Verwenden Sie den Breitengrad des Positionspunkts und fügen Sie zwei Felder außerhalb dieser Methode hinzu, indem Sie double eingeben und benennen. Die Einstellung. Und der andere Feldname ist Längengrad. Jetzt weisen wir dem Breitengrad den Dislokationspunktbreitengrad und dem Längengrad des Positionspunkts den Längengrad zu. Wenn nun der Benutzer die Anwendung ausführt, die Methode „owner being“ die Methode ruft die Methode „owner being“ die Methode GetLocation auf. Okay, rufen wir diese getLocation-Methode hier mit dem Schlüsselwort await auf. Dann werden in den fest codierten Breiten - und Längengradwerten der Breiten- und Längengrad übergeben , der vom Gerätestandort abgerufen wird. Ordnung? Jetzt zuvor in der Anwendung möchte ich Ihnen sagen, dass Sie nichts hinzufügen müssen , wenn Sie das echte Gerät verwenden . In unserer Bewerbung wählen wir Ihren aktuellen Standort aus. Wenn Sie jedoch den Emulator verwenden, wählt der Emulator den Standardspeicherort aus. So können wir die Delegation im Emulator nach unserer Wahl festlegen . Im Emulator geht es zu diesen drei Punkten. 2s Standort hier in der Suchleiste. Wählen Sie den Standort nach Ihrer Wahl. Ordnung? Stellen Sie dann den Standort ein. Okay, jetzt lass uns diese Anwendung ausführen. Und los geht's. Dieses Mal bekommen wir das Ort-Alphabet-Gerät oder den Emulator. Okay, soweit so gut. Wir haben den Standort-Teil abgedeckt. Wir sehen uns in der nächsten Lektion. 15. YourLocation Gewählte Veranstaltung: Zuvor haben wir mit einem Gerätestandort gearbeitet , um die Wetterdaten abzurufen. Lassen Sie uns nun sehen, ob wir den Standort des Geräts ändern werden. Und wenn die App geöffnet oder im Hintergrund ist und Sie auf Ihren Standort drücken , müssen wir die Federdaten entsprechend unserem neuesten Standort in der Datenbank-SAML-Datei abrufen . Gehen wir zu diesem Rahmen, dieses Etikett für Ihren Standort enthält. Wir werden einen Gestenerkenner hinzufügen. Und gleich danach erstellen wir einen intimen Datenspeicherort mit Tippgesten. Und dann bekommen wir ein Tap-Event. Wir können das Klickereignis außer der Schaltfläche und der Bildschaltfläche nicht abrufen . Deshalb haben wir das Tiefen-Event ins Leben gerufen. Gehen wir nun zu der Webseite namens BAM-Datei. In diesem Schrittereignis müssen wir den Code schreiben, um die Wetterdaten nach Standort zu erhalten . Wir müssen den gleichen Code verwenden, wir in ihrer eigenen erscheinenden Methode geschrieben haben. Um die Duplizierung zu entfernen, wird derselbe Code wiederverwendet. Zuerst fügen wir eine asynchrone Methode vom Typ task hinzu und benennen sie, holen Wetterdaten nach Standort ab. Und diese Methode verwendet zwei Parameter vom Typ Double, Breitengrad und Längengrad. Okay, jetzt schneiden wir diesen API-Code aus der eigenen Append-Methode und fügen diesen Code in diese Methode ein. Jetzt rufen wir im getappten Ereignis die Methode GetLocation auf, rufen wir im getappten Ereignis die Methode GetLocation denn wenn dieser Benutzer die Anwendung zum ersten Mal ausführt, rufen wir die GetLocation in der Eigentümerbeam-Methode auf. Wenn jedoch die Anwendung geöffnet ist und jetzt der Speicherort geändert wird, rufen wir die Methode GetLocation in diesem Tiefenereignis erneut auf. Danach nennen wir das Abrufen von Wetterdaten nach Standort und Pasta. Breiten- und Längengrad. Vergessen Sie nicht, den Awart-Async hinzuzufügen. Hoffe du hast dieses Konzept, das ist nichts Neues hier. Wir haben den Code gerade mit Hilfe von Methoden wiederverwendet. Lassen Sie uns nun diese Anwendung ausführen und wir ermitteln den Standort entsprechend unserem Gerät. Jetzt ändern wir den Standort des Geräts. Und wenn wir dieses Jahr auf die Option Standort klicken, erhalten wir diesmal die Wetterdaten entsprechend unserem neuen Standort. Versuchen wir es auch noch einmal. Ordnung, los geht's. Das ist also alles aus dieser Lektion. Jetzt sehe ich dich in der nächsten. 16. Wetterdaten nach Stadt: Zuvor haben wir mit den Wetterdaten nach Standort gearbeitet. In dieser Lektion werden wir nun mit den Wetterdaten nach Stadtname und Einstellungen arbeiten . Sie tippen auf dieses Suchsymbol und er sieht das Pop-up, in das er den Stadtnamen eingeben kann. Und dann wurden die Wetterdaten entsprechend dem Namen der Stadt geändert. Also gehen wir zuerst zur Vet-Bit-XAML-Datei. Da. Lass uns ein Klickereignis für diesen Bild-Button bekommen. Jetzt in der Akkordeon-Datei geht es zu diesem Klickereignis. Und sie würden die Display-Eingabeaufforderung async verwenden. Und diese Anzeigeaufforderung, eine Szene, ist im Grunde ein Popup, das verwendet wird , um die Eingabe des Benutzers zu akzeptieren. Fügen wir die asynchronen Schlüsselwörter await hinzu. Diese asynchrone Eingabeaufforderung benötigt viele Parameter, aber alle sind optional mit Ausnahme des Titels und der Nachricht. Wir brauchen keinen Titel und keine Nachricht. Also fügen wir die Titelspalte und diese leere Zeichenkette hinzu. In ähnlicher Weise wird in der Nachricht auch eine leere Zeichenfolge übergeben. Nun fügen wir im Platzhalter die Suche hinzu, ob nach Stadt. Ordnung. Diese asynchrone Eingabeaufforderung enthält zwei Schaltflächen außer und cancel. Wenn Sie den Text dieser Schaltflächen ändern möchten, können Sie ihn entsprechend ändern. Nehmen wir an, wir möchten den Text dieser Schaltfläche „Akzeptieren“ ändern . Also werden wir die Suche hier bestehen. Wir müssen den Text des Zugknopfs nicht ändern. Also übergeben wir einfach die Stornierung hier. Ordnung, jetzt speichern wir das Ergebnis in einer Variablen und wir nennen es response. Dann prüfen wir, ob die Antwort nicht Null ist. Fügen Sie dann einen Breakpoint zusammen mit dieser if-Bedingung hinzu und führen Sie diese Anwendung einfach aus. Okay, jetzt drücke dieses Suchsymbol und wir sehen dieses Pop-up. Lass uns etwas im Pop-up hinzufügen. Dann wurde diese Suchoption unterdrückt. Sie niemals Breakpoint werden ausgelöst und sehen hier den Text, den wir in das Pop-up eingegeben haben. Okay, lassen Sie uns diese Anwendung beenden und den Breakpoint entfernen. In diesem Wenn-Block fügen wir nun den Code hinzu, um die Wetterdaten zu erhalten. Zuvor haben wir diesen Code verwendet, um die Wetterdaten nach Standort abzurufen. Jetzt wollen wir die Wetterdaten nach Stadtnamen erhalten. Also, was ich tun werde, ist diese Vektordatenmethode für den Standort zu kopieren und sie hier einzufügen. Jetzt ändern wir den Namen, um Wetterdaten nach Stadt zu erhalten. Und innerhalb dieser Methode wird nur ein Parameter vom Typ string übergeben und wir nennen ihn city. Stattdessen ruft get weather die Methode get weather city zusammen mit der API-Serviceklasse auf und übergibt die Stadt. Nicht in diesem Wenn-Block. Wir nennen den Tierarzt einfach die Daten nach Stadtmethode. Und vergiss nicht , das Warten hinzuzufügen. Jetzt funktioniert dieser Code. Aber schauen Sie sich diese Datensatzwiederholung in unserem Code an, z. B. der Code, der in den Darmwetterdaten nach Standort vorhanden ist ähnelt der Code, der in den Darmwetterdaten nach Standort vorhanden ist, dem, den wir im Get Weather verwendet haben Daten nach Stadt. Was wir also tun werden, ist eine weitere Methode hinzuzufügen und sie zu benennen: UI aktualisieren. In dieser Methode fügen wir einen Parameter vom Typ dynamic hinzu und nennen ihn result. Wir haben den Typ dynamisch festgelegt , da wir den Typ der Antwort , die von der API erhalten wird, nicht kennen . Wenn Sie den Mauszeiger auf dieses Variablenergebnis bewegen, wird der Typ angezeigt, der die Root-Klasse ist. Aber wir werden mit dem dynamischen Typ weitermachen. Grundsätzlich werden dynamische Typen verwendet, wenn wir den Typ nicht kennen. Okay? Sie können diese Route auch hier in der Aktualisierungsmethode verwenden. Dann schneiden wir diesen Code einfach von Anfang an aus, egal ob Daten nach Standortmethode, egal ob Daten nach Standortmethode und fügen ihn in die Update-UI-Methode ein. Und wir werden die Punktzahl von Anfang an entfernen , ob Daten nach Stadt sortiert sind. Ordnung. Dann rufen wir die Update-UI-Methode auf, holen Wetterdaten nach Standort ab und übergeben dieses Ergebnis. In ähnlicher Weise nennen wir diese Updates auch eine Methode. Holen Sie sich Wetterdaten nach Stadt und übergeben Sie dieses Ergebnis. Ordnung, jetzt lass uns diese Anwendung drehen. Hier auf dem Gerät werden die Wetterdaten angezeigt. Wenn Sie jetzt auf das Suchsymbol tippen und nach einer Stadt suchen, erhalten wir das Wetter entsprechend unserer Suche. Ordnung, das ist großartig. Nehmen wir an, wir wollen zu meinem aktuellen Wetter zurückkehren. Also tippe ich einfach auf deinen Standort. Und bumm, los geht's. Wir erhalten die aktuellen Wetterdaten. Okay, das ist alles aus dieser Lektion. Jetzt sehe ich dich im nächsten. 17. Design Welcome Page: In dieser Lektion arbeiten wir mit der Willkommensseite der Feather-Anwendung. Und der Benutzer öffnet die Anwendung zum ersten Mal. Und er wird diese Willkommensseite oder die Seite „Erste Schritte“ sehen . Ordnung, nach dem Drücken dieser Schaltfläche, die sie verwenden, wird es entweder direkt auf der Seite angezeigt. Und dort können Sie die Federdetails sehen. Nehmen wir nun an, der Benutzer schließt die Anwendung. Und wenn er die Anwendung öffnet, wird der Benutzer diesmal die Begrüßungsseite nicht sehen. Okay, wir bekommen also diese Art von Funktionalität mit dem vertikalen pH-Wert, der nur einmal angezeigt wird. Lassen Sie uns also eine neue Inhaltsseite im Dalton-Filmprojekt erstellen. Und wir nennen es Willkommensseite. Ordnung, in diesem Bereich werden wir ein paar Steuerelemente hinzufügen. Lassen Sie uns zunächst die Farbe der Inhaltsseite festlegen. Dann fügen wir ein Stack-Layout hinzu. Und in diesem Stack-Layout werden ein Bild, drei Ebenen und eine Schaltflächensteuerung hinzugefügt . Der Code ist sehr einfach. Da. Ich werde den Code verwenden, den ich bereits geschrieben habe, nur um zu sehen, ob die Zeit gekommen ist. Keine Sorge, ich habe gehört, dass dieser Beispielcode zusammen mit diesem Video bereitgestellt wurde. Okay, jetzt sieh dir ein Klickereignis dieses Button-Steuerelements an. Und los geht's. In diesem Klick-Event wollen wir zum Federal Pitch navigieren. Also wählen wir Navigationspunkt, Push, Modal, Async. Da. Wer hat die andere Seite passiert. Dann legen wir in der CSS-Datei des App-Punktsymbols fest, dass die Hauptseite der Willkommensseite entspricht. Lassen Sie uns nun diese Anwendung ausführen und wir sehen diese Willkommensseite. Nach dem Drücken dieser Taste wird zum Strand umgeleitet. Jetzt stoppt es die Anwendung und führt sie erneut aus. Dann sehen wir uns diese Willkommensseite an. In der nächsten Lektion zeige ich Ihnen, wie Sie die Begrüßungsseite nur einmal anzeigen. Ordnung, wir sehen uns in der nächsten Lektion. 18. Version: In dieser Lektion setzen wir unsere Arbeit mit der Willkommensseite fort. Dann öffnet der Benutzer die Anwendung zum ersten Mal. Dann zeigen wir die Willkommensseite. Es gibt einen Benutzer. Und später, wenn er die Anwendung zum zweiten Mal öffnet, wird er die Willkommensseite nicht sehen. Um diese Funktionalität zu erreichen gehen Sie zur App dot dot CSS-Datei. Und sie werden die Punkttrack-Methode der Versionsverfolgungsklasse verwenden Grundsätzlich wird dieses Versions-Tracking verwendet, um die Version der Anwendung zu einem früheren Zeitpunkt zu verfolgen . Dies ist ein Teil von sieben Essentials. Und es gibt auch eine Dokumentation dieser Versionsverfolgung. Gemäß diesem Dokument wird in dieser Version die Tracking-Punktspur verwendet , um die aktuelle Version der Anwendung zu verfolgen. Dann verwenden wir eine if-Bedingung und überprüfen. Wenn der Versionsverfolgungspunkt zum ersten Mal gestartet wird, ist die Eigenschaft true. Dann legen wir fest, dass die mittlere Seite der Willkommensseite entspricht. Sonst. Wenn es nicht stimmt, dann setzen wir die Hauptseite der Wetterseite gleich. Grundsätzlich wird dieser Versionsverfolgungspunkt beim ersten Start verwendet , um zu überprüfen, ob die Anwendung zum ersten Mal gestartet wird oder nicht. Die Anwendung wird zum ersten Mal gestartet. Dann setzen wir die Hauptbasis auf die Willkommensseite. Und wenn die Anwendung zum zweiten Mal gestartet wird oder so weiter, dann stellen wir die Hauptseite auf Strand ein. Okay, lass uns diese Anwendung ausführen. Und hier sehen wir die Willkommensseite. Okay, lass uns vorwärts gehen und wir sehen uns den Strand an. Stoppen wir jetzt die Hinrichtung. Und wir werden diese Anwendung erneut ausführen. Dieses Mal werden wir die Lieferantenbasis als unsere Hauptbestandteile sehen . Ordnung, ich hoffe, Sie haben dieses Konzept der Versionsverfolgung. Das ist alles aus dieser Lektion. Jetzt sehe ich dich in der nächsten.