JetPack-navigatiecomponenten in Android

Na bijna een decennium introduceert het Android-team een ​​nieuw navigatiesysteem voor ontwikkelaars

Overzicht

Navigeren tussen schermen is een van de fundamentele dingen in de Android-app. We doen dit meestal via Intents , maar hoe zit het met complexe situaties zoals een navigatielade of navigatie onderaan, waar we het markeringsitem moeten blijven synchroniseren met het huidige scherm om nog maar te zwijgen van het back-stackbeheer – het is complex is het niet?

Navigatiecomponent is de alles-in-één oplossing voor alle problemen voor elk type navigatie in de Android-app . De JetPack-navigatiecomponent is een reeks bibliotheken, tools en richtlijnen die een robuust navigatieframework bieden voor in-app navigatie

De navigatiecomponent biedt een nieuw type navigatie in Android-ontwikkeling, waarbij we een navigatiegrafiek hebben om alle schermen en de navigatie ertussen te zien. Het lijkt veel op storyboards in IOS .

De navigatiecomponent helpt je bij het beheren van navigaties, fragmenttransacties, backstack, animaties, en vooral deeplinking (intentie-filters met deeplinking zijn niet langer nodig) en nog veel meer.

Integratie

Opmerking: als u navigatie met Android Studio wilt gebruiken, moet u Android Studio 3.3 of hoger gebruiken.

Neem het volgende stuk code op in uw build.gradle en u bent klaar om te gaan:

navigatiefragment : Fragment is een veelvoorkomend architectonisch onderdeel dat elke ontwikkelaar gebruikt, dus navigatiefragment is een standaardbibliotheek om te gebruiken voor fragmentnavigatie.

navigation-ui : Dit is handig om u te helpen bij het instellen van de appbar, werkbalk en andere materiaalontwerpcomponentenconfiguratie met Nav Controller.

Terminologie

NavHostFragment

Een lege container waarin bestemmingen uit uw navigatiegrafiek worden weergegeven. De navigatiecomponent bevat een standaard NavHost -implementatie, NavHostFragment , die fragmentbestemmingen weergeeft.

NavController

Een object dat app-navigatie beheert binnen een NavHost . De NavController orkestreert het wisselen van bestemmingsinhoud in de NavHost terwijl gebruikers door uw app bewegen.

Bestemmingen

Bestemmingen zijn niets anders dan alle inhoudsgebieden in uw app, zoals activiteiten, fragmenten, dialoogvensters enzovoort.

Acties

Actie wordt gebruikt om een ​​navigatie te maken met een attribuut genaamd bestemming , waar we de eindscherm-ID kunnen vermelden.

Navigatiegrafiek

Een navigatiegrafiek is een bronbestand met al uw bestemmingen en acties. In feite vertegenwoordigen navigatiegrafieken de navigatie van de app.

Hoe maak je een navigatiegrafiek

Zoals ik al zei, een navigatiegrafiek is niets anders dan een bronbestand, dus we maken een bronbestand onder de directory res met het resourcetype als navigatie. Kijk eens:

Stappen voor het maken van een navigatiegrafiek:

Ik zal je het voorbeeld van de navigatiegrafiek laten zien met een voorbeeldapp van twee fragmenten.

Aangezien elk XML-bronbestand nav_graph ook een ontwerp- en teksttabblad heeft, gaan we nu eens kijken naar de XML-code in het teksttabblad om een ​​grafiek te maken zoals hierboven

Hier is de root-tag navigation met startDestination -attribuut waarin we de id moeten vermelden van het fragment dat in eerste instantie moet worden geladen. Dit wordt gevolgd door bestemmingen, zoals fragmenten, dialoogvensters enzovoort, met een van de attributen naam , waarvan de waarde de naam van uw bestemming is.

Nu komen we bij de navigatie. We gebruiken een tagactie onder een specifieke bestemming – waar we de navigatie willen starten. Er is ook een kenmerk waarin we de bestemmings-ID vermelden.

Laten we alle onderdelen samenvoegen:

Navigatietypes

Om door de navigatiecomponent in de app te navigeren, vertellen we de NavController om ofwel een pad te volgen of een bepaald bestemmings-ID te vermelden. De NavController toont dan de juiste bestemming in de NavHost .

Met de navigatiecomponent hebben we meerdere manieren om te navigeren.

Navigatie met ID

Hier gebruiken we de ID van de bestemming vermeld in nav_graph om de bestemming te bereiken:

Klik luisteraar

Voor weergaven kunt u ook de Navigatie klasse createNavigateOnClickListener () gebruiken. Dit is een handige methode om naar een bestemming te navigeren, zoals hier getoond:

Navigeer met acties

Zoals we de bovenstaande nav_graph hebben, hebben we acties met het enige doel van navigatie, op deze manier kunnen we geavanceerde functies in navigatie gebruiken, zoals animaties.

Veilige argumenten

Safe Args is een Gradle-plug-in die wordt gebruikt om gegevens tussen bestemmingen uit te wisselen.

Integratie

Voeg de volgende code toe aan het Gradle-bestand op het hoogste niveau:

Importeer nu de plug-in in het Gradle-bestand op moduleniveau:

Dat is alles – de safe args-plug-in is actief in uw project.

Safe args helpt u om de argumenten veilig door te geven. Het belangrijkste voordeel van het gebruik van veilige args is dat sommige van de controles die tijdens runtime plaatsvinden, nu tijdens het compileren worden uitgevoerd.

Wat safe args doet, is dat het de code genereert voor de bestemmingen met argumenten die functies hebben. Deze functies hebben parameters die zijn gebaseerd op de argumenten die je hebt genoemd voor de bestemming in de nav_graph.

Navigatie met argumenten

Nu de safe args-plug-in actief is in ons project, laten we eens kijken hoe we deze kunnen gebruiken.

Stap 1

Eerst moeten we de argumenten vermelden die nodig zijn voor de bestemming in nav_graph, zoals hieronder getoond:

Hier hebben we twee argumenten genoemd: typ string en een geheel getal voor fragment twee. Zoals ik al zei, genereren veilige args code voor de bestemmingen met dezelfde naam als de naam van de bronklasse, aangevuld met het trefwoord routebeschrijving. Hier genereert het bijvoorbeeld FragmentOneDirections .

Geef argumenten door vanuit de bron

Nu we weten hoe we argumenten moeten vermelden in nav_graph , is de volgende stap het doorgeven van de argumenten van de bron.

Hier gebruiken we de FragmentOneDirections klasse om de argumenten door te geven. Kijk eens:

Zoals ik al zei, nullable attribuut naar true – geen van de argumenten is verplicht. Als je nullable noemt als false, moet je de niet-null-waarden doorgeven in de constructor. U moet de standaardwaarde vermelden voor nullable-argumenten, anders kan uw app crashen tijdens runtime.

Ontvang de argumenten in de bestemming

Normaal gesproken gebruiken we bundle in activiteiten en argumenten in fragmenten, maar hier gebruiken we de gegenereerde class om die argumenten op te halen:

Als je goed hebt geobserveerd, hebben we de naam als string en ID als een int. Dat komt door het type dat we noemden in de nav_graph voor die argumenten.

DeepLink met navigatiecomponent

We zijn allemaal bekend met het implementeren van deeplinks in onze apps via intentiefilters. Nu is het tijd voor verandering: een navigatiecomponent gebruiken voor deeplinks.

Laten we eerst eens kijken hoe we een deeplink naar een bestemming noemen in nav_graph :

U moet ook de volgende regel in uw manifestbestand implementeren onder de activiteitstag:

Dat is het – deeplink is geïmplementeerd in uw app!

Met de navigatiecomponent kunnen we het fragment of de activiteit oproepen via een deeplink binnen de app:

Verbeteringen voor navigatiecontroller in Google I / O 2019

Er zijn verbeteringen en nieuwe functionaliteiten aangekondigd op Google I / O 2019 – het onderhouden van geneste grafieken, ondersteuning voor weergavemodellen, dynamische module-navigatie en ga zo maar door. Bekijk de onderstaande video als je geïnteresseerd bent:

Handige links

GitHub-voorbeeld

Hieronder staat de link naar de GitHub-repository naar een voorbeeldproject. Alle codefragmenten in dit artikel zijn afkomstig uit die repository, voel je vrij om te klonen en heb plezier:

Indien mogelijk ga ik het tweede deel van dit artikel schrijven, waarin de geavanceerde functies van de navigatiecomponent worden behandeld.

Bedankt voor het lezen.