Untennavigation mit ViewPager in Jetpack Compose.

Verwenden Sie die normale untere Navigation und müssen sich beim Wechseln zwischen Composables um die Ein- und Ausstiegsanimationen kümmern ? Funktionieren die Animationen nicht wie erwartet? Nun, suchen Sie nicht weiter! Dieser Artikel hilft Ihnen genau dabei, wonach Sie suchen.

Das Erstellen einer Android-Anwendung mit XML ist ziemlich einfach (angesichts der Anzahl der online verfügbaren Ressourcen), aber ich glaube, dass das Erstellen einer Android-Anwendung mit Compose noch einfacher ist, wenn Sie die richtigen Composables für die Erstellung Ihrer Benutzeroberfläche finden. Vor kurzem habe ich gelernt und experimentiert, wie man Anwendungen mit Jetpack Compose entwickelt, und hatte das Bedürfnis, eine Anwendung zu entwickeln, die die Navigation unten implementiert und auch Ein- und Ausstiegsanimationen bereitstellt, wie sie von einem View-Pager bereitgestellt werden.

Die View Pager-Bibliothek, die ich in meinem Projekt verwendet habe, ist der Accompanist Pager . Schauen Sie sich gerne die Bibliothek an, wenn Sie sie noch nie zuvor genutzt haben. Wir werden auch einen horizontalen View-Pager verwenden, da wir möchten, dass unsere Composables beim Eintritt in die Kompositionsphase und beim Verlassen der Kompositionsphase horizontal hinein- und herausgleiten.

Du redest zu viel. Zeig mir einfach den Code!!!

Ok, ok :) Lassen Sie uns nun in die Implementierung eintauchen, wie wir mit Jetpack Compose ein solches Verhalten erreichen.

1. Fügen Sie zunächst die Abhängigkeiten für die Pager-Bibliothek für die Begleitansicht hinzu und erstellen Sie die Navigation.

implementation "androidx.navigation:navigation-compose:2.5.3"

//Accompanist ViewPager dependency
implementation 'com.google.accompanist:accompanist-pager-indicators:0.13.0'
implementation 'com.google.accompanist:accompanist-pager:0.13.0'

4. Erstellen Sie ein Navgraph, das eine Instanz des Pager-Status aufnimmt. Dieses Navigationsdiagramm wird der zentrale Inhalt unseres Gerüsts sein.

5. Schließlich haben wir den Hauptbildschirm, der die Logik für die Navigation und die Animation der Navigationsübergänge enthält. Der Pager-Status hilft uns bei der Bestimmung der ausgewählten Seite und stellt uns eine animateScrollToPage()- Methode zur Verfügung, die uns dabei hilft, durch Klicken auf die unteren Navigationssymbole zwischen den Seiten hin und her zu wechseln.

6. Rufen Sie nun Ihren MainScreen in Ihrer MainActivity auf und los geht's!! Wir haben den View-Pager erfolgreich verwendet, um eine Navigation von unten zusammen mit den View-Pager-Übergangsanimationen zu erreichen.

Hier ist ein letzter Blick darauf, wie die App aussieht. Außerdem habe ich ein GitHub- Repository, in dem Sie für ein noch besseres Verständnis den Quellcode der App finden können.

Vielen Dank, dass Sie bis zum Schluss gelesen haben!! Das ist alles für heute.

Vorschläge jeglicher Art sind herzlich willkommen. Wir sehen uns wieder.