In this post, I will create custom navigation menu in android studio with slide animation. So question is how I create custom navigation menu in android studio?. To create a custom navigation menu I used view pager ( build-in android studio services ) with fragments. A whole activity is divided into two fragments. One fragment is side bar menu and other is main menu. A view pager is responsible for switching between two fragments. In this post I will create two different custom navigation menu, one navigation menu will slide up 80 percent of screen and the other will slide up 100 percent of screen. Lets look to the practical example for your better understanding.
Practical Example
Lets take example of custom navigation menu with 80 percent of screen
Lets take example of custom navigation menu with 80 percent of screen
 |
| custom navigation part 1 |
 |
| custom navigation part 2 |
To create it , first add view pager to your main activity xml layout.
Then create two fragments, one for main menu and other side menu. To create a fragment you need to create first xml layouts first then create java classes for it and inherit your java class with fragment.
Now create a adapter called as myadapter class, this will handle both fragments using view pager. Then we need a communication between fragment and activity. In order to implement a communication we need create a interface, in my case, the interface I have is called as ' frag1_to_activity '.
In the interface, there are two methods to implements, one is communicate1 and other is communicate2. Communicate1 method is used for main menu and communicate2 is used for side menu. The method is implemented in main activity.
Last and important thing, you must know how to show or set screen percentage for side menu. The answer is through overriding "getPagewidth" function.
To download the source code of this project link is available below, Click to download.
Lets take example of full screen size side menu, it will look like this.
To make side menu as full screen size, you have change the "getpagewidth" function return value as 1f ( float value). To download full screen size navigation menu, Click on below link.
To make side menu as full screen size, you have change the "getpagewidth" function return value as 1f ( float value). To download full screen size navigation menu, Click on below link.