B4A Library Floating Action Menu (FAM) and Floating Action Button (FAB)

DonManfred · Mar 25, 2016

This is a wrap for this Github Project. Thanx to @ivan.tellez for pointing me into it

The library is a replacement for the Floating Action Button lib by @corwin42
They are not compatible as we are both using the same Objectname (FloatingActionbutton).

Requires B4A Version 5.8+

FloatingActionButton
Author: DonManfred (wrapper)
Version: 1.02

FloatingActionButton
Fields:
- ba As BA
Methods:
- BringToFront
- DesignerCreateView (base As PanelWrapper, lw As LabelWrapper, props As Map)
- Initialize (EventName As String)
- 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)
- hasShadow As Boolean
- hide (animate As Boolean)
 Makes the FloatingActionButton to disappear and sets its visibility to {@link #INVISIBLE}
 animate: if true - plays "hide animation"
- hideButtonInMenu (animate As Boolean)
 This will clear all AnimationListeners.
- hideProgress
- isHidden As Boolean
 Checks whether FloatingActionButton is hidden
 Return type: @return:true if FloatingActionButton is hidden, false otherwise
- isProgressBackgroundShown As Boolean
- isProgressIndeterminate As Boolean
 
 Return type: @return:the mProgressIndeterminate
- setProgress (progress As Int, animate As Boolean)
- show (animate As Boolean)
 Makes the FloatingActionButton to appear and sets its visibility to {@link #VISIBLE}
 animate: if true - plays "show animation"
- showButtonInMenu (animate As Boolean)
- toggle (animate As Boolean)
Properties:
- Background As Drawable
- ButtonSize As Int
 Sets the size of the FloatingActionButton and invalidates its layout.
- Color As Int [write only]
- ColorDisabled As Int
- ColorNormal As Int
- ColorPressed As Int
- ColorRipple As Int
- Elevation As Float [write only]
- ElevationCompat As Float [write only]
 Sets the shadow color and radius to mimic the native elevation.
 
 API 21+: Sets the native elevation of this view, in pixels. Updates margins to
 make the view hold its position in layout across different platform versions.
- Enabled As Boolean
- Height As Int
- HideAnimation As Animation [write only]
- IconDrawable As String [write only]
- ImageDrawable As Drawable [write only]
- Indeterminate As Boolean [write only]
 Change the indeterminate mode for the progress bar. In indeterminate
 mode, the progress is ignored and the progress bar shows an infinite
 animation instead.
- LabelText As String
- LabelVisibility As Int
- Left As Int
- Max As Int
- Parent As Object [read only]
- Progress As Int [read only]
- ProgressBackgroundColor As Int
- ProgressColor As Int
- ProgressWidth As Int
- ShadowColor As Int
- ShadowRadius As Int
 Sets the shadow radius of the FloatingActionButton and invalidates its layout.
 
 Must be specified in density-independent (dp) pixels, which are then converted into actual
 pixels (px).
- ShadowXOffset As Int
 Sets the shadow x offset of the FloatingActionButton and invalidates its layout.
 
 Must be specified in density-independent (dp) pixels, which are then converted into actual
 pixels (px).
- ShadowYOffset As Int
 Sets the shadow y offset of the FloatingActionButton and invalidates its layout.
 
 Must be specified in density-independent (dp) pixels, which are then converted into actual
 pixels (px).
- ShowAnimation As Animation [write only]
- ShowProgressBackground As Boolean [write only]
- ShowShadow As Boolean [write only]
- Tag As Object
- Top As Int
- Visible As Boolean
- Width As Int
FloatingActionMenu
Events:
- onClick (obj As View)
- onMenuToggle (opened As Boolean)
Fields:
- ba As BA
Methods:
- BringToFront
- DesignerCreateView (base As PanelWrapper, lw As LabelWrapper, props As Map)
- Initialize (EventName As String)
- 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)
- addMenuButton (fab As FloatingActionButton)
- addMenuButton2 (fab As FloatingActionButton, index As Int)
- close (animate As Boolean)
- hideMenu (animate As Boolean)
 Makes the {@link #FloatingActionMenu} to disappear and sets its visibility to {@link #INVISIBLE}
 animate: if true - plays "hide animation"
- hideMenuButton (animate As Boolean)
 Makes the {@link FloatingActionButton} to disappear inside the {@link #FloatingActionMenu} and
 sets its visibility to {@link #INVISIBLE}
 animate: if true - plays "hide animation"
- isAnimated As Boolean
- isIconAnimated As Boolean
- isMenuButtonHidden As Boolean
- isMenuHidden As Boolean
- isOpened As Boolean
- open (animate As Boolean)
- removeAllMenuButtons
- removeMenuButton (fab As FloatingActionButton)
- showMenu (animate As Boolean)
 Makes the whole {@link #FloatingActionMenu} to appear and sets its visibility to {@link #VISIBLE}
 animate: if true - plays "show animation"
- showMenuButton (animate As Boolean)
 Makes the {@link FloatingActionButton} to appear inside the {@link #FloatingActionMenu} and
 sets its visibility to {@link #VISIBLE}
 animate: if true - plays "show animation"
- toggle (animate As Boolean)
- toggleMenu (animate As Boolean)
- toggleMenuButton (animate As Boolean)
Properties:
- ActivityHeight As Int [write only]
- ActivityWidth As Int [write only]
- Animated As Boolean [write only]
 Sets whether open and close actions should be animated
- AnimationDelayPerItem As Int
- Background As Drawable
- ClosedOnTouchOutside As Boolean [write only]
- Color As Int [write only]
- Enabled As Boolean
- Height As Int
- IconAnimated As Boolean [write only]
- IconAnimationCloseInterpolator As Interpolator [write only]
- IconAnimationInterpolator As Interpolator [write only]
 Sets the {@link android.view.animation.Interpolator} for FloatingActionButton's icon animation.
- IconAnimationOpenInterpolator As Interpolator [write only]
- IconToggleAnimatorSet As AnimatorSet
- LabelsCornerRadius As Int
- LabelsMargin As Int
- LabelsMaxLines As Int
- LabelsPaddingBottom As Int
- LabelsPaddingLeft As Int
- LabelsPaddingRight As Int
- LabelsPaddingTop As Int
- LabelsPosition As Int
- Left As Int
- MenuButtonColorNormal As Int
- MenuButtonColorPressed As Int
- MenuButtonColorRipple As Int
- MenuButtonHideAnimation As Animation [write only]
- MenuButtonLabelText As String
- MenuButtonShowAnimation As Animation [write only]
- MenuIconView As ImageView [read only]
- OpenDirection As Int
- Parent As Object [read only]
- Tag As Object
- Top As Int
- Visible As Boolean
- Width As Int

Known problems:
- I still don´t know what the problem is, but the first 2 FABs (FloatingActionButton) added to the FAM (FloatingActionMenu)will be ignored; they do not show in menu
But away from this it works fine here

If you want to donate for my work building the wrapper you can do it here:

panagiotisden2 · Feb 12, 2017

hello, ACbutton is always on top of the fam. i tryed to set the elevation to 4 and didnt work, even with elevation 10 its behind those buttons, what can i do to bring it to front?

Thanks in advance

MichalK73 · Feb 15, 2017

Does anyone had run his program FloatingActionMenu in addition to acting demo ?? I am doing everything as in the demo and I do not have an icon. I do not have any errors in the log.

SUB

B4X:

    Private FABs As List
    Private ikona As FloatingActionMenu

Sub Create_FAB
    FABs.Initialize
    ikona.ActivityHeight = 100%y
    ikona.ActivityWidth = 100%x

    ikona.Animated = True
    ikona.hideMenuButton(False)
    ikona.IconAnimated = True
    ikona.ClosedOnTouchOutside = True
    ikona.AnimationDelayPerItem = 25
    ikona.MenuButtonLabelText = "Plywajace menu"
    ikona.MenuButtonColorNormal = Colors.Blue
    ikona.MenuButtonColorPressed = Colors.Green
    'ikona.Invalidate
    '1 -ignore
    Dim btn1 As FloatingActionButton
    btn1.Initialize("fab")
    btn1.IconDrawable = "ic_accessibility"
    btn1.Color = Colors.Blue
    btn1.ColorDisabled = Colors.LightGray
    btn1.ColorNormal = Colors.Green
    btn1.ColorPressed = Colors.Magenta
    btn1.ColorRipple = Colors.White
    btn1.ButtonSize = 1
    btn1.ShowShadow = True
    btn1.showButtonInMenu(True)
    btn1.LabelText = "Mööp 1"
    ikona.addMenuButton(btn1)

    ' 2 -ignore
    Dim btn1 As FloatingActionButton
    btn1.Initialize("fab")
    btn1.IconDrawable = "ic_accessibility"
    btn1.Color = Colors.Blue
    btn1.ColorDisabled = Colors.LightGray
    btn1.ColorNormal = Colors.Green
    btn1.ColorPressed = Colors.Magenta
    btn1.ColorRipple = Colors.White
    btn1.ButtonSize = 0
    btn1.ShowShadow = True
    btn1.showButtonInMenu(True)
    btn1.LabelText = "Mööp 2"
    ikona.addMenuButton(btn1)
   
    'teraz dodajemy potrzebne plywajce przyciski
    'nowy klient
    Dim btn1 As FloatingActionButton
    btn1.Initialize("fab")
    btn1.IconDrawable = "ic_accessibility"
    btn1.Color = Colors.Blue
    btn1.ColorDisabled = Colors.LightGray
    btn1.ColorNormal = Colors.Green
    btn1.ColorPressed = Colors.Magenta
    btn1.ColorRipple = Colors.White
    btn1.ButtonSize = 0
    btn1.ShowShadow = False
    btn1.showButtonInMenu(True)
    'btn1.LabelVisibility = 1
    btn1.LabelText = "Dodaj nowego"
    ' 3 (First)
    ikona.addMenuButton(btn1)
    FABs.Add(btn1)
   
    'edycja klienta
    Dim btn1 As FloatingActionButton
    btn1.Initialize("fab")
    btn1.IconDrawable = "ic_accessibility"
    btn1.Color = Colors.Blue
    btn1.ColorDisabled = Colors.LightGray
    btn1.ColorNormal = Colors.Green
    btn1.ColorPressed = Colors.Magenta
    btn1.ColorRipple = Colors.White
    btn1.ButtonSize = 0
    btn1.ShowShadow = False
    btn1.showButtonInMenu(True)
    'btn1.LabelVisibility = 1
    btn1.LabelText = "Edytuj dane"
    ' 3 (First)
    ikona.addMenuButton(btn1)
    FABs.Add(btn1)
   
    'wystaw fakture dla klienta
    Dim btn1 As FloatingActionButton
    btn1.Initialize("fab")
    btn1.IconDrawable = "ic_accessibility"
    btn1.Color = Colors.Blue
    btn1.ColorDisabled = Colors.LightGray
    btn1.ColorNormal = Colors.Green
    btn1.ColorPressed = Colors.Magenta
    btn1.ColorRipple = Colors.White
    btn1.ButtonSize = 0
    btn1.ShowShadow = False
    btn1.showButtonInMenu(True)
    'btn1.LabelVisibility = 1
    btn1.LabelText = "Wystaw dokument"
    ' 3 (First)
    ikona.addMenuButton(btn1)
    FABs.Add(btn1)
   
    'wszystkie faktury klienta
    Dim btn1 As FloatingActionButton
    btn1.Initialize("fab")
    btn1.IconDrawable = "ic_accessibility"
    btn1.Color = Colors.Blue
    btn1.ColorDisabled = Colors.LightGray
    btn1.ColorNormal = Colors.Green
    btn1.ColorPressed = Colors.Magenta
    btn1.ColorRipple = Colors.White
    btn1.ButtonSize = 0
    btn1.ShowShadow = False
    btn1.showButtonInMenu(True)
    'btn1.LabelVisibility = 1
    btn1.LabelText = "Wystawione dokumenty"
    ' 3 (First)
    ikona.addMenuButton(btn1)
    FABs.Add(btn1)
   
    ikona.OpenDirection = 0
    ikona.LabelsPosition = 0

    ikona.Invalidate
   
    ikona.showMenuButton(True)
End Sub

The logs when creating

B4X:

onMeasure(w1073742544,h1073743056)
W=720
H=1232
onMeasureAfter1(w0,h140)
onMeasureAfter2(w132,h236)
onMeasureAfter3(w132,h1170)
onMeasureAfter4(w132,h1170)
W=720
H=1232
l=0
t=0
r=132
b=1170
W=720
H=1232
onMeasure(w1073742544,h1073743056)
W=720
H=1232
onMeasureAfter1(w0,h140)
onMeasureAfter2(w132,h236)
onMeasureAfter3(w132,h1170)
onMeasureAfter4(w132,h1170)
W=720
H=1232
l=0
t=0
r=132
b=1170
W=720
H=1232
onMeasure(w1073742544,h1073743056)
W=720
H=1232
onMeasureAfter1(w0,h252)
onMeasureAfter2(w362,h348)
onMeasureAfter3(w362,h1170)
onMeasureAfter4(w362,h1170)
W=720
H=1232
l=0
t=0
r=362
b=1170
W=720
H=1232
onMeasure(w1073742544,h1073743056)
W=720
H=1232
onMeasureAfter1(w0,h364)
onMeasureAfter2(w362,h460)
onMeasureAfter3(w362,h1170)
onMeasureAfter4(w362,h1170)
W=720
H=1232
l=0
t=0
r=362
b=1170
W=720
H=1232
onMeasure(w1073742544,h1073743056)
W=720
H=1232
onMeasureAfter1(w0,h476)
onMeasureAfter2(w375,h572)
onMeasureAfter3(w375,h1170)
onMeasureAfter4(w375,h1170)
W=720
H=1232
l=0
t=0
r=375
b=1170
W=720
H=1232
onMeasure(w1073742544,h1073743056)
W=720
H=1232
onMeasureAfter1(w0,h588)
onMeasureAfter2(w426,h684)
onMeasureAfter3(w426,h1170)
onMeasureAfter4(w426,h1170)
W=720
H=1232
l=0
t=0
r=426
b=1170
W=720
H=1232

DonManfred · Feb 15, 2017

Upload a example project which shows the problem.
Better start a new Thread in the questionsforum and post your project there.

MichalK73 · Feb 15, 2017

Unless something here I'm starting to act.
On the form I CustomListView and FloatingActionMenu.
If they are both size (0,0,100% x 100% s) is not see FAM.
When I change my size CustomListView on, for example 70% y, then on the bottom I see the icon + FAM but as I press the menu comes from the CustomListView.

Is there a possibility to throw out the FAM on the front and was not entered in the bottom of the CLV ??

MichalK73 · Feb 15, 2017

Ok I found the cause.
First I need to set up the Create_FAB and then start the functions for CustomListView.
At the end I have to add "FAM.BringToFront" and everything works beautifully. Only in that order, I managed to run the FAM.
The application that is not as FAM on the window, you need to check the order by FAM was first created and finally give the "FAM.BringToFront"

gdeppi · Mar 6, 2017

DonManfred said:
i don´t know

Dont know if its better, but this is the other popularlib:
https://github.com/futuresimple/android-floating-action-button

i´ll make a wrap and we´ll see if it is better

Hi @DonManfred,

did You try to wrap this floating action menu Library ?

Giuseppe

BitsAndBytes · Jun 2, 2017

This library is full of bugs. Too bad because floating menu is one of the most usefull items in android, but now this is a mess. I am returning back to FAB 1.0

ZJP · May 2, 2018

Hi,

Thanks for this lib. Works well.

a) Since the 2 first buttons are not drawed this is not necessary to add the full parameters.

B4X:

    ' 1 not drawing
   Dim btn1 As FloatingActionButton
   btn1.Initialize("fab")
   fam.addMenuButton(btn1)
   ' 2 not drawing
   Dim btn1 As FloatingActionButton
   btn1.Initialize("fab")
   fam.addMenuButton(btn1)

If you do not use the shadow, you can use its color (for example) for detecting a menu number (instead of the label).

B4X:

   btn1.ShowShadow = False
   btn1.ShadowColor = 1 ' menu 1

...
   btn1.ShowShadow = False
   btn1.ShadowColor = 2 ' menu 2 etc etc ...

B4X:

Sub fam_onClick(obj As Object)
   fam.toggle(True)
End Sub

Sub fab_onClick(obj As Object)
   If obj Is FloatingActionButton Then
       Dim btn As FloatingActionButton = obj
       ToastMessageShow("Menu number = " & btn.ShadowColor, False)
       btn.LabelText = "Now, i can change dynamicaly the label" ' because it's not used for a test....
   End If
   'fam.toggle(False) ' or not...
End Sub

edit :

Shadow and menu.

B4X:

   Dim ShadowCol As Int = 123456

   btn1.ShowShadow = True
   btn1.ShadowColor = ShadowCol + 1 ' menu 1

...
   btn1.ShowShadow = True
   btn1.ShadowColor = ShadowCol + 2 ' menu 2 etc etc ...

B4X:

...
       ToastMessageShow("Menu number = " & (btn.ShadowColor - ShadowCol) , False)
...
End Sub

BarryW · Aug 9, 2018

How to add spaces between buttons and also can we adjust the extended buttons width and height

desof · Dec 20, 2018

How to add spaces between buttons and also can we adjust the extended buttons width and height

Gabino A. de la Gala · Dec 24, 2018

I've been sticking for a while trying to automatically adjust the Left property so that it is set as far to the right of the screen as possible, regardless of the size of the screen as well as its orientation.

Finally I have managed to understand a bit how the thing "works".

If the OpenDirection property can be set to 0, by default the button appears to the left of the whole and we can change the Left property without problem. (The only problem with which we will find later, is that if the button we can right to the whole, then we will cut the texts of the different options)

The problem arises when we can open the OpenDirection property to 1. Since in this case, even if the value of Left remains at 0, the button is actually shifted to the right as much as necessary so that later the texts of the different options appear complete .

That's fine, except when you want to put the menu button aligned to the right. Since to do it in an automatic way you will need to know the space "reserved" by the own liberia to be able to do a fam.left = 100% x - Reserved Space.

B4X:

onMeasure(w1073742424,h1073742744)
W=600
H=920
onMeasureAfter1(w0,h350)
onMeasureAfter2(w223,h398)
onMeasureAfter3(w223,h898)
onMeasureAfter4(w223,h898)
W=600
H=920
l=375
t=0
r=598
b=898
W=600
H=920
onMeasure(w1073742848,h1073742320)
W=1024
H=496
onMeasureAfter1(w0,h350)
onMeasureAfter2(w223,h398)
onMeasureAfter3(w223,h461)
onMeasureAfter4(w223,h461)
W=1024
H=496
l=799
t=0
r=1022
b=461
W=1024
H=496

I have been observing the logs and I have found these values that are generated every time the screen changes orientation, and that I think are the values that we need to know when adjusting the value of the LEFT.

And I think the interesting thing is what appears in: onMeasureAfter4 (w223, h461)

Being 223 what I have to subtract in the example with which I'm doing 100% tests x.

But of course, I see that watching the logs, but I do not know how to get it in execution time.

DonManfred · Jan 29, 2019

Sorry for the late reply; i simple missed it...

I can´t really answer or help here as i did loose the Source of this lib with my HDDCrash in 2017.
Unfortunatly i can not do anything.

If the lib is not doing what you need then i´m sorry but you need to find another library then.

B4A Library Floating Action Menu (FAM) and Floating Action Button (FAB)

Attachments

panagiotisden2

Active Member

MichalK73

Well-Known Member

DonManfred

Expert

MichalK73

Well-Known Member

MichalK73

Well-Known Member

gdeppi

Member

BitsAndBytes

Active Member

ZJP

Active Member

BarryW

Active Member

desof

Well-Known Member

Gabino A. de la Gala

Active Member

DonManfred

Expert

Similar Threads

B4A Library Floating Action Menu (FAM) and Floating Action Button (FAB)

Attachments

Active Member

Well-Known Member

Expert

Well-Known Member

Well-Known Member

Member

Active Member

Active Member

Active Member

Well-Known Member

Active Member

Expert

Similar Threads

Privacy & Transparency

Privacy & Transparency