Bottom Material Navigation Bar

I want to ask community members if someone knows whether this type of Bottom Navigation Bar can be made in Kodular or not.

because I tried making it with bottom navigation bar and fab component it works well and somehow looks like this but the problem is fab button does’nt stick to centre of the screen and if I set it’s margins according to my device it comes to centre but when I tested on another device fab’s position looks awkward .
see here:-

Use fab…
Floating Action Button

1 Like

As @OfficialDjJohn said, use bottom navigation component and floating action button.

1 Like

I think you did’nt read my post completely here it is :-

1 Like

And how do you calculate to get it in the center

/Boban

1 Like

I think you need a canvas with fill parent width and simply divide canvas1.with by 2 for right margin.

It won’t fit in the middle … to fit the middle we had to know the correct size of the FAB and then do (screen width + Fab size) / 2.

5 Likes

/Boban

2 Likes

Bingo! I almost got to the correct point! :joy:

4 Likes

I got it to the center with this:

This is what it looks like
https://drive.google.com/file/d/1EXYJLkXpsBSzElAeUZbDFTkN-OJvElsg/view?usp=sharing

4 Likes

By calculating screen width and dividing it by 2, but I forgot to remove fab size from it, let me try your method and see how it works

2 Likes

Is it my topic? Yes, this is my topic :joy:

4 Likes

Damn, I didn’t even noticed that :rofl::joy:

/Boban

3 Likes

here you go again:
https://community.kodular.io/t/free-bottom-app-bar-extension-v1-beta/64897