B4A Library MSMaterialMenu - Animating icons

This library simulates some animations on the drawer icon on the titlebar that are coming in on the material design.
It comes from this library: https://github.com/balysv/material-menu

Dependencies:
- The NineOldAndroid java package, is included in the zip file.

Credits:
Thanks to Informatix for his NineOldAndroids library and for modifying it for me.

Sample:

    Dim StdABHelper As StdActionBarHelper
    Dim MMenu As MSMaterialMenu
    StdABHelper.Initialize
    MMenu.Initialize("MMenu")

    MMenu.setScaleAndStroke(1,2)
    MMenu.Color = Colors.Black
    StdABHelper.Icon = MMenu.Drawable


Sub StdAB_ButtonClicked
    If MMenu.State = "BURGER" Then
        MMenu.animatePressedState("X")
        NavDrawer.OpenDrawer
    Else
        MMenu.animatePressedState("BURGER")
        NavDrawer.CloseDrawer
    End If
End Sub

This will work best with StdActionBar+StdActionBarHelper (wish they were merged).

 

[thedesolatesoul]

Sounds good to me will the dialogs allow for custom views to be added?

Unfortunately not currently, it seems there are 3 types of dialogs. An AlertDialog, EditTextDialog and ListDialog.

 

[gadgetmonster]

Not sure if this helps but during my search I came across this library on GitHub

https://github.com/drakeet/MaterialDialog

but I have no idea how to wrap this.

 

[thedesolatesoul]

Not sure if this helps but during my search I came across this library on GitHub

https://github.com/drakeet/MaterialDialog

but I have no idea how to wrap this.

It is helpful, I have seen atleast two libraries that can do this. Unfortunately the one available when I started wrapping a while ago, didnt have this option (and still doesnt). To be honest, this one is fairly easy to wrap, just a lot of dog-work.

 

[ac9ts]

I've been playing with this library and it's pretty slick. Thanks for the effort!

Now for a request (which you knew was coming). Can you add a boolean (?) flag indication that there is an animation in progress?? It would make it easier o synchronize other things that are happening on the screen.

 

[thedesolatesoul]

I've been playing with this library and it's pretty slick. Thanks for the effort!

Now for a request (which you knew was coming). Can you add a boolean (?) flag indication that there is an animation in progress?? It would make it easier o synchronize other things that are happening on the screen.

Will be done.
The next update will have it. Will also have a setTransformationOffset method to set the animation to the exact frame you want.
No promises on when I manage to release it.

 

[corwin42]

setTransformationOffset would be very nice for NavigationDrawer.

 

[thedesolatesoul]

setTransformationOffset would be very nice for NavigationDrawer.

That is exactly what it is for.

 

[corwin42]

That is exactly what it is for.

So what you are waiting for. We need it.

 

[thedesolatesoul]

So what you are waiting for. We need it.

I dont know...I went on to try to wrap a Material Switch library.

Anyway, I have released a preview version of the library here.
Please chip in with your suggestions/feedback, missing documentation, argument names, things not working, inconsistent naming etc.

It has 3 useful classes (IIRC):
- MSMaterialMenu (the drawer icon)
- MSMaterialRipple (my implementation of the rippleview required by the dialogs)
- DialogBuilder (inconsistent naming!)

e.g.

'''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
    Dim r As MSMaterialRipple
    r.Initialize
    spanel.AddView(r,  10dip,200dip, 100%x - 20dip, 48dip)
    b.Initialize("b")
    b.Text = "Change Icon"
    r.Panel.AddView(b, 0dip,0dip, r.Width, r.Height)
    r.SetDuration(50)
    r.SetZoom(100,0.9)
    r.SetupChildViewEvents(b)

'''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
    Dim builder As DialogBuilder
    builder.Initialize("MyDialog")
    builder.setTitle("Title").setMessage("This is the message").setThemeColor(Colors.Red)
    builder.setButton(-1, "OK")
    'builder.setButtonTextColor(-1, Colors.Green)
    'builder.setButton(-2, "No")
    'builder.setButton(-3, "Cancel")
    builder.setCancelable(True)
    builder.setThemeColor(Colors.Green)
    builder.setDesign(builder.DESIGN_MATERIAL_LIGHT)
    builder.setEditTextStyle("Text","Hint",Colors.Black,Colors.Gray,dumy.INPUT_TYPE_TEXT)
    'builder.setListStyle(Array As String("Yellow","Green","Blue","Red"))
    builder.show

Sub MyDialog_DialogResponse(Buttonclicked As Int) As Boolean 
    Log(Buttonclicked)
    Return True
End Sub

Sub MyDialog_ItemAccepted(SelectedItem As String)
    Log(SelectedItem)   
End Sub

Sub MyDialog_TextAccepted(SelectedText As String)
    Log(SelectedText)
End Sub

'''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
    Dim MMenu As MSMaterialMenu 
    MMenu.Initialize("MMenu")
    MMenu.setScaleAndStroke(1,2)
    MMenu.Color = Colors.White
    StdABHelper.Icon = MMenu.Drawable 


Sub NavDrawer_DrawerOpened (DrawerGravity As Int)
    'MMenu.animateState("X")
    isDrawerOpened = True
End Sub

Sub NavDrawer_DrawerClosed (DrawerGravity As Int)
    'MMenu.animateState("BURGER")
    isDrawerOpened = False
End Sub

Sub NavDrawer_DrawerSlide (Position As Float, DrawerGravity As Int)
    Dim slideOffset As Float 
    If isDrawerOpened Then
        slideOffset = 2 - Position
    Else
        slideOffset = Position
    End If
    MMenu.setTransformationOffset("BURGER_ARROW",slideOffset)
End Sub

 

[shashkiranr]

Thanks @thedesolatesoul , the BURGER_ARROW works

 

[shashkiranr]

Hi thedesolatesoul,

is it possible to wrap this Material Design Floating Action button. ?? I am trying it but failing .

https://github.com/futuresimple/android-floating-action-button

Regards,
SK

 

[thedesolatesoul]

Hi thedesolatesoul,

is it possible to wrap this Material Design Floating Action button. ?? I am trying it but failing .

https://github.com/futuresimple/android-floating-action-button

Regards,
SK

It looks fairly easy on first look.
I am already swamped with work and a backlog of unreleased libraries, so I cannot commit to anything.
If you post your efforts in the Library Developer questions forum I can help you.

 

[Peter Simpson]

Hello world, did you see what I did there

Anyway, I decided to try your MSMaterialMenu, that is the first time that I ever used StdActionBar and StdActionBarHelper. I finally got it working this morning when I woke up. To get it working on all my devices, I had to do the following.

MUST BE USED IN CONJUNCTION WITH AHNavigationDrawer

'Declared in Globals
    Private StdAB As StdActionBar 
    Private StdABH As StdActionBarHelper
    Private MMenu As MSMaterialMenu

'In Activity_Create
    StdAB.Initialize("StdAB")
    StdAB.Subtitle = "Animate"
    StdAB.ShowUpIndicator = True 
    'StdAB.Icon = LoadBitmap(File.DirAssets, "ic_drawer.png")
    StdAB.Icon = Null

    StdABH.Initialize
    MMenu.Initialize(Null)
    MMenu.setScaleAndStroke(1, 2)
    MMenu.Color = Colors.White
    'StdABH.Icon = MMenu.Drawable
    StdABH.SetHomeAsUpIndicator(MMenu.Drawable)

I also did the following because StdAB_ButtonClick does not work under 5.0 Lollipop.

'Extra code

'More code
Sub StdAB_ButtonClicked
    CallSub(Null, ClickCloseDrawer)
End Sub

Sub Activity_ActionBarHomeClick
    CallSub(Null, ClickCloseDrawer)
End Sub

Sub ClickCloseDrawer
    If MMenu.State = "BURGER" Then
        MMenu.animatePressedState("X")
        'MMenu.animateState("X")'Test
        NavDrawer.OpenDrawer
    Else
        MMenu.animatePressedState("BURGER")
        'MMenu.animateState("BURGER") 'Test
        NavDrawer.CloseDrawer
    End If 
End Sub

'The rest is just standard code.
Sub MLVSub_itemclick(Position As Int, Value As Object)
    ToastMessageShow(Value, False) 
    NavDrawer.CloseDrawer
End Sub

Sub NavDrawer_DrawerOpened (DrawerGravity As Int)
    'MMenu.animatePressedState("X")'Test
    MMenu.animateState("X")
    isDrawerOpened = True
End Sub

Sub NavDrawer_DrawerClosed (DrawerGravity As Int)
    'MMenu.animatePressedState("BURGER")'Test
    MMenu.animateState("BURGER")
    isDrawerOpened = False
End Sub

Sub NavDrawer_DrawerSlide (Position As Float, DrawerGravity As Int)
    Dim slideOffset As Float
 
    Log(Position)

    If isDrawerOpened Then
        slideOffset = 2 - Position
    Else
        slideOffset = Position
    End If
 
    MMenu.setTransformationOffset("BURGER_ARROW", slideOffset)
End Sub

Enjoy...

 

[thedesolatesoul]

Thanks @Peter Simpson ...looks awesome.

Just to edit your post, you said:

I also did the following because StdAB_ButtonClick does on work under 5.0 Lollipop.

I think *on = not.

 

[KL7000F]

@Peter Simpson: Can you give me an example please (export as zip-file)? I keep getting error messages ...

 

[Peter Simpson]

Hello @KL7000F,
I'll happily post the source code but at the moment I'm waiting for @thedesolatesoul to finish the designer integration into CustomView. Once he has finished this library, I'll gladly post the code.

Plus my code is kind of messy at the moment

 

[thedesolatesoul]

This one wont have designer support. Its just a drawable that is assigned to the actionbar icon. There is no need or way to support designer.

 

[Theera]

This is a fairly stable beta library.

It simulates some animations on the drawer icon on the titlebar that are coming in on the material design.
It comes from this library: https://github.com/balysv/material-menu

Dependencies:
- The NineOldAndroid java package, is included in the zip file.

Issues:
- Docs are not inherited

I might write a sample once I get Material figured out.

Thanks to Informatix for his NineOldAndroids library and for modifying it for me.

Sample:

    Dim StdABHelper As StdActionBarHelper
    Dim MMenu As MSMaterialMenu
StdABHelper.Initialize
    MMenu.Initialize("MMenu")
  
    MMenu.setScaleAndStroke(1,2)
    MMenu.Color = Colors.Black
    StdABHelper.Icon = MMenu.Drawable


Sub StdAB_ButtonClicked
    If MMenu.State = "BURGER" Then
        MMenu.animatePressedState("X")
        NavDrawer.OpenDrawer
    Else
        MMenu.animatePressedState("BURGER")
        NavDrawer.CloseDrawer
    End If
End Sub

This will work best with StdActionBar+StdActionBarHelper (wish they were merged).

Hi thedesolatesoul,
Dim NavDrawer as AHNavigationDrawer ? and how to Initialize it?

 

[thedesolatesoul]

Hi thedesolatesoul,
Dim NavDrawer as AHNavigationDrawer ? and how to Initialize it?

Have a look at this thread: https://www.b4x.com/android/forum/threads/ahnavigationdrawer-native-google-navigation-drawer.31461/
There is quite some setup involved.

Also note that the above posted library isnt really working properly.(missing res files)

When I get time I will fix it, but it wont be soon.

 

[Ciclope3160]

Hi, I'm testing the example of Slide Menu Material, everything works correctly, except when the menu is visible and press the screen, it closes but the "BURGER" icon does not appear until you click on the navigation bar.
Would know how to fix it, I have failed. Thank You.

Sorry for my english....

Ok, All figured out, I paste the code in case you need. thanks

Sub NavigationBar_ButtonClicked
    Dim alto As Int
    Dim ancho As Int
    alto = Activity.Height
    ancho = Activity.Width
   
    Dim left As Int
    left = ancho / 4
   
    Dim left1 As Int
    left1 = left * 3
   
    Dim imagenfondo As ImageView
    imagenfondo.Initialize ("Imagenfondo")
    Activity.AddView (imagenfondo, left1, 0, 25%x, 100%y)
    imagenfondo.Color = Colors.Transparent
   
    If MaterialMenu.State = "BURGER" Then
        MaterialMenu.animatePressedState("X") 
        SlidingMenu.Show
   
        imagenfondo.BringToFront  
    Else
        MaterialMenu.animatePressedState("BURGER")
        SlidingMenu.Hide 
        imagenfondo.SendToBack
    End If
End Sub

Sub imagenfondo_click
   
    If MaterialMenu.State= "X" Then
       SlidingMenu.Hide 
        MaterialMenu.animatePressedState("BURGER")
    End If
End Sub