fabernovel loader

Lightning talks: Getting started with Google's Navigation Components Android

FRONT
MOBILE
fabernovel loader
Any in-app navigation should provide its users a consistent and predictable experience. Here’s 6 steps to use Google’s Navigation Architecture Component.

The Navigation Architecture Component adheres to four main rules for a consistent and predictable in-app navigation: 1/ an activity is an app’s entry-point, fragments are screens. 2/ “Up” button mustn’t close the application (“Back” can). 3/ “Back” and “Up” buttons should function the same way (except for app’s entry points which are closed on “Back” pressed). 4/ Deep linking and navigating to a same destination should yield the same stack.

The first step is to add the library to app/build.gradle.

This library is based on a navigation graph (app/src/main/res/navigation/main_graph.xml). The navigation graph is an  XML resource file, a graphic version is available in Android Studio >3.2

In order to use the created navigation graph, it need to be host within an activity: app/src/main/res/layout/activity_main.xml. Navigating between fragment can be done in three ways:

1/ With a click, cf app/src/main/java/com/example/applidium/navcontroller/HomeFragment.kt ;

2/ Retrieving the `NavController` with a fragment app/src/main/java/com/example/applidium/navcontroller/FormFragment.kt
3/ Retrieving the `NavController` with a view app/src/main/java/com/example/applidium/navcontroller/RandomFragment.kt
You can simplify `NavigationView` navigation by using the same id in its menu’s items (menu/bottom_navigation_menu.xml) and in the navigation graph’s fragments. (cf MainActivity)

To pass arguments between screens, you can use a `Bundle` (see here), or `Safe-args` extension  ( add them to your build.gradle). Arguments’s type and nullity are declared in the navigation graph and checked at runtime. Two classes are generated:

  • To pass arguments:
$SRC_FRAGMENT_NAME$Directions.$ACTION_NAME$(...arguments..)
  • To retrieve arguments:
$DST_FRAGMENT_NAME$Args.fromBundle(arguments...)

The 6th and last step: animating transitions between screens, you can declare four types of transitions in the navigation graph:
– app:enterAnim: when navigating to the fragment
– app:exitAnim: when navigation from the fragment to a destination
– app:popEnterAnim: when « Back/Up » is pressed from a destination
– app:popExitAnim: when « Back/Up » is pressed from the fragment

Resources:

Architecture Components – Repository: https://github.com/sjcqs/navigation-component-demo

Documentation: https://developer.android.com/topic/libraries/architecture/navigation/

Interested in this subject?

Let's discuss about it
next read
API
FRONT
QUALITY
HQ Trivia reverse engineering

Launched on the very end of 2017 by the creators of Vine, HQ Trivia is making a lot of noise on the tech scene. Its instant popularity and disruptive concept (a mobile app active a ...

MOBILE
Accessibility in iOS applications

For one of our latest application, we had a strong requirement from the client. The app had to be completely accessible. What does it mean in practice? It means people with visual, ...