Chapter 9. Navigating Effectively

Broadly speaking, navigation is how your user gets from one screen to another in your application. More specifically, however, it's what a user needs to do in order to reach a goal within your application. Navigation is an almost completely invisible part of your application's user interface design. It's an area that is often neglected, frequently done badly, and as a result, often leads users to frustration.

The problem is that the navigation design of an application is often a side effect of the user interface design, rather than something that has been planned. Navigation, just like a single screen, can and should be designed to center around the user rather than the designer or developer. Using the techniques you've already learned in this book, you should be able to make almost any navigation flow work easily, because the elements should not be tightly coupled to each other.

In this chapter, we'll look at navigation and navigation patterns within the...

Planning navigation

Before leaping into your latest app idea, it's a good idea to stop and consider what you are trying to allow the user to do, and figure out how they will actually do it. One of the best ways to do this is with the decision tree or navigation tree. These can be easily drawn on paper, or if you're collaborating with other people, index cards on a magnetic whiteboard (or even a pin-board) are very effective.

The idea is to not just draw out the possible screens in your app, but how the user will get to each one. Navigation diagrams don't just help to define what screens your application actually needs, but will help ensure that the user will never be "lost" in your application. If the navigation lines become too complex, then you need to simplify the navigation (possibly by adding or removing some of the screens). Overly complex navigation is often hidden in the use of an application, but when drawn on a diagram, the complex relationships between screens become obvious, and...

Tabbed navigation

When applications are broken down into a small number of logical areas, tabs often become the most obvious and simplest method of navigation. Most application's navigation is deeply hierarchical, and in these cases, tabs are not a good choice for a navigation mechanism. Tab navigation is best used when each tab will be used roughly as much as each of the other tabs (that is, they have roughly equal importance). There are two major types of tabbed layouts in Android: bottom tabs and top tabs (also known as action bar tabs or toolbar tabs).

Top tabs are the classic method of adding tabs to an Android application, and are perfect when the application areas are not switched between often. This is because they are at the top of the screen and typically far away from where the user's fingers are. Most typically, a user has their fingers near the bottom of the screen, close to the software keyboard and system navigation buttons:

Bottom tabs, on the other hand, are a far more subtle...

Navigation menus

Sometimes, you need to provide your user with a broad set of navigation options that won't fit into a set of tabs. This is where a hidden navigation menu, sometimes called a hamburger menu, becomes useful. This menu pattern was once popular to put as a sort of main menu, available on every screen in your application. However, navigation menus hide options, and they often encourage sloppy navigation design, because they provide a space where any navigation items can be dumped. It's better to try and avoid any form of hidden navigation until you're absolutely sure that you need it.

They can be useful when they augment other navigation patterns (such as tabs), and are used to offer seldom used or advanced functionality that the user is unlikely to access every day. For example, on a photo gallery screen, a hidden menu might be used to access the ability to create new labels, access photos that have been deleted, and to access settings and help.

Let's add a navigation menu to...

Navigating using Fragments

So far in the book, you've mostly been navigating users from one Activity to another Activity, and this is in fact how most applications are built. However, there is another option, which is often much more flexible and allows you to build even more modular applications--navigation using Fragment instances. So far, we've only really looked at Fragments as little blocks of your application that can be assembled to form parts of a screen, but they can be so much more than that.

The tabbed Activity classes both provide a sort of navigation using the ViewPager class and the FragmentPagerAdapter class. In these cases, each of the pages that the user can swipe to is a complete Fragment, with its life cycle that is paused and resumed, stopped, and started as the user swipes the Fragment in or out of view.

If you look into the FragmentPagerAdapter class, you'll find that it doesn't add and remove the Fragment view instances directly to the ViewPager object. Instead, it uses...

Test your knowledge

1. When using bottom tabs for navigation, which of these is important?
   • They all have single color icons
   • The tabs are of roughly equal importance
   • There are always exactly three tabs

2. Top tabs are preferred to bottom tabs in which of these situations?
   • When the user won't need to navigate as frequently
   • When the tabs don't have icons
   • When there are more than three tabs
3. Fragments can be used for navigation in which of these cases?
   • Only when a navigation drawer is used as well
   • Any time the user navigates within the application
   • When they can be nested in a FrameLayout
4. When the user selects an item in a navigation drawer, which of these is true?
   • The drawer needs to be closed by the user
   • The drawer should be closed programmatically
   • The drawer is closed automatically after a short delay

Summary

Navigation is a critical part of a user's experience, and should be carefully thought out and designed. Material design has various different design structures and widgets to help you implement more effective navigation, but it's important to use them carefully and in the right place. As with any screen design, it's important to consider what the user will want to do most often, and to rank each possible action and navigation from the most important to the least on every screen they are available in.

In many applications, dedicated navigation components won't even be needed, and navigation will be achieved purely through goal-oriented actions from an overview screen or dashboard. In all instances, it's a good idea to draw up a navigation map ahead of time (even if it's incomplete or overly simplified). They will often tell you what sort of navigation structure and components your application will require.

Navigation achieved using the FragmentManager instead of always launching a new...