Skip to content

Hook to get the position, similar to useFlexSize() #84

@Prinzhorn

Description

@Prinzhorn

Essentially I need this:

const node = useFlexNode();
const { left, top } = node.getComputedLayout();

but

  1. This is in yoga-units (e.g, scaled by default x100)
  2. I don't think this is proper code for hooks, right? I'm not supposed to imperatively call getComputedLayout like this in a render function?

Why do I need this? My flex-items are buttons. Behind those buttons is the nested "page". The buttons use masks to show the page as you hover, since the page is actually "physically" behind the button. If you click the button you essentially fly through the button to the nested page. For buttons that are not perfectly in the center on the viewport I need to move the nested page. Right now it's only slightly offset by the flex style of the button, but since this is farther way I need to scale the position with the distance so you can properly look through the button and see the page (essentially a line from camera, through the center of the button to the center of the next page). Hence I need the position of each box item.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions