B4A Library [Lib] Compact ActionBar

This library will create a Compact ActionBar.

You can display a clickable Logo, a Menu button and up to 20 action buttons, the ActionBar can also auto-hide.

Requirements:

- B4A 6.x+
- Add the following files to your assets directory:
  • ActionBarLogo.png
  • ActionBarMenuButton.png
  • ActionBarPullTab.png
Note: You can use your own png's, but you MUST keep the same names.

How to install:

- Copy the CustomCompactActionBar.jar and CustomCompactActionBar.xml to your additional libraries directory.

How to use:

B4X:
'Initialize the library
Dim ActionBar As CustomCompactActionBar

'Create the ActionBar
ActionBar.Initialize(Activity, Me, "Manager", "", "", Colors.ARGB(255, 20, 20, 20), Colors.ARGB(255, 160, 160, 160), True, True, True)

'Add some ActionButtons
'NOTE: The action buttons SUPPORTS ONLY GRAPHICS.
ActionBar.AddBarIcon(mIcon1.Bitmap, 1)
ActionBar.AddBarIcon(mIcon1.Bitmap, 2)
ActionBar.AddBarIcon(mIcon1.Bitmap, 3)
ActionBar.AddBarIcon(mIcon1.Bitmap, 4)

'If you want to add a menu
ActionBar.SetMenu(200dip, 200dip, Null, "", Colors.DarkGray, Typeface.DEFAULT)

'Add menu items
For I = 1 To 10

    ActionBar.AddMenuItem(LoadBitmap(File.DirAssets, "ActionBarLogo.png"), "Item " & I, Colors.White, I)

Next

The click events are captured by doing the following:
B4X:
Sub Manager_Click(ViewClicked As String, Value As Object)

    'You can use SELECT CASE or IF...THEN to process the return, the possible results are:
    'Logo, 0           = The logo was clicked
    'BarIcon, <value>  = A bar icon was clicked
    'MenuItem, <value> = A menu item was clicked

    ToastMessageShow("Result = " & ViewClicked & CRLF & "Value = " & Value, False)

End Sub

NOTE: This new version breaks previous versions, check the NEW library name (it is called now CustomCompactActionBar) and there are also additional parameters. Please check the attached sample for details.

Screenshots:
3d1SDUHl.png
-
ZtVlR4rl.png
 

Attachments

  • CustomCompactActionBar_Sample.zip
    19.5 KB · Views: 421
  • CustomCompactActionBar_Lib_1.8.zip
    9.8 KB · Views: 485
Last edited:

Reviewnow

Active Member
Licensed User
Longtime User
Actionbar

NjDude this looks great , thanks for your work
 

stevel05

Expert
Licensed User
Longtime User
Very Nice,

Thanks very much, I feel a design review coming on!
 

lock255

Well-Known Member
Licensed User
Longtime User
NJDude, if I add the layout:

B4X:
Sub Activity_Create(FirstTime As Boolean)
   Activity.LoadLayout("main")

the program stops, explain to me how to put the layout together with your ActionBar?
 

lock255

Well-Known Member
Licensed User
Longtime User
I resolved, in practice there were components that interfered ... so I deleted those posts above and it worked perfectly!
 
Last edited:

lock255

Well-Known Member
Licensed User
Longtime User
NJDude it is possible to position the ActionBar side vertically?
 

lock255

Well-Known Member
Licensed User
Longtime User
Maybe if you want to improve you consider my idea :)

For case, you can replace the drop-down menu with this?
 

walterf25

Expert
Licensed User
Longtime User
Compact ActionBar

Great Job NJ, i'm planning on using this to update one of my apps, however i have a question for you, is there a way catch whenever the small tab is pressed right before the whole action bar drops down and shows up, I see that you have an event listener for all the action bar icons and when they are pressed but i don't see one to listen when the little tab thingy is pressed.

Any thoughts?

thanks,
Walter
 

motley

Member
Licensed User
Longtime User
I have a problem with this lib.

So I have normal layout loaded. Then when I press (in my app!) Compact ActionBar arrow it opens but go behind the views from my layout!! should not it be over?? how to fix?
 

lock255

Well-Known Member
Licensed User
Longtime User
NJDude know how I can replace the LongClick a time to click this normal?
 

shashkiranr

Active Member
Licensed User
Longtime User
Have the menu open from the buttom

Hi NJ Dude,

Is it possible to open the menu from the bottom of the screen?

because for an application of mine i need it to be at the bottom of the screen.

Kindly let me know. and if yes kindly tell me how to do it.

Regards,
SK
 

rgately

Member
Licensed User
Longtime User
NJDude,

Is it possible to position the Compact ActionBar at the bottom of the screen?

Is it possible to make the pull tab larger?

Thanks
 

Bryan

Member
Licensed User
Longtime User
I too have a suggestion. I would like to have a way to change the position the ActionBarPullTab.png along the bottom of the AcrionBar if possible.
I have this working great on a project I'm doing using a table. Problem I found was I need to shrink the height of the table because the ActionBarPullTab.png was covering up part of my table headers. Thus you need a blank area under the PullTab. I tried to change the alpha of the pulltab to make it slightly invisible but it just doesn't look professional doing it that way. Another idea maybe would be a way to drop the actionbar down without using a pull tab. Not sure it that could be done somehow. All in all it is still a very nice action bar.

Bryan
 

susu

Well-Known Member
Licensed User
Longtime User
Hi NJDude,

Thank you for your library. Is there a way to resize ActionBar's height? It seems ActionBar is too big for my app.
 
Top