B4A Library Circle Menu

Hello all, it's been a while since i've posted anything, i've created a few libraries small libraries for personal use and have not had so much time to share them.

Well, today is the day, this library is a wrapper from this library https://android-arsenal.com/details/1/5361 which i wrapped many months ago, i've cleaned it up a little and sharing it with you guys today, is nothing too fancy but it would give a very nice touch to any app in my humble opinion.

attached is the xml and jar files along with a B4A example on how to use it.
Also i'am including the resources folder which needs to be included using the

#AdditionalRes

Please note that the AppCompat library is needed and the AppCompatActivity needs to be extended from the Main Activity.

Updated 10/10/2017 Version 1.01, Added OpenMenu method.


B4ACircleMenu
Author: Walter Flores
Version: 1

• CircleMenu
  Events:
  • MenuSelected (index as Int As )
  • OnMenuClosed
  • OnMenuOpened
  Methods:
  • BringToFront
  • Initialize (eventname As String, color As Int, openicon As String, closeicon As String)
    initialize library
    Example
    <code>
    Dim menu as CircleMenu
    menu.Initialize("menu1", Colors.Blue, "open_menu", "close_menu")
    </code>
  • Invalidate
  • Invalidate2 (arg0 As Rect)
  • Invalidate3 (arg0 As Int, arg1 As Int, arg2 As Int, arg3 As Int)
  • IsInitialized As Boolean
  • RemoveView
  • RequestFocus As Boolean
  • SendToBack
  • SetBackgroundImage (arg0 As Bitmap)
  • SetColorAnimated (arg0 As Int, arg1 As Int, arg2 As Int)
  • SetLayout (arg0 As Int, arg1 As Int, arg2 As Int, arg3 As Int)
  • SetLayoutAnimated (arg0 As Int, arg1 As Int, arg2 As Int, arg3 As Int, arg4 As Int)
  • SetVisibleAnimated (arg0 As Int, arg1 As Boolean)
  • OpenMenu
  • addSubMenu (colors() As Int, icons() As String)
    adds submenu icons to main menu
    receives an array or colors and an array of strings whcih point to the icon resources
    <code>
    Dim rescolors() as int = Array As Int(Colors.red, Colors.blue, Colors.Green,Colors.Magenta)
    Dim icons() as String = Array As String ("camera_2","icon_setting","save_48","blank_file")
    menu.addSubMenu(rescolors, icons)
    Activity.AddView(menu, 0, 0, 100%x, 100%y)
    </code>
  Properties:
  • Background As Drawable
  • Color As Int [write only]
  • Enabled As Boolean
  • Height As Int
  • Left As Int
  • Padding()() As Int
  • Parent As Object [read only]
  • Tag As Object
  • Top As Int
  • Visible As Boolean
  • Width As Int

Hope you guys enjoy it, any questions please feel free to ask,

Regards,
Walter

 

[Johan Schoeman]

Walter, have just downloaded it and tested it. Very very nice!

 

[NJDude]

Good to see some of the "regulars" still around.

Nicely done bud.

 

[Mahares]

Very nice piece of work @walterf25
Is there any way to be able to use text instead of icons here:

Dim icons() As String = Array As String("camera_2","icon_setting","save_48","blank_file")

For instance, use this to display the sub menu names:

Dim icons() As String = Array As String("Payable","Received","Stock","Comment")

Also , I noticed that the main menu icon starts out as red, but when clicked, it turns to almost dark brown. Is that by design?

 

[JordiCP]

Thanks for sharing!! I like the effect when one of the expanded icons is clicked

 

[walterf25]

Good to see some of the "regulars" still around.

Nicely done bud.

Thanks Bud, i'm still here, just been a bit busy.

Walter

 

[walterf25]

Dim icons() As String = Array As String("camera_2","icon_setting","save_48","blank_file")
For instance, use this to display the sub menu names:

Dim icons() As String = Array As String("Payable","Received","Stock","Comment")

I'm not sure, i can look into it, according to the original project, you can only do icons, i think is what gives the menu the very good looking feature.

As far as the main menu icon, the color can be changed to whatever color you prefer, the color after you open the menu is just a darker color of the color you decide to use and is automatically set, i don't think the function to change the darker color is exposed.

Regards,
Walter

 

[walterf25]

Thanks for sharing!! I like the effect when one of the expanded icons is clicked

Thanks Jordi, it is very cool indeed.

Walter

 

[NJDude]

Hey Walt, have you noticed that when you tap the "pink" button on your sample (the icon on the left) there's a "partial ghost" button showing on the bottom right corner of the screen?

 

[walterf25]

Hey Walt, have you noticed that when you tap the "pink" button on your sample (the icon on the left) there's a "partial ghost" button showing on the bottom right corner of the screen?

Hey NJ, i haven't noticed it, i will do so me testing soon. Thanks for pointing it out.

Walter

 

[walterf25]

Hey Walt, have you noticed that when you tap the "pink" button on your sample (the icon on the left) there's a "partial ghost" button showing on the bottom right corner of the screen?

Hey NJ, i did some testing but was not able to see what you are seeing, I think you need to lay off those meds bud

Any how, i made a short video, let me know if you see what you're describing on the video?

https://www.dropbox.com/s/ss35m602m0ythtu/Circle_Menu.mp4?dl=0

Cheers,
Walter

 

[NJDude]

Hmmm, interesting, I will try again and record the screen.

Sorry but I need those meds, I like to see the colors oohhh the colors.

 

[walterf25]

Hmmm, interesting, I will try again and record the screen.

Sorry but I need those meds, I like to see the colors oohhh the colors.

 

[NJDude]

Ok bud, look at THIS clip, tapping on the "pink" button a "quarter" button appears on the button right corner, and if I tap on the "blue" button a quarter appears on the top left corner.

This was tested on my Nexus 6P (Nougat 7.1.1)

 

[walterf25]

Ok bud, look at THIS clip, tapping on the "pink" button a "quarter" button appears on the button right corner, and if I tap on the "blue" button a quarter appears on the top left corner.

This was tested on my Nexus 6P (Nougat 7.1.1)

I see it, i don't see it on any of my devices though, what device are you using? Android Version, Resolution etc.?

Walter

 

[NJDude]

Really dude? I mentioned the device and android version, you even quoted my post LOL.

If you need the resolution: 1440x2392 (scale: 3.5 - 560dpi)

I suggest you get thicker glasses

 

[walterf25]

Really dude? I mentioned the device and android version, you even quoted my post LOL.

If you need the resolution: 1440x2392 (scale: 3.5 - 560dpi)

I suggest you get thicker glasses

Oops, sorry bud, it was around 11:00pm when i replied to your post, been working 11, 12 hours per day, i was beat last night, anyhow, i suggest you throw away your phone and get a new one

Walter

 

[Mahares]

according to the original project, you can only do icons, i think is what gives the menu the very good looking feature

Your statement is true, but sometimes words are more descriptive especially when you are using the circle menu items to do a certain function that is hard to describe with an icon. If you can add it, that will make your library a lot more versatile, If it is a limitation of the original project, then it is what it is.
Thank you

 

[G-ShadoW]

How to programaticly call OnMenuOpened?

 

[walterf25]

How to programaticly call OnMenuOpened?

The OnMenuOpened event should fire up automatically when you open the menu.

Regards,
Walter