Anchor component in coordinate container

Ignition Early Access
1

Hi
I need to anchor some component to button right corner of view so if user extend the browser it always anchor at right button corner like app bar icon.
How can I do that in perspective?

2

There are several ways to do this, but it all depends on the layout of your View.

One easy way:

  1. Construct your View with a Flex Container (props.direction set to column).
  2. Place what you would like as your “primary” container type first (in the attached View I used a Column Container); we will call this the “Primary” container for this example.
  3. Now Place a second Flex Container, and set this Flex Container’s props.direction to “column-reverse”.
  4. Set the position.basis for this Flex Container to whatever height you want your Button to have.
  5. Deep-select this child Flex Container and place a third Flex Container, and set this Flex Container’s props.direction to “row-reverse”.
  6. Deep-select the third Flex Container we just placed and place a button into it.
  7. Now go all the way back to the “Primary” container you placed into your root container, and set position.grow to 1.

Your structure should look like this:
59%20AM

Here’s the View I constructed:
view.json (1.6 KB)

4 Likes