How-to make a FAB.ulous menu on Android

FAB.ulous is a lightweight Kotlin library that help build a FAB menu from a menu XML and customize the pattern you want!

Install

GitHub page:

Fueled/fab.ulous

Simply follow the JitPack instructions.

JitPack | Publish JVM and Android libraries

Getting Started

To set up a FAB.ulous menu you need at least 3 things:

• A FloatingActionButton Widget that will be the base for the menu.
• A menu XML to build the menu from.
• A FabulousPattern that will position the menu items on the screen.

Now you can capture clicks in onOptionsItemSelected:

Create a custom menu pattern

Simply implement the FabulousPattern:

• getFinalPosition Contains the algorithm that will compute each menu item final position on the screen.
• getOpeningAnimation Contains the animation to play when the menu opens.
• getClosingAnimation Contains the animation to play when the menu closes.

Extra Features

Add Overlay

Adding an overlay when the menu opens is very simple; add the view to your layout and let FAB.ulous know about it using setFabOverlay.

Add a transition on the main FAB

You might want to add some extra animation/transition on the main FAB when you open/close the menu. Simply create a class that implements FabulousTransition and then pass an instance of that class using setFabTransition.

Add an extra listener when you click on the main FAB

If you want to add an extra OnClickListener, for example, in order to track the event, simple pass a View.OnclickListener to setFABOnClickListener.