Android Tutorial [B4X] B4XPages + B4XDrawer

B4XDrawer v1.53 adds support for B4J. This is a good opportunity to create a B4XPages example using B4XDrawer.
It does require some configuration so pay attention.

The example is based on the three pages example: https://www.b4x.com/android/forum/t...k-for-managing-multiple-pages.118901/#content
A drawer is added to the second page. Everything is implemented in the attached example.


In the page where you want to add the drawer:
Add to B4XPage_Created:

HamburgerIcon = xui.LoadBitmapResize(File.DirAssets, "hamburger.png", 32dip, 32dip, True) 'global B4XBitmap
#if B4i
Dim bb As BarButton
bb.InitializeBitmap(HamburgerIcon, "hamburger")
B4XPages.GetNativeParent(Me).TopLeftButtons = Array(bb)
#Else If B4J
Dim iv As ImageView
iv.Initialize("imgHamburger")
iv.SetImage(HamburgerIcon)
Drawer.CenterPanel.AddView(iv, 2dip, 2dip, 32dip, 32dip)
iv.PickOnBounds = True
#end if

And add these subs:

#if B4J
Sub imgHamburger_MouseClicked (EventData As MouseEvent)
    Drawer.LeftOpen = True
End Sub
#else if B4i
Private Sub B4XPage_MenuClick (Tag As String)
    If Tag = "hamburger" Then
        Drawer.LeftOpen = Not(Drawer.LeftOpen)
    End If
End Sub
#end if

Private Sub B4XPage_CloseRequest As ResumableSub
    #if B4A
    'home button
    If Main.ActionBarHomeClicked Then
        Drawer.LeftOpen = Not(Drawer.LeftOpen)
        Return False
    End If
    'back key
    If Drawer.LeftOpen Then
        Drawer.LeftOpen = False
        Return False
    End If
    #end if
    Return True
End Sub

Private Sub B4XPage_Appear
    #if B4A
    Sleep(0)
    B4XPages.GetManager.ActionBar.RunMethod("setDisplayHomeAsUpEnabled", Array(True))
    Dim bd As BitmapDrawable
    bd.Initialize(HamburgerIcon)
    B4XPages.GetManager.ActionBar.RunMethod("setHomeAsUpIndicator", Array(bd))
    #End If
End Sub

Private Sub B4XPage_Disappear
    #if B4A
    B4XPages.GetManager.ActionBar.RunMethod("setHomeAsUpIndicator", Array(0))
    #end if
End Sub

Private Sub B4XPage_Resize (Width As Int, Height As Int)
    Drawer.Resize(Width, Height)
End Sub

 

[asales]

Very nice. Thanks!
Would be better if we have an animation in the button like this:

Only "hamburguer image" to "close image" animation would be great.

 

[Alessandro71]

Is B4XDrawer v1.53 coming with the next update?

 

[imbault]

Using a Drawer is very helpfull,

But is there a way to open up the drawer by the right?

I see only left methods... Drawer.LeftPanel or Drawer.LeftOpen...

Is a normal behaviour of a drawer, because I would definetally need the drawer to open by the right....


Thanks

 

[Erel]

B4XDrawer only implements a left drawer. You can try this modified library: https://www.b4x.com/android/forum/threads/b4xdrawer-with-right-panel.102168