lowcoder icon indicating copy to clipboard operation
lowcoder copied to clipboard

[Feat]: Floating button - enable fixed position and z-index by properties

Open Banbury opened this issue 1 year ago • 4 comments
trafficstars

Is there an existing issue for this?

  • [X] I have searched the existing issues

Current Behavior

The floating button acts like a element with absolute positioning. It doesn't float above the other components and it isn't fixed to the screen. Also the primary theme doesn't show the icon.

Expected Behavior

The floating button should always be displayed above all other components. It should stay in a fixed position on the screen, if the page is scrolled.

Steps to reproduce

  • Add a floating button to a page
  • Scroll the page
  • The button moves with the page
  • The button cannot be positioned above other components on the same page

Environment

Environment: Docker Version: 2.4.1-2.4.1 #fdffe017

Additional Information

No response

Banbury avatar Jul 05 '24 07:07 Banbury

Kindly, note that we need to add the "fixed", "position" and "z-Index" as style property on Float button component, so that users have an easier support to set this.

adnanqaops avatar Jul 05 '24 09:07 adnanqaops

I do think, that a button that is called Floating Button, should float by default. Otherwise you could just use a standard button.

Banbury avatar Jul 05 '24 09:07 Banbury

And I just noticed, that the primary style is white on white, which makes the icon invisible.

Banbury avatar Jul 05 '24 10:07 Banbury

We changed the Issue to a feature issue. Cause the Button by itself was pretty fine. Lowcoder offers a lot of flexibilities and your usecase (the most expected one indeed) is only one of many for the Floating Button. What we will do is to extend the floating button to have a UI in the Style Properties allowing easier to set your desired attributes. "Fixed position", "Z-Index" and "top / right / bottom / left" placement.

FalkWolsky avatar Jul 07 '24 09:07 FalkWolsky

+1

rxunique avatar Jan 23 '25 04:01 rxunique