4

I've recently used floating-action-button (FAB) in each list-item (5 to 15 items vertically) because another list-view is to be inflated over that list-view and then only the FABs are visible for the respective list actions to be applied on the inflated list
FABs are used to meet the elevation guideline in the material design - but a confusion arises as there're many FABs.

In short, the question is - am I allowed to use FAB in each list-item to meet any other material guideline?
(The current UI looks good, but sorry that I can't post any screen-shot in any mean).

Improve this question

1 Answer 1

Reset to default
3

No. Floating Action Buttons or FAB represents the promary action of the screen, and therefore you'll have only one FAB since you can have only one Primary Action .

From Floating action button

Only one floating action button is recommended per screen to increase its prominence. It should represent only the most common action.

However, you can use the FAB to expand available secondary actions if needed, although depending on these actions, a menu icon would be more suitable

Improve this answer
4
  • 1
    There are exceptions however: Google maps app on iOS actually has 2 FABs (1 for navigate, 1 show my position on map). On the official Material Design page, Google says it is "not recommended" to have more than 1.
    – wintvelt
    Aug 28, 2016 at 15:29
  • That's why iI included the recommended part. However, the OP is asking about adding them on each and everylist item, whoch makes a big difference to just 2 on a screen
    – Devin
    Aug 28, 2016 at 16:38
  • You're right of course, one per item is definitely too much.
    – wintvelt
    Aug 28, 2016 at 17:36
  • One per list-item looked nice to all, but I got confused for the guidelines - hence the post :) Btw, thanks for the clarification - I'm gonna follow any other suitable UI.
    – Touhid
    Aug 29, 2016 at 6:11

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.