B4A Library AHNavigationDrawer - Native Google Navigation Drawer

This is a wrapper library for the native NavigationDrawer introduced by Google at Google I/O 2013.

It contains two objects:

AHNavigationDrawer - This implements the Navigation Drawer
SlideDrawable - This is a special type of drawable used to create an indicator for the NavigationDrawer
MaterialMenuDrawable - This is a drawable which can be used to create the Material Design burger->arrow->cross->check animation.

This Library uses the android-support-v4.jar library which is part of the Android SDK. You have to install it with the Android SDK Manager. In the SDK Manager please add/download the "Extras/Android Support" package. Then you will need to copy the android-support-v4.jar file from <SDK root folder>\extras\android\support\v4 to your B4A custom libs folder!
You need at least the API17 version of the library!

The MaterialMenuDrawable uses the NineOldAndroid animation library. Download the nineoldandroids-2.4.0.jar from here and place it in your custom libs folder (you don't need an xml file for it)

The example uses the mListView library by icefairy333 and the reflection library by agraham.

Changelog:
V1.0:
- Initial version

V1.1:
WARNING: Signature of the event subs have changed!
- Added support for secondary drawer
- Ability to change drawer edge touch sensitivity size

V1.20:
- Fixed the "glitch" while opening the drawer (Sometimes the drawer got "stuck" while swiping open)

V1.21:
- Fixed bug when using NavDrawer.ContentPanel.LoadLayout()

V1.30:
- Some internal changes which should make it compatible with ULV (Ultimate ListView)
- New MaterialMenuDrawable object for Material Design Burger/Arrow/Cross/Check animation
Attention: The MaterialMenuDrawable needs the NineOldAndroids library. See above.

V1.40:
- changed typo for nineoldandroids jar file (Name change: nineoldandroid-2.4.0.jar to nineoldandroids-2.4.0.jar). If you update from older version just change nineoldandroid-2.4.0.jar in your CustomLibs folder to nineoldandroids-2.4.0.jar

Screenshot_2013-08-01-09-49-05.png
 

Attachments

  • AHNavigationDrawerExample1_1.zip
    323.7 KB · Views: 3,277
  • DoubleNavigationDrawerExample1_0.zip
    324 KB · Views: 2,390
  • AHNavigationDrawer1_40.zip
    27.8 KB · Views: 2,069
Last edited:

corwin42

Expert
Licensed User
Longtime User
You can set the width of the secondary drawer while adding it. NavDrawer.AddSecondaryDrawer(Width, Gravity)
 

asales

Expert
Licensed User
Longtime User
Is possible use a button to open and close the secondary drawer?
I tryed but not work (see the sample):
 

Attachments

  • ExampleSecondDrawer.zip
    12.8 KB · Views: 229

asales

Expert
Licensed User
Longtime User
Don't load your layout to the activity.

Add the NavigationDrawer object to the activity.
Load your Layout to the NavigationDrawer.ContentPanel.

See the example of how to add the views correctly.

How can I do this with my project in attached?

I need load my layout1 into NavigationDrawer and click in imageviews to show the toastmessage.

Thanks in advance.
 

Attachments

  • nav_test.zip
    27.6 KB · Views: 264

heindrickson

New Member
Licensed User
Longtime User
Nice work!
Is there any example of using AHNavigationDrawer and AHViewPager together ?
I saw some apps that have a UI like that.
 

corwin42

Expert
Licensed User
Longtime User
Nice work!
Is there any example of using AHNavigationDrawer and AHViewPager together ?
I saw some apps that have a UI like that.
Sorry, I don't have an example here but you can put whatever you want in the ContentPanel of the Navigationdrawer so is is easy to use it with AHViewpager (or StdViewPager from the StdActionBar library)
 

herryj

Member
Licensed User
Longtime User
Hi.
When compiling it I'm having this error.
LastException java.lang.NoSuchFieldException: drawer_shadow

how to fixed this?
Can anybody help me?
Thanks.
 

Dave61

Member
Licensed User
Longtime User
I tried using this library as a class but am having problems. The attached sample shows a project with the menu switching between 2 activities. The way it is set up, the views in the activity show on top of the menu which looks pretty ugly as it obscures the menu.

But if I swap the code order from this:

' Add the menu 1st so I can access the button
Dim AppMenu As ClassMenu
AppMenu.Initialize(Activity, Colors.Blue, 0, 0) ' this calls ClassMenu.Initialize()

' Add the button last so I can press it.
btSample1.Initialize("")
btSample1.Text = "Button 1"
Activity.AddView(btSample1, 50dip, 50dip, 100dip, 100dip)

to this:

' Add the button first so it hides under the menu
btSample1.Initialize("")
btSample1.Text = "Button 1"
Activity.AddView(btSample1, 50dip, 50dip, 100dip, 100dip)

' Add the menu last so it shows on top of the buttons
Dim AppMenu As ClassMenu
AppMenu.Initialize(Activity, Colors.Blue, 0, 0) ' this calls ClassMenu.Initialize()

then I can't press the button when the activity is running.
I think I am missing something simple - can anyone tell me what I am doing wrong?
 

Attachments

  • MenuClassWith2Activities.zip
    16.3 KB · Views: 206
  • Screenshot_2015-02-11-13-53-53.png
    Screenshot_2015-02-11-13-53-53.png
    41.1 KB · Views: 296

corwin42

Expert
Licensed User
Longtime User
I tried using this library as a class but am having problems. The attached sample shows a project with the menu switching between 2 activities. The way it is set up, the views in the activity show on top of the menu which looks pretty ugly as it obscures the menu.
If you use the NavigationDrawer you should not add Views directly to the Activity. Everything you normally add to the Activity should then be added to the NavDrawer.ContentPanel.
 

Joni Van Roost

Member
Licensed User
Longtime User
Hello, I have a problem with integrating Google Maps with the AHNavigationDrawer. The problem is that you have to load the map which is declared as a MapFragment into a Panel (MapPanel). I don't know how it happens but when I do this the MapPanel becomes white and takes up the entire screen. It's very had to explain, I added some of the code, I hope that helps. How do I initialize them so I can have the Navdrawer work with Google Maps? It's probably something I'm doing wrong..

B4X:
mFragment.Initialize("Map",MapPanel)

    'navdrawer
    navdrawer.Initialize("NavDrawer",MapPanel, 85%x)
    navdrawer.SetEdgeSize(navdrawer.GRAVITY_START, navdrawer.GetEdgeSize(navdrawer.GRAVITY_START) * 2)
    navdrawer.NavigationPanel.Color = Colors.black
 

corwin42

Expert
Licensed User
Longtime User
I never used the Maps API but this is what I find in the tutorial:

If you see a "white map" then there is most probably a mismatch between the: package name, sign key and the API key (from the manifest editor).
 

Joni Van Roost

Member
Licensed User
Longtime User
Hi, I know about the mismatch with the private sign key, that's not the problem because maps is working.. It has something to do with the fact that you first need to load the map fragment into a panel and the AHNavigationdrawer also works with panels or something like that. I don't know how to fix it, it seems like the drawer is working because I can see it behind the white panel but I don't know where the panel is coming from and I don't now how to get around it.
 

Inman

Well-Known Member
Licensed User
Longtime User
I ran into an issue when trying to make AHN work with Informatix's UltimateListView. With a ULV in the content panel, the secondary drawer added to the right, cannot be pulled out without some effort. The primary drawer on the left can be opened as usual, but opening right drawer is hit or miss.

Informatix said the issue is with AHN as ULV works fine with his own SlidingSidebar class. Could you please take a look?
 

corwin42

Expert
Licensed User
Longtime User
I ran into an issue when trying to make AHN work with Informatix's UltimateListView. With a ULV in the content panel, the secondary drawer added to the right, cannot be pulled out without some effort. The primary drawer on the left can be opened as usual, but opening right drawer is hit or miss.

Informatix said the issue is with AHN as ULV works fine with his own SlidingSidebar class. Could you please take a look?

Can you please create a sample project which shows this problem? (Yes, you can use ULV in it)
 

Informatix

Expert
Licensed User
Longtime User
I ran into an issue when trying to make AHN work with Informatix's UltimateListView. With a ULV in the content panel, the secondary drawer added to the right, cannot be pulled out without some effort. The primary drawer on the left can be opened as usual, but opening right drawer is hit or miss.

Informatix said the issue is with AHN as ULV works fine with his own SlidingSidebar class. Could you please take a look?
Here's the demo with ULV and 2 sidebars. In ULV, nothing prevents the sidebars from detecting a swipe to the side and my SlidingSidebar class use the standard onTouch listener. That's why I think the problem comes from AHNavigDrawer.
 

Attachments

  • ULV_2SlidingSidebars.zip
    11.7 KB · Views: 240

corwin42

Expert
Licensed User
Longtime User
Here's the demo with ULV and 2 sidebars. In ULV, nothing prevents the sidebars from detecting a swipe to the side and my SlidingSidebar class use the standard onTouch listener. That's why I think the problem comes from AHNavigDrawer.

AHNavigationDrawer just wraps the standard Google implementation. I will have a look at the example.

Edit: Ah, your example uses the SlidingSidebar class and not AHNavigationDrawer. Ok, I need an example with AHNavigationDrawer.
 
Top