Flutter Blog mit Fiore - Erstellen einer kompletten ios und Android-App | Yazdani Chowdhury | Skillshare
Suchen

Playback-Geschwindigkeit


1.0x


  • 0.5x
  • 0.75x
  • 1x (normal)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

Flutter Blog mit Fiore - Erstellen einer kompletten ios und Android-App

teacher avatar Yazdani Chowdhury, UI/UX Expert, Mobile & Web App Developer

Schau dir diesen Kurs und Tausende anderer Kurse an

Erhalte unbegrenzten Zugang zu allen Kursen
Lerne von Branchenführern, Ikonen und erfahrenen Experten
Wähle aus einer Vielzahl von Themen, wie Illustration, Design, Fotografie, Animation und mehr

Schau dir diesen Kurs und Tausende anderer Kurse an

Erhalte unbegrenzten Zugang zu allen Kursen
Lerne von Branchenführern, Ikonen und erfahrenen Experten
Wähle aus einer Vielzahl von Themen, wie Illustration, Design, Fotografie, Animation und mehr

Einheiten dieses Kurses

    • 1.

      Einführung

      0:38

    • 2.

      Design App Bar

      9:16

    • 3.

      Drawer

      11:22

    • 4.

      Verbinde dich mit FiRestore

      5:18

    • 5.

      Firestore

      6:05

    • 6.

      Get von Firestore abrufen

      15:47

    • 7.

      Details Seitenfunktion für jeden Beitrag

      7:31

    • 8.

      Details Seitendesign zum Anzeigen von Details Post

      3:53

    • 9.

      Daten an Details senden

      6:31

  • --
  • Anfänger-Niveau
  • Fortgeschrittenes Niveau
  • Fortgeschrittenes Niveau
  • Jedes Niveau

Von der Community generiert

Das Niveau wird anhand der mehrheitlichen Meinung der Teilnehmer:innen bestimmt, die diesen Kurs bewertet haben. Bis das Feedback von mindestens 5 Teilnehmer:innen eingegangen ist, wird die Empfehlung der Kursleiter:innen angezeigt.

180

Teilnehmer:innen

--

Projekte

Über diesen Kurs

Willkommen in diesem (Flutter Blog mit app und Android App)App für App. In diesem Flutter lernst du, wie du eine komplette Real World ios und Android-App mithilfe von Cloud Firestore erstellen kannst.

Flutter ist eine plattformübergreifende Plattform für die Erstellung von Apps für ios und Android-Handys. Es bedeutet, dass derselbe Code auf beiden Plattformen ausgeführt wird. Viele große Unternehmen haben bereits begonnen, Flutter für ihre mobile App zu verwenden. Dies ist also der richtige Zeitpunkt, um Flutter zu lernen. In diesem Kurs erstellst du eine komplette App mit Flutter und es hilft dir, den gesamten Prozess des flutter. zu verstehen. Für die Speicherung unserer App-Daten verwenden wir Firebase Cloud Firestore.

Wann du diese Flutter App entwickelst. Hier sind einige Listen, die du in diesem Kurs lernen wirst.

  • Flutter Navigation Schublade

  • Flutter AppBar

  • Flutter Materialdesign

  • Flutter Kartenansicht

  • Wie du firebas in einer Kartenansicht in der App zeigt

  • Flutter Widget - Lerne verschiedene Arten von Widgets für Android- und ios-Plattformen

  • Flutter und Spalte. Du lernst, wie du Daten in einer Zeile und Spalten zeigen kannst.

  • Flutter ListView Builder

  • Du lernst Firebase Cloud Firestore

  • Du, Will, eine komplette Blog mit FiRestore erstellen

  • ios und Android App Entwicklung mit Flutter

Triff deine:n Kursleiter:in

Teacher Profile Image

Yazdani Chowdhury

UI/UX Expert, Mobile & Web App Developer

Kursleiter:in
Level: All Levels

Kursbewertung

Erwartungen erfüllt?
    Voll und ganz!
  • 0%
  • Ja
  • 0%
  • Teils teils
  • 0%
  • Eher nicht
  • 0%

Warum lohnt sich eine Mitgliedschaft bei Skillshare?

Nimm an prämierten Skillshare Original-Kursen teil

Jeder Kurs setzt sich aus kurzen Einheiten und praktischen Übungsprojekten zusammen

Mit deiner Mitgliedschaft unterstützt du die Kursleiter:innen auf Skillshare

Lerne von überall aus

Ob auf dem Weg zur Arbeit, zur Uni oder im Flieger - streame oder lade Kurse herunter mit der Skillshare-App und lerne, wo auch immer du möchtest.

Transkripte

1. Einführung: Willkommen zu diesem Kurs. Mein Name ist in Kürze Diastole und ich werde Ihr Lehrer in diesem Kurs sein. In diesem Kurs werden Sie eine Flop-Flutterblock-App Flop-Flutterblock-App mit Firebase Cloud Firestore sein. Hier ist die Anwendung, die Sie am Ende dieses Kurses entwickeln werden . Alle Daten stammen von firebase, Cloud Firestore. In diesem Kurs lernen Sie, dass unser Materialdesign, wie man damit arbeitet, zumindest für Builder, wie man Daten von einem Ort an einen anderen Ort weitergibt und vieles mehr. Jetzt hast du noch Zeit , diesen Kurs anzumelden. Immer noch im Kurs. Danke. 2. Design App Bar: Hallo Leute, willkommen zurück. In diesem Teil werden wir unser neues Projekt starten, und das ist unsere Flutter-Blog-Anwendung , die die Firebase Cloud Firestore-Datenbank verwendet. So schnell müssen wir ein neues Projekt erstellen, okay, ein neues Projekt erstellen. Also geh zu dieser Datei, einem neuen und neuen Flatter-Projekt. Wählen Sie weitere Anwendung aus. Und wir können es Flatterblock nennen. Und Weiter und Fertig. Wir können nur dieses Fenster öffnen. Okay? In Ordnung. Es wird einige Zeit dauern, bis der gesamte Grid-Oldfield-Prozess abgeschlossen ist. Bis dahin müssen wir warten. Okay, ich denke wir sind bereit zu gehen. Hier sehen Sie also unsere Bewerbung und das ist eine leere Bewerbung. Und hier sehen Sie automatisch generierten Code , der von flutter bereitgestellt wird. Bisher werden wir das tun. Vielleicht wirst du diesen ganzen Code nicht verstehen und das ist eine leere Vorlage, oder du kannst sagen. Also. Wir müssen mit dieser Vorlage arbeiten. Also was wir tun werden, wir werden einfach all diesen Code entfernen, Kontrolle auswählen, einen Stream von OK. Jetzt müssen wir zuerst unseren Materialkanal importieren. Okay? Also was wir tun müssen, wir müssen importieren, Material importieren Punkt ok. Hier drin müssen wir unsere weißen Männer direkt vor Augen führen, weiße Männer. Und jetzt müssen wir unseren Vorlauf hinzufügen. Und design f hat ein Apple-Widget. Das hier wird also neues Material sein. Okay. Jetzt müssen wir hier unser Home-Keyword hinzufügen und wir werden unsere Homepage für die Heimaktivität definieren. Das heißt, wenn ein Benutzer auf diese Anwendung klickt , wer ist dann Anwendung? Kombiniert immer mit open , damit wir kein Tempo haben. Also müssen wir eine neue Seite erstellen. Gehen Sie also in diesen Blattordner und erstellen Sie eine neue Datendatei. Und wir können es zu Hause nennen. Wir trennen nur den gesamten Code , damit Sie ihn sehr leicht verstehen können. Okay, jetzt hier drin müssen wir auch unseren Nachrichtenalarm importieren. Importiere also Waren, aber jetzt müssen wir unser zustandsbehaftetes Widget definieren. Also ein statusbehaftetes Widget, und wir können es diesen Klassennamen als home nennen. Okay, jetzt wird dieses Haus dieses Zuhause sein. Du kannst jetzt hier sehen, wir müssen unsere Homepage und Pesto Dot hinzufügen und vererben. Wir müssen unsere from-Klausel hinzufügen. Diese ganze Klasse ist also diese Home-Klasse, die wir gerade erstellt haben. Was wir hier gemacht haben, wir haben einfach alle diese Schichten getrennt , damit wir sie sehr leicht verstehen können. Okay, wir haben also eine neue Klasse erstellt und diese Klassenzeit ist zu Hause, und dieser Klassencontainer ist ein statusbehaftetes Widget, und wir werfen es einfach mit diesem Home-Schlüsselwort in unserer Haupt-RunApp-Material-EP. Okay, also wann, wenn wir diese Anwendung ausführen, wird unser schnelles Tempo geladen und das ist unsere Homepage. Jetzt müssen wir mit dem Entwerfen unserer Anwendung beginnen. Hier können wir also den Widget-Builder sehen, Kontexte und Kontexte erstellen und neue Container zurückgeben. Für diese Anwendung müssen wir also unser Gerüst-Widget importieren, diesen Container entfernen und das Gerüst-Widget hinzufügen. Innen. Das ist echt. Wir werden den ganzen Code machen, okay? Dies ist verbunden mit viel Eigentum, das wir für Design oder Epic nutzen können. Okay, also müssen wir zuerst das Obermaterial für unsere Anwendung hinzufügen. Wenn Sie also die App-Leiste hinzufügen möchten, müssen wir diese AB-, AB-Balken und AB-Balken mit Ampere hinzufügen . Also neue App-Leiste. Dann füge das ein über, du musst unsere App hinzufügen, aber Titel und Hintergrundfarbe Bei Titel und Titel offensichtlich ein Text. Also müssen wir Text hinzufügen. Hier drin. Wir müssen unsere Textdaten hinzufügen und wir können es Flattern nennen. Schau dir an, okay. Und wir müssen eine Hintergrundfarbe für unser Ampere definieren. Also wähle Hintergrundfarbe und wir müssen Farben wählen. Also Farben und Gedanken, wir können rotes X in der Farbe wählen. Wenn wir diese Anwendung jetzt ausführen, können wir unsere sehen, wir können Ihre Anwendung sehen. Also sehr ähnlich wie dort drüben. Also los geht's, wo Sie unsere Anwendung und unsere App-Leiste, einen Titel und eine Hintergrundfarbe sehen können . Okay, die eine Sache, ich füge nur ein paar tatsächliche Designs hinzu, damit du etwas Materialdesign lernen kannst. Dann werden wir unser Firebase-Backend mit dieser Anwendung implementieren . Okay, also hier kannst du sehen, also mach eine Sache hier drin. Wir müssen zwei Knöpfe hinzufügen, okay? Sehen Sie jetzt, wie wir einen Button hinzufügen können. In dieser AB-Leiste hat dieses Obermaterial also eine andere Eigenschaft und diese Eigenschaft wird als Aktionen bezeichnet. Und Action hat ein Widget oder eine Eigenschaft. Und innerhalb dieses ursprünglichen Immobilienbudgets müssen wir unsere Icon-Schaltfläche hinzufügen. So neu. Icon Taste, und es gibt uns zwei Parameter. Eine ist ein Symbol und eine ist beim Einfügen. Also für icon und für unangenehmes, denn icon wird ein neues Icon sein. Icon hat Icons von Eigentum. Ich kann anfangen. Jetzt. Wenn Sie das Symbol Start drücken, sehen Sie ein integriertes Symbol , das von flacher bereitgestellt wird. Für uns können wir also dieses Suchsymbol wählen. Und was bedeutet das für dieses eigene Tempo ? Was, was wird es bewirken? Wenn Sie also verwenden möchten, klicke ich auf einen beliebigen Benutzer, der auf diese Schaltfläche klickt. Wenn Sie dann etwas unternehmen möchten, müssen Sie mit diesen Vorspeisen arbeiten. Also werden wir vorerst nichts tun. Wir haben einfach einen Debug-Druck gemacht , damit Sie den Debug-Druck verstehen können. Und wir können es Suche nennen. Wenn der Benutzer auf diese Schaltfläche klickt, drucken wir diese Quelle in unserem Terminal aus. Okay, also willst du, lass es laufen. Jetzt können wir hier unser Icon sehen. Okay? Wenn ich jetzt auf dieses Symbol klicke und unser Terminal öffne, können wir jetzt nach Schlüsselwörtern suchen. Okay. Jetzt bei einer weiteren Taste, neuer Icon-Button. Und wieder wird es uns auf Parameter, Symbol und Preislos halten . Für dieses Symbol können wir also ein neues Symbol wählen. Icon wird sein, ich kann anfangen gedrückt zu werden. Wir werden Debug-Druck, Debug-Druck hinzufügen. Und wir können es bei anrufen, okay, jetzt führe das aus. Jetzt können wir hier zwei Icons sehen. Und wenn ich unser Terminal öffne und Sie bei so und so Antworten sehen können , okay. Also unser Körper und ist vollständig. Ich hoffe du verstehst was wir getan haben. Lass es mich noch einmal erklären. Was wir in diesem Teil gemacht haben, wir haben gerade ein Projekt erstellt und wir entfernen all diesen automatisch generierten Code. Dann haben wir diese Run-up- und Home-App für weiße Männer hinzugefügt. Und das ist das Wichtigste, wir können es nennen. Dies ist die Kopfzeile unserer Bewerbung. Sie müssen also diese Umgebung und innerhalb dieses Vorlaufs schreiben diese Umgebung und innerhalb dieses Vorlaufs um Ihren schnelllebigen Namen zu definieren, den Sie ausführen möchten. Okay. Jetzt haben wir hier ein statusbehaftetes Widget erstellt und unser Gerüst-Widget hinzugefügt. Und warum wir ein Gerüst benutzen müssen. Ein Gerüst, das uns anständige Eigenschaften bietet , die wir für unsere Anwendung verwenden müssen. Wir müssen unser Gerüst-Widget und Insight als Gerüst-Widget verwenden . Wenn wir eine AB-Leiste hinzufügen möchten, müssen wir dieses Schlüsselwort und einen Hinterhof-Container hinzufügen . Und drinnen, aber wir müssen all diese Eigenschaften hinzufügen, die diese getrennt enthalten oder die wir in dieser App-Leiste hinzufügen möchten. Also haben wir einen Titel und einen Titel hinzugefügt, offensichtlich einen Text. Dann haben wir einen Text hinzugefügt, und dieser Text ist dieser Text. Dann haben wir eine Hintergrundfarbe hinzugefügt. Sie können sehen, dass diese Hintergrundfarbe dieses rote X und die Hintergrundfarbe ist. Wenn wir eine Tool-Symbolschaltfläche in unserer App-Leiste hinzufügen möchten, sehen Sie möglicherweise das Symbol für viele Anwendungen. Also wie kannst du das machen? EPR hat also eine andere Eigenschaft namens actions. Und Aktionen. Aktionen sind ein Budget von Eigentum. Und innerhalb dieses Widgets oder dieser Eigenschaft müssen wir diese Icon-Schaltfläche verwenden. Also neue Icon-Schaltfläche und es enthält zwei Parameter. Eines ist ein Symbol und eines ist gedrückt. Innerhalb dieses icon-Parameters müssen wir unser Icon verwenden , das wir anzeigen möchten. Und das vor Ort rufe ich uns an. Und diese und diese auf der Seite funktionieren , wenn wir auf eines dieser Symbole klicken. Also ich hoffe du verstehst es und das war's für diesen Teil. Wir werden mit unserem nächsten Teil fortfahren. Danke. 3. Drawer: Hallo Leute, willkommen wieder, in unserem vorherigen Tutorial haben wir unsere App erfolgreich für unser Icon entworfen. Und in diesem Teil und um eine Sache zu tun, können wir einen Navigations-Drag hinzufügen. Okay? Das ist also unsere AB-Leiste und das ist unsere App-Leiste, und wir können hier einfach einen Kommentar abgeben. Okay, jetzt ist es an der Zeit, seltene Navigation hinzuzufügen, okay. Wenn Sie also einen Navigationspfad möchten, müssen wir in diesem Dürre-QR verwenden. Und dieses Medikament könnte eine seltene, so seltene enthalten. Und darin müssen wir eine Liste hinzufügen Felder. Also bei Kind wird ein neues Listenfeld sein. Warum müssen wir also die Listenansicht verwenden? Weil Lisp uns die Kinder von Widget geben wird. Und innerhalb dieser untergeordneten Elemente des Widgets können wir mehrere Listen hinzufügen, sodass wir einfach anrufen können, okay, das ist also unser Streit und list2 hat eine Eigenschaft namens children of widget. Okay. Denken Sie daran, dass Sie diese Kinder im Budget hinzufügen müssen . Andernfalls werden wir in dieser Liste nicht arbeiten. Okay. Jetzt hier können wir all diese Daten hinzufügen. Wenn wir diese Anwendung ausführen, wir in der Lage sein, in der Bewässerung rot zu sehen, Sie können die Navigation selten sehen, aber diese limbische mittlere Listenansicht ist nicht leer. Okay, jetzt ist es an der Zeit, Daten hinzuzufügen. Was wir also zuerst tun werden, werden wir Hemmung, seltene Heizung und Hintergrundfarbe und Text hinzufügen , und Flattern gab uns ein neues Attribut und nennen es neuen Benutzerkonto-Header. Es wird uns zwei Parameter geben. Einer ist der Kontoname und ein anderer ist die Konto-E-Mail. Fügen Sie ihnen also ein Dummy-Symbol hinzu. Es ist also offensichtlich, dass es ein Text sein wird. Also neuer Text und wir können es Code nennen mit warum siehst du warum DC? Und für E-Mails wird es Text sein. Und füge Text hinzu. Sie können es weiß nennen und einfach eine Dummy-E-Mail mit der Rate gmail.com hinzufügen . Okay? Wenn wir es jetzt wieder hinzufügen möchten , sehen Sie, wenn Sie diese Anwendung ausführen, standardmäßig eine blaue Farbe und Sie können unseren Text und unsere E-Mail sehen. Nun, wenn du diese Farbe ändern willst und wie können wir das dann machen? Sie können einfach Dekoration hinzufügen. Und diese Deklaration hat eine Schachteldekoration. Wusste, dass diese Deklaration ein Boxed-Formelattribut Und in dieser Box Dekoration können Sie diese Farbe und Farbe hinzufügen, wir können Farben wählen. Für diesen können wir lila Farbe wählen. Wenn Sie jetzt nachladen, können wir sehen, dass sich unsere Farbe geändert hat. Okay, wir haben erfolgreich unsere Navigation zu unserer Heizung und zu Text bearbeitet unsere Navigation zu unserer Heizung und wir ändern die Farbe. Jetzt ist es an der Zeit hinzuzufügen, es ist an der Zeit, eine Liste der verwendeten Elemente hinzuzufügen. Jetzt müssen wir ein neues ListItem hinzufügen. Liste, erzähle uns wenigstens zwei Teile zum Eigentum. Einer trägt den Titel. Und natürlich wird dieser Titel unser Listentitel sein, das heißt eigene Navigation, Artikeltitel, neuer Text. Wir können es hinzufügen. Du kannst es an erster Stelle nennen. Wenn Sie diese Anwendung jetzt ausführen, können wir einen Text sehen. Hier. Sie können bei Text sehen. Wenn Sie nun ein Symbol hinzufügen möchten, wenn Sie jetzt ein Symbol mit diesem Text hinzufügen möchten , gibt es eine weitere Eigenschaft namens führendes und neues Symbol. Und dieses Symbol hat Icons-Eigenschaft ist für Icons. Wir können ein zufälliges Symbol wählen. Und wenn Sie diese Symbolfarbe ändern möchten, können Sie jetzt, wenn Sie es gesehen haben, wenn Sie es gesehen haben, das Symbol sehen, aber wenn Sie diese Symbolfarbe ändern möchten , wie können Sie das tun? Sie können einfach Farbe hinzufügen. Und Farbe werden Farben sein. Dunkle, lila Farbe. Sie können jedes Auto wählen, was auch immer Sie wollen. Du kannst diese Farbe sehen. Jetzt. Wenn Sie ein Symbol auf der rechten Seite hinzufügen möchten , wie können Sie das dann tun? Es gibt eine andere Eigenschaft namens trailing. Wenn Sie es also ändern, was zu einem Trailing führt, können Sie dieses Symbol auf der rechten Seite sehen. Okay? Was sagt mir also, wenn Sie „Trailing“ auswählen, wird eines der beiden Symbole die rechte Seite hinzugefügt. Und wenn Sie, wenn Sie einen führenden auswählen, fügen wir Ihr Symbol auf der linken Seite hinzu. Okay? Also werden wir vorerst dieses Symbol auf der linken Seite wählen. Tun Sie eine Sache mit ein paar weiteren, ein paar weiteren Gegenständen. Also neuer Stil. Der Titel wird ein neuer Text sein und wir können ihn als zweiten Platz bezeichnen. Und führen wird eine neue Ikone sein. Icon-Speicher. Oder Sie können Quelle wählen und diese Farbe ändern. Farbe werden Farben sein. Sie können rotes X in der Farbe wählen. Bei einem anderen ListItem. Titel auflisten. Der Titel wird ein neuer Text sein. Und wir können es so nennen, dass es sich lohnt. Beim Führen. Dieser wird eine Ikone sein. Also neues Icon, Icon hat icons-Eigenschaft. Also Symbole, Punkt. Wir können ein zufälliges Symbol auswählen und Farbe hinzufügen. Und Farbe wird farbig und dunkel sein. Farbe Orange. Bei einem anderen Listenstil, Neuheitstitel. Der Titel wird ein neuer Text sein. Und dieser wird im Fußtempo sein. Und führen wird eine neue Ikone sein. Icon wird Icon Store sein. Wir können dieses Menü wählen. Symbol und Farbe werden Farben sein. Gelbe Farbe. Nun, wenn ich diese Anwendung starte, werden wir, wir sehen für das Symbol, ich denke, wir müssen dieses Gelb in Grün ändern , weil wir hier im Hintergrund weißen Hintergrund sehen können . Jetzt müssen wir einen neuen Teiler an einem Teiler hinzufügen. Wenn ich das ausführe, werden wir sehen, eine Trennwand, aber du brauchst zwei verschiedene Höhen und Farben. Die Höhe wird 10 sein. Und Farbe, Sie können Farben wählen. Schwarz und haarig. Du kannst diese Farbe sehen. Hier seht ihr diesen Teiler. Okay? Und danach können Sie einen weiteren aufgelisteten Titel im neuen Stil hinzufügen. Und dieser Titel wird unsere neuen Texte sein und schließen. Okay, jetzt müssen wir für dieses Symbol hinzufügen, für diesen Stil müssen wir ein nachgestelltes Symbol hinzufügen. Wir werden nur das Symbol chillen. Neues Icon. Icon wird Icons sein. Wir können das Schließen-Symbol wählen und die Farbe in Farbe ändern. Farbe, Stärke, rote Farbe und führe es aus. Jetzt können Sie sehen, dass wir das Tacos Blue Design haben. Aber wenn ich auf dieses Schließen-Symbol klicke, sollte dieser Navy-Anbieter schließen , aber es funktioniert gerade nicht. Wenn Sie dies also schließen möchten, wenn Sie diesen Mutationspfad ausblenden möchten, wenn der Benutzer auf eines dieser Symbole klickt, sind dies die Schließen-Schaltfläche, das Schließen-Symbol oder das Offenlegen von Text. Was wir dann tun müssen, können wir einfach auf ihr Grundstück, ihr auf Band Eigentum, hinzufügen . Und hier drin können wir unsere inneren geschweiften Klammern passieren. Wir müssen einen Navigator hinzufügen, der als Kontext und Punkt-Pop betrachtet wird. Wenn du diese Codezeile schreibst, dann wenn ich das ausführe. Und wenn ich auf dieses Symbol klicke, kannst du jetzt sehen, wie es zusammenbricht. Okay? Ich kann es anklicken, zusammenbrechen. Sie es erneut aus, reduzieren Sie es erneut und klicken Sie auf acht Farben. Es funktioniert. Also müssen wir das für ihr Grundstück verwenden, sie und wenn du etwas unternehmen willst. Wenn Sie also diese Räumung schließen möchten, bei der Sie nur einen Navigatorpunkt von Kontexten hinzufügen müssen, dot pop. Also lass es mich noch einmal erklären. Also, wenn Sie hinzufügen möchten, also zuerst, wenn Sie die Navigation selten in Ihrer Anwendung hinzufügen möchten, so schnell, was Sie tun müssen, müssen Sie dieses Schlüsselwort verwenden, okay, in Ordnung. Dieser arzneimittelgeheilte Behälter trockene Luft , die vom Flutter-Team bereitgestellt wird. Und fügen Sie diese Dürre ein, wir müssen eine Listenansicht hinzufügen und wir haben einfach hinzugefügt, um ein Kind und Listen zu bearbeiten. Und diese Listen haben Kinder, von denen in der Eigenschaft, so dass wir installieren können, diese Kinder einfügen können. Wir haben ein neues Benutzersymbol hinzugefügt. Wir sind auf dem Weg. Warum benutzen wir diesen? Wir verwenden diesen, weil wir einen Navigationsheader hinzugefügt haben , der von flutter bereitgestellt wird. Wir brauchen und wenn Sie es importieren, werden wir den Parameter für diesen Symbolnamen beibehalten , und einer ist E-Mail. Also hallt sie ein Text wider. Wir haben einen Text hinzugefügt und wenn wir diese Hintergrundfarbe ändern, müssen Sie lediglich eine Dekoration hinzufügen und diese Farbe ändern. Wenn Sie nun eine Liste von Elementen innerhalb von Univision rare hinzufügen möchten Elementen innerhalb von Univision rare , müssen Sie den Listentitel verwenden. Es gibt noch einige andere Dinge, die Sie auch als Tintenfass auswählen können, aber im Moment verwenden wir diese Liste. Diese Liste wird uns etwas Eigentum geben und eine davon ist Titel und verschärft ist ein Text. Also haben wir neuen Text hinzugefügt und bearbeitet, er nimmt sie und dieser Text befindet sich in diesem Textnamen. Und wenn Sie ein Symbol mit diesem Titel hinzufügen möchten, dass Sie diese führende Eigenschaft auswählen müssen, müssen Sie dieses neue Symbol verwenden. Und Sie müssen diese Icons Dot Cake wählen, und wir ändern die Farbe. Wenn du ein Trailing auswählst, dann wirst du es tun, dann fügen wir dein Symbol auf der rechten Seite hinzu. Wir haben für unsere, für unsere Kleidungsoption ausgewählt . Okay. Wenn Sie diese Anwendung nun schließen möchten, schließen Sie diesen Navigationstrockner. Wenn der Benutzer diese Elemente platziert , müssen Sie einfach eine Eigenschaft hinzufügen und erben. Wir müssen diesen Navigatorpunkt der Kontexte dot path hinzufügen. Okay, wir haben unseren gezogenen Navigations-Teil erfolgreich abgeschlossen. Wir können also hier in ihrem Center einen Kommentar zu diesem Teil abgeben. In unserem nächsten Teil verbinden wir unsere Firebase-Datenbank und beginnen dann mit Arbeit für den Rest des Teils. Okay, wir sehen uns im nächsten Kurs. Der nächste Teil. Danke. 4. Verbinde dich mit FiRestore: Hallo Leute, willkommen wieder, in unserem vorherigen Tutorial haben wir unsere Navigation und unsere App erfolgreich gestaltet. Aber jetzt in diesem Teil verbinden wir unsere Anwendung mit unserer Firebase-Datenbank und beginnen dann mit der Arbeit. Gehen Sie also zu diesen Feuerwehrleuten und erstellen Sie ein neues Projekt. Jetzt können wir es nennen, wir können es einfach Low Cap nennen. Okay? Jetzt müssen wir dieses Projekt zur Erstellung von Bedingungen akzeptieren . Und Sie werden einige Zeit brauchen , um diesen Vorgang abzuschließen. Okay, jetzt können wir es fortsetzen. Jetzt. Im Moment arbeiten wir für Android, sodass wir auf Android klicken können und überall dort, wo wir unseren Paketnamen hinzufügen müssen. Also wie bekommst du deinen Paketnamen. Gehen Sie also zu dieser Gradle-Datei mit mittlerem Knoten hier. Und hier sehen Sie, Sie sehen die Antragsnummer und das ist Ihr Pakistan. Also kopiere diesen und füge ihn hier ein. Und wir können einen Spitznamen für diesen hinzufügen, entwickeln und verwenden die optionalen Lungen entwickeln und verwenden, sodass wir sie nicht hinzufügen müssen. Jetzt können wir es wirklich studieren. Also müssen wir diesen Google-Dienst Jason herunterladen. Jetzt im Ordner anzeigen. Jetzt können wir es schneiden und zu Ihrer Anwendung und in Ihrem Android und in Ihrem Android gehen . Und ich werde diese Android-App setzen. Und du musst es hier einfügen. Einfügen. Und das ist unsere Google-Seite mit Jason. Klicken Sie nun auf die Schaltfläche Weiter und wir müssen diesen Klassenpfad kopieren. Also kopiere diesen Klassenpfad und gehe zu diesem Aufbau Gradle und füge ihn hier ein. Sie müssen Ihr Build-Up-Gradle öffnen, dann müssen Sie diese Klasse einfügen. Aber nach diesem Klassenpfad müssen wir diese Plugin-Bibliothek kopieren. Also kopiere diesen. Und jetzt öffne deinen Build Goodwill , der sich in diesem Apps-Verzeichnis befindet. Und am Ende dieser Abhängigkeit müssen wir sie einfügen. Okay, jetzt sind wir alle fertig. Jetzt weiter, und wir können diesen Schritt überspringen. Okay, das ist jetzt unser Dashboard und erben kann die Datenbank sehen. Klicken Sie also auf diese Datenbank. Und hier sehen wir unseren Cloud Firestore und unsere Tordeal TEM-Datenbank. Im Moment arbeiten wir für den Cloud Firestore und wir werden wie im Testmodus arbeiten , damit LR ihn liest und schreibt und aktiviert. Ich denke, jetzt sind wir alle bereit zu gehen. Es wird einige Zeit dauern, uns den Dashpot zu zeigen. Jetzt können wir unser Dashboard hier sehen. Wir werden unsere ältesten Daten hinzufügen. Gerade jetzt in dieses Projektverzeichnis verschoben. Jetzt müssen wir unsere Cloud Firestore Bibliothek hinzufügen. Also müssen wir Ihre Becken pic dot YML-Datei öffnen. Und dies ist die Datei, in der Sie die gesamte Abhängigkeit und den zusätzlichen Pick einer Bibliothek hinzufügen müssen die gesamte Abhängigkeit und den zusätzlichen Pick einer Bibliothek hinzufügen , die Sie bei der Replikation verwenden möchten. Nachdem diese Abhängigkeiten SDK, das Cappuccino-Symbol, flattern, müssen wir unsere Cloud-Firestore-Abhängigkeiten, Cloud Firestone, verwenden . Sie können es einfach googeln und Sie erhalten all diese Abhängigkeitsabhängigkeiten. Wenn Sie jedoch die Cloud Firestore Cloud verwenden, funktioniert es für die Update-Version von Cloud Firestore. Und wenn Sie eine exakte Version wie diese, 10.1.2, verteidigen möchten , können Sie sie einfach von der Firestore Way Site kopieren. Okay. Also werden wir jetzt für Cloud Firestore arbeiten. Jetzt. Kehren Sie zur Startseite zurück. Jetzt. Es zeigt uns eine Nachricht , dass Armut bearbeitet wurde. Also müssen wir dieses Paket holen. Gehen Sie also zu diesen Tools und flattern und erben Sie die Einheit, um sie zu verwenden, klicken Sie auf diese flacheren Pakete. Sie müssen auf diese Flutter-Pakete klicken. Und mal sehen, ob es funktioniert. Hier. Sie können sehen, dass der Prozess mit dem Exit-Code 0 abgeschlossen wurde. Das bedeutet, dass es keine Gebärmutter gibt, also sind wir jetzt bereit zu gehen Wenn wir das ausführen können, können wir hoffentlich sehen, dass wir vielleicht zufälligen Text in unsere Anwendung aufgenommen haben. Wir können es einfach bearbeiten. Wir können nicht nachladen. Okay, jetzt müssen wir einige Pakete für unseren Firestore, Cloud Firestore, importieren . Und wir müssen noch ein Paket verwenden, importieren, synchronisieren, asynchron, dunkel. All die Pakete, die wir für Azure benötigen. Ich denke, das war's für diesen Teil. Im nächsten Teil beginnen wir mit der Implementierung unseres restlichen Teams. Danke. 5. Firestore: Hallo Leute, willkommen zurück , NRP erster Teil, wir haben unsere Anwendung erfolgreich mit unserer Firebase-Datenbank Firebase Cloud Firestore verbunden . In diesem Teil müssen wir nun mit der Implementierung unserer Cloud Firestore-Funktionalität beginnen . Okay? Hier sehen Sie also, wir haben drei wichtige zu verpacken. Einer ist Cloud Firestore und einer ist acing dot, dot. Okay, jetzt hier drin ist, dass diese homotropen Klassen, die wir importieren müssen, einige eingebaute Funktionen für die Verwendung von Firestore sind. Das erste ist ein extremes Abonnement. Wir müssen das Stream-Abonnement importieren. Streamen. Wir müssen Tim benutzen. Und ich denke, wir müssen einen anderen Namen importieren , der Punkt ist. Das asynchron. Wir müssen diese Daten async Jahrzehnte importieren, damit wir ein Steam-Abonnement, das Hurricanes Eastern Abonnement, nutzen können . Und das ist Tim-Abonnement hat einige Eigenschaften und Sie können einen Abfrage-Snapshot sehen. Also müssen wir einen Abfrage-Snapshot verwenden, okay? Und wir können es Abonnement nennen, okay? In Ordnung. Jetzt müssen wir unsere importieren, ohne eine Liste, Liste oder Artikelliste hinzufügen zu müssen. Und diese Liste von Gegenständen wird einen dokumentierten Schnappschuss bestehen. Wir können also einen Schnappschuss hinzufügen. Okay, jetzt müssen wir Sammlungen hinzufügen. Was wir hier gemacht haben, wir müssen ein Eastern-Abonnement hinzufügen, und das Abonnement hat nur einen Abfrage-Snapshot. Und wir haben eine Instanz für dieses Eastern-Abonnement erstellt . Und wir müssen eine Liste von Gegenständen hinzufügen. In dieser Artikelliste wird der Schnappschuss übergeben und dokumentiert und wir fügen den Namen unserer Artikelliste hinzu. Jetzt müssen wir eine Sammlungsreferenz hinzufügen. Referenz zur Sammlung. Okay, das ist auch mit Flutter versehen und es gibt eine schnellere Funktionalität für Viren und die Verbindungsreferenz ist ein Aufruf der Firestore-Instanz. Wir müssen diese Sammlung verwenden und sie ist es, und sie wird nach unserem Sammlungsteil fragen. Wir können es Post nennen. Denken Sie daran, dass wir denselben Namen in unserem Cloud Firestore verwenden müssen . Okay, was wir hier gemacht haben, wir haben eine Sammlung von Referenzen hinzugefügt. Und Sammlungsreferenz hat eine Sammlung von Referenzen. Und wir müssen dieser Firestore-Punkt-Instanz diese Sammlung übergeben dieser Firestore-Punkt-Instanz diese und das ist Post. Okay? Wir müssen also eine Kollisionsreferenz hinzufügen. Wir müssen eine Instanz dieser Sammlungsreferenz erstellen . Dann müssen wir diese Firestore Punktinstanz-Punktsammlung verwenden . Und dieser Sammlungsname ist unsere Sammlung, die wir in unsere Datenbank aufnehmen werden. Okay? Also müssen wir jetzt unseren Darm importieren. Also brauchst du Nachlass. Und innerhalb dieses Init-Status können wir unser Abonnement hinzufügen, was wir tun können. Unsere Substitution entspricht Sammlungsreferenz, Punkt, Schnappschüsse, Punkt hören. Und hier müssen wir nach unseren Datenschnappschüssen fragen , einfach sofort. Wir können es Daten-Snapshot nennen. Und innerhalb dieser geschweiften Klammern müssen wir die set state method hinzufügen, damit wir handeln können. Wir können dieses Dokument nur Q1 verwenden, also können wir loslegen. Wir haben also erfolgreich all diese Felder hinzugefügt, oder? Okay, lass es mich nochmal erklären. Wenn Sie also Daten aus Firestore abrufen möchten , müssen wir verwenden, es gibt einige andere Eigenschaften, eine andere Technik, aber wir verwenden diese Eigenschaft. Wir müssen also schnell sein, um dieses extreme Abonnement nutzen zu müssen . Es wird also unser älterer Abfrage-Snapshot erhalten. Und wir haben ein m dieser östlichen Substitution als Ersatz hinzugefügt . Dann haben wir eine Liste erstellt und sie hat einen Dokument-Schnappschuss. Und wir haben in ihnen nicht nur diese Kollisionsreferenz geschaffen , was funktionieren wird, diese Sammlung referenziert, diese Sammlungsreferenz. Wir werden eine Datenbank in unserem Cloud Firestore erstellen und alle Daten erhalten und auf alle Feeds aus dieser Post-Sammlung zugreifen können . Also erstellen wir eine Sammlung und der Name der Sammlung ist post. Also müssen wir diese Sammlungsreferenz verwenden , Sammlungsreferenz, dann Firestore-Instanz, dass Cholesterin hier drin ist, wir müssen unseren Sammlungsnamen verwenden. Okay, unser Sammlungsname ist post. Jetzt müssen wir einen Test hinzufügen. Und innerhalb dieses Init-Status müssen wir unser Abonnement mit unserem Sammlungsunterschied verbinden . Diese Ersetzung entspricht also zumindest diesem Sammlungsreferenz-Punktsnapshot. Und wir müssen zuhören, abonnieren und unsere Sammlung von Freunden und wir haben einen Datenschnappschuss hinzugefügt. Dieser Schnappschuss entspricht. Jetzt müssen wir zufrieden sein. Jetzt müssen wir den Snapshot verwenden, und das ist die Momentaufnahme unserer Dokumente. Der Snapshot entspricht unserem Daten-Snapshot, den wir hier im DOD-Dokument erstellt haben. Und wir speichern all diese Daten, all diese Daten, die in dieser Sammlung enthalten werden, innerhalb des Schnappschusses. Und hier sehen Sie Snapshot, zwei, Snapshot-Dokument. Jetzt müssen wir anfangen, für unser Körperteil zu arbeiten. Das ist also unser Navigations-Schubladen-Teil. Also ich denke, das war's für diesen Teil. Wir können mit unserem nächsten Teil fortfahren. Danke. 6. Get von Firestore abrufen: Hallo Leute, willkommen wieder zurück. In diesem Teil werden wir uns für unsere Daten aus unserem Cloud-Firestore zurückziehen . Okay, in unserem vorherigen Teil haben wir all diese Funktionen hinzugefügt, wie Eastern Index gezeigt und einige andere Dinge. Und in diesem Teil müssen wir anfangen, an unserem Körperteil zu arbeiten. Nach dieser Ganzzahl müssen wir also unser body-Tag body hinzufügen, und wir müssen mittags am ListView-Build arbeiten. Lass uns bauen. Diese Liste listet die Ansicht auf, dass der Punkt-Builder diesen kleinen Q-Dot-Builder Eigentum hat. Eine ist die Anzahl der Artikel und die andere ist der Artikelaufbau. Anzahl Artikel. Für die Artikelanzahl müssen wir unsere Schnappschusspunktlänge hinzufügen. Okay? Dieser Snapshot ist also unser Festplatten-Snapshot, den wir mit unserer Liste und unserem Dokument-Snapshot hinzugefügt haben . Hier sehen Sie eine Momentaufnahme, Momentaufnahme der Tür zum Dokument. Das heißt, wir wollen das ganze Land der Daten, die in dieser Sammlung enthalten sein werden, und wir werden all diese Daten dort abrufen. Wir müssen also die Länge des Schnappschusspunkts hinzufügen. Jetzt hat dieser Item-Anbieter-Atom-Builder zwei Parameter, die wir übergeben müssen. Einer ist Kontext und der zweite ist für unsere Indexposition. Okay? In Ordnung. Jetzt in diesem Item Builder, jetzt Index für ItemBuilder-Kontexte. Jetzt müssen wir unsere behalten, weshalb wir unsere Daten festlegen möchten. Okay? Also werde ich einige wenige geschriebene Karten zurückgeben. Wir können es neue Karte nennen, okay? Und wir müssen die Höhe hinzufügen. Die Kartellisierung wird zehnmal 0 sein. Und wir müssen hinzufügen, wir müssen Marge hinzufügen. Wir können als Inset alle 10 und bei einem Kind wählen. Und wir müssen einen Container definieren. Und in diesem Container werden wir all diese Daten hinzufügen. Container hat ein Kind und muss schnell Ihre Rolle definieren. Okay? Also neue Reihe. Row hat eine untergeordnete Eigenschaft des Widgets, okay? Und hier müssen wir unsere kreisförmigen Avatare hinzufügen. Neuer kreisförmiger Avatar, beliebig setzen hat ein Kind wird neuer Text sein. Und hier müssen wir unsere Daten so setzen, dass unsere Momentaufnahme ist. Und wir werden all diese Daten nach Indexposition erhalten. Diese Indexbedingung ist nicht diese Indexposition? Dieser Datenwürfel. Hier drin. Wir fügen unseren Filternamen und Titel hinzu. Okay? Also wird dieser Titel hinzugefügt, wir müssen in unserem Sammlungshals hinzufügen, okay, anstelle der Firebase-Datenbank, okay, jetzt müssen wir für einen kreisförmigen Avatar eine Position hinzufügen, deren Positionsdaten wir wollen innerhalb des Kreisdurchmessers hinzufügen. Also dafür möchte ich eine 0-Position hinzufügen, okay? Das heißt, es wird uns den ersten Brief geben, okay? Und wir müssen einen weiteren Text zu einem anderen Text hinzufügen. Also wird neuer Text sein, wir können es nennen. Für Text. Wir können hinzufügen, wir können einen Container hinzufügen, einen Container für erwachsene Kinder, von dem es Kind erneuern wird. Und hier müssen wir eine Spalte hinzufügen. Und Spalte hat eine untergeordnete Eigenschaft der Widget-Eigenschaft. Also Kinder entgegengesetztes Eigentum. Warum ich diese Spalte hinzufüge, werde ich hinzufügen, weil ich einen Titel und einen Inhalt hinzufügen werde, damit wir sie dort vertikal hinzufügen können. Also müssen wir die Spalte benutzen, okay? Also müssen wir zuerst hinzufügen, es braucht neuen Text. Und dieser Text ist, wir werden eine Momentaufnahme von Positionspunktdaten sein. Und wir müssen ihren Feldnamen, Titel, weitergeben. Okay? Und wir müssen einen weiteren Text hinzufügen. Der neue Text wird nach Positionsindex-Punktdaten aufgenommen. Und wenn man es irgendwie m nennt, ist der Feldname Inhalt. Okay? Wir müssen unsere Datenbankdaten nicht hinzufügen. Gehen Sie also zu Ihrem Cloud Firestore , wo wir einen Sammlungsnamen hinzufügen müssen. Unser Sammlungsname ist also post. Denken Sie daran, dass Sie genau denselben Namen hinzufügen müssen. Wenn Sie hinzufügen, wenn Sie einen kleinen Buchstaben oder Großbuchstaben hinzufügen, funktioniert es nicht. Also poste das ist unser Sammlungsname und wir brauchen bis zur Nacht Hannover ID. Und es wird uns eine zufällige ID geben. Wenn Sie möchten, können Sie auch Ihre eigene ID wählen. Unser erster Feldname ist also Titel, den Sie anzeigen möchten. Also kopiere diesen Titel und füge in diesem Feld Titel und Wert hinzu, wir können es Flutter nennen. Flattern. Und der zweite ist unser Inhalt. Und wir können editieren. Und wir können es nennen. Wir lernen Flattern. Okay? Jetzt. Wenn ich diese Anwendung jetzt starte, können wir hoffentlich Daten sehen. Also los geht's. Hier siehst du also unseren kreisförmigen Avatar, unseren Titel und unseren Inhalt, aber er sieht nicht gut aus. Also müssen wir es entwerfen. Wir können also diese f in diesem Kreis-Avatar sehen f in diesem Kreis-Avatar , weil wir Position 0 hinzugefügt haben. Okay? Also müssen wir diese Farbe dieses kreisförmigen Amateurs ändern. Okay, und davor, in diesem Container, hat dieser Container all diese Daten hier drin. Wir können etwas Padding hinzufügen. Polsterung als Einsatz alle 10. Okay? Für den kreisförmigen Avatar müssen wir nun diesen Farbnamen ändern, damit wir eine Hintergrundfarbe auswählen können. So ist es nicht. Wir müssen es außerhalb des Kindes hinzufügen. Okay. Denn das ist die Eigenschaft von Sarkomermaterie. Die Hintergrundfarbe wird also farbig sein. Farben dachten, wir können wählen. Wir können Radix und Farbe wählen, okay, und für die Vordergrundfarbe bedeutet das, dass die Textfarbe Farben sein wird. Farben Punkt weiß. Okay, wenn wir jetzt heiß nachladen, sehen wir unsere Farbe Weiß und unsere kreisförmige Avatar-Hintergrundfarbe ist roter Akzent, und wir können auch etwas Padding sehen. Okay, jetzt müssen wir hinzufügen, wir müssen einen Raum schaffen und den Geschmack studieren. Das ist also unsere Hauptzeile, und innerhalb dieser Zeile haben wir all diese drei Daten hinzugefügt. Okay, also müssen wir hier den Hauptausgang hinzufügen. Weil x ein Element ist. Ich werde cross x ist Element oder eine Statistik, damit es von links beginnen kann . Funktioniert nicht. Ich denke du meinst x ist Element, wird Main und dann Main Dot sein. Okay? Jetzt haben wir einen Container. Für diese beiden Container müssen wir viele Xs-Elemente hinzufügen und men x ist ein Element oder ein Anfang. Das ist unser Hauptcontainer. Für diese Spalte müssen wir verwenden, denke ich, dass Cross X sogar gemeint ist und führe es aus. Und wir können sehen, dass es im östlichen Teil begann , aber wir müssen etwas Rand und Abstand für diesen Container hinzufügen und den kreisförmigen Avatar aktualisieren. Wir können eine Box in neuer Größe hinzufügen. Und warum wir den Größenblock verwenden entscheidet, dass Bücher uns etwas Platz bieten. Wir können also Weiß hinzufügen, wir können zehn Punkte hinzufügen, 0, und es gibt uns Platz von der linken Seite. Jetzt können wir diesen Raum sehen. Okay, perfekt. Jetzt denke ich, dass es gut aussieht, aber es ist trotzdem so, du musst etwas ändern. Wir müssen also einige Daten ändern, wie für unser Flattern, für unseren Titel müssen wir unsere Farbe und unsere Textfarbe ändern . Okay, das ist also unser Titeltext. Und hier müssen wir einen Stil hinzufügen. Stil wird Textstil sein. Wir können die Schriftgröße ändern, wir können 22 auswählen und wir müssen die Farbe wählen. Du kannst wählen. Farbe wird Knorpelfackel sein. Sie können eine grüne Farbe wählen. Nur zum Beispiel. Jetzt zu heiß nachladen. Jetzt können wir sehen, dass es gut aussieht. Okay? Jetzt müssen wir ein Leerzeichen zwischen diesen beiden Schwänzen hinzufügen. Also füge Neu hinzu. Wir können auch eine neue Größe sowie eine neue Porengröße wählen. Diesmal müssen wir die Höhe wählen, weil wir aus der Höhe ausdrücken müssen. Wir verwenden 5 und führen es aus. Und wir können etwas Platz sehen, okay? Jetzt müssen wir es, wenn du willst, ich denke für diesen ist das okay. Okay. Lass uns eine Sache machen. Lassen Sie uns eine Sache tun. Wir müssen die Höhe und Einheit definieren. Wir können die maximale Zeile dieses Textes definieren. Für diesen Text möchte ich diese maximale Zeile eins zeigen , da wir nur eine Titelzeile zeigen werden. Und für diesen Text müssen wir für diesen Test kein Design hinzufügen und wir können diese maximale Zeile ändern , um zu bewirken, dass wir mehrere Daten hinzufügen. Wenn wir diese maximale Linie nicht auswählen , erhalten wir all diese Daten, dann sieht sie sehr schlecht aus. Okay, was können wir jetzt tun, wenn wir das ausführen? Wir werden keine Chance sehen können da wir nur einen Beitrag haben. Und jetzt können wir, was können wir tun? Und wir müssen auch das Weiß dieses Containers definieren. Weil wir in diesem Container diese beiden Daten haben. Einer ist unser Titel und einer ist unser Inhalt. Also müssen wir die Höhe definieren, um das Weiß zu definieren. Also können wir wählen, wir können wählen. 210 und glänze es. Okay, jetzt ist es an der Zeit, mehrere Artikel hinzuzufügen. Okay, ich habe also eine Scheinnachricht. Also ein Dummy nach Steuern, ich werde es jetzt hier hinzufügen. Das ist also unsere Postsammlung und erbt. Wir müssen unsere ältesten Sammlungsdaten hinzufügen. Also bei neuem Dokument und wir müssen eine zufällige ID generieren. Und hier müssen wir unseren Feldnamen hinzufügen, das ist unser Titel. Und für die Rechtswertdaten hier können wir diesen Titel verwenden. Wir können es einfügen und müssen ein weiteres Feld hinzufügen, das Inhalt haben wird. Inhalt und Inhalation müssen eine Delta-Loop verwenden und wir können diesen Gesamtwert und Titelinhalt auswählen und speichern. Wenn ich jetzt diese Anwendung öffne, werden wir unsere Daten sehen. Was ist, was hat es einige gelernt und diese Dummy-Daten. Und hier können Sie sehen , dass wir für unseren Inhalt die maximale Zeile dorthin ausgewählt haben, sodass wir zwei Zeilen sehen können, aber in unserem realen Inhalt gibt es viele Daten. Dafür müssen wir also unsere verwenden, wenn ich die maximale Zeile fünf auswähle und wenn ich diese Anwendung starte, dann sehen Sie fünf Line-Up-Daten. Schauen wir uns 12345 an. Also dafür, oder Sie können maximal Zeile zwei wählen. Und es wird perfekt funktionieren, okay? Und wir haben das Weiß definiert , weil wir diesen weißen Zahn zehn zeigen müssen . Wenn du willst, kannst du das weiß machen. Fügen Sie jetzt noch ein paar Texte hinzu und Sie können das in Echtzeit sehen. Das bedeutet, dass wir es nicht immer wieder ausführen müssen . Unsere Replikation wird automatisch aktualisiert. Für diese zweiten Daten können Sie unser w-Wort in unserem Kreis Lavater sehen, denn für diesen Titel befindet sich W an der Position 0, die wir hier ausgewählt haben. Wenn ich eine auswähle, fügt sie die zweite Position und sie zählt als Array-Wiederholung. Jetzt können wir in LA schneller sehen , das wissen wir alle. Die erste hat die Position 0 und die zweite ist eine. Also haben wir eins ausgewählt und R eine Position ist ich drin. Sie können also rutschen, wir können sehen, und in diesem Teil haben wir seine Position gesehen, das ist unsere einzige Position und wir können diese Tage sehen, okay? In Ordnung, für unsere Anwendung können wir sehen, dass wir für diese Anwendung einige weitere Artikel hinzufügen müssen. Das Feld wird also Titel sein. Und der Wert ist, dass wir einige Post-Inhalte hinzufügen und kopieren und speichern können einige Post-Inhalte . Wenn ich jetzt R öffne, siehst du j. Okay? Okay, ich glaube wir haben vergessen es zu starten. Und Genesis 2120 und führe es aus. Okay, dann werden wir loci sehen, okay, füge mehr Text hinzu oder di, di, di tail. Wert wird dieser sein. Kontinuierlich zufrieden sein wird dieser Inhalt sein. Füge noch ein paar ungerade IDs hinzu. Titel. Wert werden nur einige Daten sein. Und füge noch ein Feld hinzu. Inhalt. Und pelo wird diese ganzen Daten sein. Und Sie können fünf Beiträge 1234581 mehr sehen. Dieser wird Titel sein. Und für den Wert können wir diesen wählen. Und zufrieden. Inhalt. Wir müssen uns für diesen entscheiden. Wir können uns für diesen entscheiden. Also wo kann ich hinkommen? Und jetzt können wir sehen, jetzt können wir sehen, wir können es einfach nennen und wir können all diese Daten und all diese Felder sehen , die wir erfolgreich entworfen und implementiert haben. Ich denke also, dass es genug für diesen Teil gibt. In unserem nächsten Teil werden wir hinzufügen, wie wir routen können und wie wir es in unseren digitalen Raum einstellen können. Also ich denke, das war's für diesen Teil. Danke. 7. Details Seitenfunktion für jeden Beitrag: Hallo Leute, willkommen wieder zurück. In diesem Teil werden wir ein neues Tempo schaffen und unsere Daten an ein neues Tempo senden. Wenn also ein Benutzer auf eines dieser Elemente, eines dieser Symbole, klickt und Sie das Datenelement haben, wird er es umleiten. Dann leiten wir sie in einen digitalen Raum um , in dem sie einen detaillierten Beitrag lesen können. Okay, was können wir tun, um das zu tun? Zuerst müssen wir eine neue Datei, einen neuen Punktdatei-Lib-Ordner und eine neue Datei erstellen. Und wir können es hier Details posten nennen. Was müssen wir zuerst bei ihr tun, wir müssen unser Material importieren, Dart-Importmaterial. Okay. Jetzt müssen wir unseren Firestore importieren. Wir müssen unseren Cloud Firestore importieren. Okay? Und jetzt müssen wir unser Stateful-Widget definieren. Erstellen Sie also ein statusbehaftetes Legit und wir können es als Post-Details bezeichnen. Okay? Okay, jetzt geh auf diese Homepage. Und hier müssen wir etwas ändern. Das ist unser Texttitel. Wenn der Benutzer also auf diesen Titel klickt, können wir ihn auf die nächste Seite verschieben. dies zu tun, was wir hier tun müssen, wer es ändern muss, müssen wir eine neue Eigenschaft namens inkwell importieren , damit wir tiff hinzufügen können , sonst könnten wir das nicht tun. Normale Texte können wir also nicht anklickbar hinzufügen. Wenn Sie also eine anklickbare Textansicht hinzufügen möchten, müssen wir new in coil verwenden. Wir müssen eine neue Anfrage verwenden. Das ist die andere Eigenschaft, die als Geste bezeichnet wird. Also würde ich gerne dieses Tintenfass verwenden. Und das Tintenfass hat eine Eigenschaft namens child. Und in diesem Kind müssen wir diese Textfelder hinzufügen. Also können wir es hier ausschneiden und einfach hier einfügen. Okay? Also einfach in der Spule bearbeiten. Also einfach in der Spule bearbeiten und Anfrage hat ein Kind und füge das Kind ein. Wir müssen unsere Texte einfügen , die Sie zeigen möchten, einige neue Texte, Momentaufnahmen, Daten, Index und Esther, genauso. Und in der Spule hat eine Eigenschaft aufgerufen. Okay? Und hier müssen wir unsere Daten weitergeben. Bevor wir das tun, was wir tun können, können wir einfach das tun, wir können, wir müssen eine Methode erstellen. Wir müssen eine Methode entwickeln. Und davor in unserem digitalen Raum, müssen wir hier, in unserem digitalen Raum, unsere Dokumente Snapshot erstellen, und wir können es Snapshot nennen. Und wir müssen einen Konstruktor für diese Klasse erstellen. Also poste Details. Wir müssen einen Konstruktor erstellen und wir können diesen Punkt-Snapshot hinzufügen. Also haben wir unseren Konstruktor erstellt, jetzt müssen wir ihn innerhalb unserer Homepage verbinden. Nach diesem Schritt können wir also eine neue Methode erstellen, wir können eine neue Methode erstellen und wir können sie aufrufen . Wir können es nennen. Oder wir können es nennen, wir können eine neue Methode für College-Bus-Daten erstellen . Und als Parameter müssen wir unsere Dokumente nach einem Snapshot fragen und ein Objekt unseres Schnappschusses erstellen. Und hier müssen wir unsere Daten weitergeben. Also bevor wir das importieren müssen, sind diese Post-Detailseiten so wichtig? Wir müssen einen Beitrag hinzufügen. Es fügt Punkt, Punkt, Liter Paketnamen ein. Und jetzt hier drin, wenn es unserem Routing-Navigator mitteilt, ist Punkt davon ein Kontext-Punkt-Push. Und Push hat eine Metallpaste rund. So neu, so neu. Also neue materielle Schädlinge Out. Und hier müssen wir unseren Kontext weitergeben. Und danach müssen wir auf diese Weise unseren Namen nennen, wir müssen unseren Namen für digitale Paste nennen. Der Nachname lautet Post-Details und Incentive-Post-Details. Wir haben einen Konstruktor hinzugefügt, damit wir unsere Daten weitergeben können. Also hier können wir sehen, wir können einen Schnappschuss hinzufügen. Dieser Snapshot ist dieser Snapshot , den wir Parameter für diesen Konstruktor übergeben. Und jetzt müssen wir den Snapshot verwenden, den wir gerade erstellt haben . Wir sind alle fertig. Jetzt bei diesem Semikolon, also was wir hier gemacht haben, haben wir diese Post-Datenmethode erstellt und als Parameter übergeben wir diesen Dokument-Snapshot. Dieser Schnappschuss zum Befestigen von Daten oder zum Verschieben von einem Ort zum anderen. Paste fluttered hat fluttered hat, wir müssen den Navigator Punkt des Kontextes verwenden oder ein neues Material zuerst herausschieben, es wird uns diesen Builder und Builder Container Kontext geben . Und in diesen Kontexten müssen wir unseren detaillierten Ort passieren , an den wir gehen wollen. Und wir haben einen Konstruktor hinzugefügt, und wir müssen diese Daten mit diesem Konstruktor übergeben. Okay, dieser Schnappschuss ich gezeigt habe, ist dieser Schnappschuss , den wir hinzugefügt haben. Okay, jetzt sind wir fertig. Jetzt. Scrollen Sie nach unten und in diesem Behälter und in diesem Tintenfass. Für unseren Listentitel haben wir die Methode on hinzugefügt. Und hier müssen wir unsere Methode jetzt aufrufen , wo wir sie gerade erstellt haben. Und wir haben diese Post-Daten erstellt, und wir müssen unseren Snapshot hier weitergeben. Unser Schnappschuss, Snapshot und Indexpunkt, nicht auf diese Weise. Also schnappt oder punktiert , um dieses Ergebnis zu verwenden. Also Snapshot-Index, also gibt es uns alle Indexdaten. Okay, also bei Tests, und das werden vergangene Daten sein und der Snapshot wird nach Tarif indexiert. Und dieser wird Daten-Snapshot und Index übergeben. Es wird für die Leichtigkeit und für jeden Benutzer. Wenn ich also auf diese vier Nullen und jede eindeutige, eindeutige ID klicke , bekommen wir das. Wir werden diese detaillierten Schädlinge hinter uns bringen. Wir klicken auf dieses Symbol, diesen Titel. Dann gehen wir zu den zweiten Schädlingen über und wir bekommen diese ID. Alle Daten erhalten diesen Titel und diesen Inhalt. Wir verwenden diesen Schnappschuss. Dieser Schnappschuss ist unser Schnappschuss , den wir für unsere Dokumente erstellt haben , die jetzt aufgenommen werden, und als Liste. Und wir haben diese Indexposition von hier aus hinzugefügt, Sie können den Item Builder sehen. Wir haben diese Indexposition hinzugefügt. Wir können diesen Index also sehen. Und hier bekommen wir, dass dies nicht jede eindeutige ID ist, weil wir den Feldnamen definiert haben. Aber hier drin bekommen wir die Position, damit wir sie kriegen können, halt sie hoch. Also ich denke, das war's für diesen Teil. In unserem nächsten Teil werden wir diese Daten in unsere Datenbank aufnehmen. Wenn ich darauf klicke, wenn ich diese Anwendung starte, können wir vielleicht auf den zweiten Platz wechseln. Aber wir können alles sagen. Sie können schwarz sehen, leer kann dazu führen , wer kein Gerüst-Widget und kein Materialdesign hinzugefügt hat. Wir werden es in unserem nächsten Teil machen. Hoffentlich verstehst du es. Ich danke dir sehr. 8. Details Seitendesign zum Anzeigen von Details Post: Hallo Leute, willkommen wieder. In unserem vorherigen Teil haben wir alle erforderlichen Funktionen eingerichtet, um Daten vom Einfügen zum Einfügen zu übertragen . In diesem Teil legen wir jetzt unsere Daten fest. Gehen Sie also zu diesem Post-Detail-Tempo. Und hier haben wir jetzt unsere Dokumente hinzugefügt, kurze Postdetails, jetzt kurze Exit-Falle. Und schnell muss dieser Behälter entfernt werden. Entfernen Sie also diesen Container und fügen Sie ein Gerüst-Widget hinzu. Und hier müssen wir ein Gerüst hinzufügen und einsetzen. Zuerst müssen wir hinzufügen. Also klick M bar wird neu sein. Eine Bar. Ab bar hat einen Titel, dessen Titel neuer Text sein wird. Und wir können es Post-Details nennen. Okay? Und jetzt müssen wir eine Hintergrundfarbe hinzufügen. Die Hintergrundfarbe wird Farben sein. Farben dot. Wir können grüne Farbe wählen. Okay? Okay, jetzt müssen wir unsere Körperteile entwerfen. Wenn ich jetzt diese Anwendung starte und auf einen dieser Titel klicke , können wir unsere Post-Details und unsere obere Farbe sehen . Gehen Sie jetzt zurück, klicken Sie auf Was können wir unsere Daten sehen und wir müssen sie auf unsere RecyclerView setzen, um dies zu tun. Und zwei, jetzt erben wir, müssen wir hinzufügen, jetzt müssen wir hier unsere Körpertexte oder Körpertexte hinzufügen. Damit der Körper geht, können wir unseren Karren und unseren Wagen drehen und wir müssen die Höhe hinzufügen. Wir können 10 wählen und Kind bearbeiten und Samstag, März im März in wird als Inset alle 0.02 sein. Jetzt müssen wir unser Kind hinzufügen. Und hier müssen wir unsere neue Liste hinzufügen. Okay? Also lasst uns gefährdete Kinder machen, von denen es ist, und innerhalb dieser Liste können wir all diese Dinge hinzufügen. Also drinnen, wenn du in dieses Tempo gehst. Wir werden es also in zwei Teilen definieren. Also wird der erste unsere Reihe sein. Innerhalb unserer Zeile fügen wir unseren Kreis-Avatar und dann fügen wir unseren Titel hinzu. Und nach Schulden und dem Rest des Teils wäre unser inhaltlicher Teil. Okay? So schnell. Definiere eine Zeile. Also neue Reihe. Row hat chilenisch von Widget. Okay, kein Problem. Jetzt müssen wir zuerst unseren neuen kreisförmigen Avatar hinzufügen, einige neue kreisförmige Amateurkreisdurchmesser bei einem Kind. Kind wird neuer Text sein. Und jetzt müssen wir unser Widget, unseren Snapshot, unsere Daten hinzufügen . Und wir müssen unser Feldlager bestehen, das eng sein wird. Und für den Sarco-Appetit müssen wir unsere Position posten. Okay? Und jetzt müssen wir eine Hintergrundfarbe für unseren Zyklus oder was auch immer hinzufügen. Die Hintergrundfarbe wird Farben sein. Farben, Dodge, Grün. Und für den Vordergrund wird die Farbe weiß gefärbt sein. Okay? In Ordnung. Jetzt können wir diese Farbe sehen, okay, perfekt. Wenn ich jetzt auf flattern klicke, können wir sehen, was das bedeutet, dass es für jeden einzelnen Artikel gesendet wird . Wir können das sehen. In diesem Fall funktioniert das perfekt, aber wir müssen trotzdem ein Designproblem lösen. Wir werden es in unserem nächsten Teil tun. Ich denke, das war's für diesen Teil. Danke. 9. Daten an Details senden: Hallo Leute, willkommen wieder. In unserem vorherigen Teil haben wir also erfolgreich unser detailliertes Tempo und unseren kreisförmigen Avatar festgelegt . Jetzt müssen wir es entwerfen und wenn Sie Rest der Daten des Terroristen zerreißen, okay, also haben wir diesen kreisförmigen Avatar angewendet, müssen wir unseren Titelrand hinzufügen, neuen Text. Wir müssen neuen Text hinzufügen. Und wie fallen wir hier, wenn wir unser Widget erstellen , Punkt, unseren Schnappschuss. Dieser Schnappschuss, dieser Schnappschuss, dieser Schnappschusspunktdaten. Und hier können wir unsere hinzufügen , um Text-Widget-Snapshot-Punktdaten hinzuzufügen, Punkttitel. In Ordnung. Und je weniger wir unseren Stil hinzufügen müssen. Es wird also Textstil sein. Und die Schriftgröße wird 22 sein und die Farbe wird sein, wir können Farben wählen, dunkle, orange Farbe. Lassen Sie es uns jetzt ausführen. Jetzt können wir hier unseren Artikel sehen. Jetzt können wir unseren Artikel sehen, aber wir müssen immer noch eine gute Chance unternehmen. Okay? Das ist also unsere Kartenansicht und das ist unsere Reihe. Dies ist unser Hauptwerkzeug für diesen kreisförmigen Avatar. Okay, also innerhalb dieser Zeile, dieser Reihe, können wir einen neuen Container hinzufügen. Okay? So können wir es ausschneiden und den Gesang in einem neuen Container bearbeiten , sodass wir ihn hier hinzufügen und einfügen können. Und wenn wir Container hinzufügen, müssen sie nicht hinzufügen. Wir müssen den Chat benutzen. Okay? Kind und rudern und erben. Jetzt müssen wir Bettwäsche hinzufügen. Bettwäsche. Stattdessen können Sie nur 10 wählen, 0. Und jetzt können wir dieses Bettzeug von links und außerhalb des Geländes sehen . Okay? Also können wir eine Sache tun. Wir können einfach, für diesen Container. Wir können unsere beiden Container trennen. Wir können uns mit dem Container verbinden. So schnell ist Kontinent pro Stunde, dieser Seitenkilometer und dieser Titel. Wir können oder wir können es tun, wir können einfach die Höhe dieses Containers definieren. Die Höhe wird sein. Höhe wird sein, kann 120 wählen und weiß definiert. Wir können diese zwei zu 0 machen. Jetzt lauf. Jetzt werden wir sehen, okay, aber die Sache ist, aber das Problem ist, dass wir all diese Daten für diese Karte bekommen. Okay? Ich denke, wir müssen diesen Container und diesen Container nicht benutzen , wir können ihn einfach entfernen. Da verwenden wir Kartenansicht zu erzählen. Sie nutzen den Platz in der Kartenansicht. Damit wir es so modifizieren können , dass der Kreis-Avatar, wir müssen ein Leerzeichen hinzufügen, wenn Sie einen Raum erzählen. Wie können wir das also machen? Bearbeiten Sie also ein neues Größenfeld und weiß, wir können 0 wählen. Wenn ich diese Anwendung starte und diesen Bereich sehen kann, denke ich, dass wir diese orange Farbe in grüne Farbe ändern können . Das wird gut sein. Okay, grüne Farbe und Grün. Was müssen wir danach tun? Danach, was wir tun müssen, müssen wir unseren Hauptinhalt hinzufügen. Okay? Das ist also unser erster Container, und das ist unser erster Container. Und danach müssen wir eine neue Box nur für den Freeway-Raum hinzufügen . Und wir können bei einem neuen Container Höhe 10 hinzufügen. Okay? Zwei neue Behälter und passende werden als Einsatz aller zehn Münzen 0 sein, okay? Und füge ein Kind hinzu. Dieses Kind wird ein neuer Text sein. Und wir können hier unsere Daten hinzufügen, was es dot snapshot. Also Widget, Schnappschussdaten, Widget-Punkt-Schnappschuss, Schnappschussdaten. Und hier müssen wir unsere Inhalte verwenden. Also zufrieden. Okay, jetzt lass es uns ausführen. Hoffentlich funktioniert es. Jetzt können wir hier, hey, also hier sehen Sie alle Daten und wir können einen Abstand zwischen diesen sehen. Also geh zu diesen Flattern. Und wir können sehen, ich denke, zehn dB sind ein riesiger Raum, also können wir 7 wählen und ihn jetzt ausführen. Okay? Ich denke, wir müssen die Textfarbe und Textgröße für diesen Inhalt ändern . Wenn wir das also machen wollen, fügen Sie einfach einen Stil hinzu. Der Stil wird im texanischen Stil sein. Schriftgröße wird ein Team von 18 Personen sein. Lass es uns ausführen. Jetzt. Wir können sehen, jetzt können wir all diese Daten scrollen und wir können das sehen. Wir können diesen Text sehen. Warum benutzen wir e n? Es ist langfristig und wir können unser Materialdesign sehen. Ich hoffe, Sie verstehen diesen ganzen Prozess, wie wir diese Anwendung implementieren, wie wir diese Anwendung entwickeln, und das ist unser Navigationssymbol und all diese Dinge. Ich hoffe, Sie haben gelernt, dass vielen von Ihnen dieser Kurs gefallen hat. Also, danke Leute. Ihr Sitz.