In this chapter, we will start the Where it's snap project, and we will talk more about the features that it will have later. The project will be discussed right up until Chapter 27, Going Local – Hola! where it is completed, but we won't only be working on this app.
Where it's snap will feature a navigation drawer as a means of allowing the users to access the features and screens of the app, and this will be the main focus of this chapter.
In this chapter, we will:
- Introduce the navigation drawer
- Look at the features of the Where it's snap project
- Get started on the Where it's snap project, including implementing its navigation drawer
Let's take a look at this extremely cool UI pattern.
What's so great about navigation drawer. Well, the first thing that might catch your eye is that it can be made to look extremely stylish. Take a look at this next figure , which shows off a navigation drawer in action in the Google Play app:
To be honest, right from the start, our navigation drawer is not going to be as fancy as the one in the Google Play app. However, the same functionality will be present in our app.
What else is neat about the navigation drawer is the way that it slides to hide/reveal itself when required. It is because of this behavior that it can be of a significant size, making it extremely flexible with regard to the options that can be put on it. When the user is finished with it, it completely disappears like a drawer.
I suggest that you open up the Google Play app now and see how it works, if you haven't already.
You can slide your thumb/finger from the left-hand side edge of the screen and the drawer will slowly slide out. You can, of course, slide it away again in the opposite direction.
While the navigation drawer is open, the rest of the screen is slightly dimmed, as seen the previous figure, helping the users to focus on the navigation options offered.
You can also tap anywhere off of the navigation drawer while it is open, and it will slide itself away, leaving the entire screen clear for the rest of the app.
The drawer is also opened by tapping on the menu icon in the top-left corner, as highlighted in the next screenshot:
We can also tweak and refine the behavior of the navigation drawer, as we will see toward the end of the chapter, by overriding a few more lifecycle methods that are called at just the right time.
Here, we will see the onPostCreate and onConfigurationChanged methods. Let's see what we will do with our Where it's snap app, and then, we can get on with implementing a navigation drawer.