Is it possible to add Floating Actions inside a list
Question
Application Type
Mobile

Hi,

I have a list of bookings displayed on a page and i want to perform multiple actions on each booking like Delete, Update etc. I wanted to know if i can use a Floating Action inside each list item so that when someone clicks this icon, multiple options pops up and the user can choose which option out of the Floationg Action Items.

I believe it is not possible, but is there a way around to achieve this?

Thanks

 Hi Guys,

Any suggestions on this please?

Hi,

I have tried to add Floating action on each item of list but the floating item is stick to end of the screen like in screen shot, 

You can do it on details screen for single item,

Regards,

Komal

Thanks Komal. I kind of did it in this manner. But wanted to know if there is a different way to achieve it inside the list itself

Hi,

Please find attached OML , if it fits in your requirement.

Regards,

komal

FloatingDemo.oml

mvp_badge
MVP

Hello Learn It,

Hope you're doing well.


Why don't you create an icon for each line of your list? Something like this:


And when you click on that icon, you could (for example) open a popup with those multiple actions. Or show a Block with those actions where you need to pass the Id of the selected row. This way will allow you do perform those actions for the correct Id.


Hope that this helps you!


Kind regards,

Rui Barradas

Hi @Learn It,

There is work around to achieve this, You can use the popover menu where you can define different action as delete update. Please find attached OML for same.  You can apply some css to look more elegant.


Hope this helps, Thanks. 



TestApp.oml

Hi @Learn It


It is possible but is not a good approach to solve your needs.

You need to be careful with the mobile approach, I suggest to use an action sheet, preferentially the native, but you also have a similar component in Outsystems UI.

https://outsystemsui.outsystems.com/OutSystemsUIWebsite/PatternDetail?PatternId=2


It is simple to use and the user will have a better experience.



Best regards

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.