Floating Action Button explained Thunkable AppInventor Makeroid AppyBuilder

What is Floating Action Button (FAB)?
A Floating Action Button is a floating component that appears or floats in the bottom right side of the screen. For one screen only one Floating Action Button is recommended, however you can place multiple Floating Action Button in one screen but we recommend do not place more than one Floating Action Buttons in one screen.
A Floating Action Button is used for a promoted action.

Note: Floating Action Button is not visible on the Phone Preview screen it will visible during Live Testing and when you Export your app.

It will works effectively if the Screen Orientation is set to Portrait otherwise the Floating Action Button may disappears.
You can change floating action button icons also.

Now let's see how to use this component.

Step 1
Just drag and drop the Floating Action Button Component in the app screen like the following picture shows.

Example:-


Step 2
Once you drag and dropped the
 Floating Action Button into app screen you will find the Floating Action Button in Components layout and click the Floating Action Button option there and you will find its properties in properties layout. Once you do that you will find the options to customise the Floating Action Button as your wish.

Also, it is a less customisable component.

Like the following picture shows all the customisable options Floating Action Button have.


Now let's know what customisable options does it have and how to use those options and know what are their uses.

1. This option is used to make time gap between two icons before changing from one icon to other. For example if Floating Action Button changes from One icon to another icon this option is used to make time gap between it changes to another icon. Example is as shown below.


2.This option is to change the background colour of the Floating Action Button.
3.This option is used to change the button size however you can only select two options one is Default and another one is Mini
4.This is used to change the icon colour
5.Here you have type the icon name you will find the icon names in online just search in search engine.
6.This option is used to change the Position of the Floating Action Button in Margin from
bottom edge of phone in dp.
7.This option is used to change the Position of the Floating Action Button in Margin from
right edge of phone in dp.
8.This is used whether the Floating Action Button should be appear or not by this option.

Tip:- That the maximum customisable option are also can be customised using the blocks in blocks editor we will explain about it in the upcoming posts.

Happy tHunking 😎😎

Post a Comment

0 Comments