People Goal 3 - Extra 1: Build the main detail screen - Autosizing

Document created by Kedar on Jan 28, 2015Last modified by mark_baum on Mar 6, 2015
Version 9Show Document
  • View in full screen mode


You’ve set up your layout beautifully, but what happens when the user resizes the window? Let’s explore autosizing, which provides a way to expand specific layout objects when the user increases the size of the window.

 

You can set objects to automatically resize or move horizontally or vertically when the FileMaker Pro window is resized. Horizontal settings also apply to Preview mode and printing when the page size is wider than the size of the layout being viewed or printed.

 

When layout objects are set to resize, they maintain a constant distance from the object to which they are anchored. This allows objects to move, expand, or contract when the FileMaker Pro window is resized.

 

Anchor points are either the layout margin or the container margin in which an object resides. By default, objects are anchored on both the top and left side of the layout or page.

 

The autosizing area is located on the Position tab of the Inspector. It provides four lockable anchor points.

Untitled.png

 

The Anchor Points

 

By default, the top and left anchor points are locked. This causes objects to be top- and left- aligned — what you’d normally expect.

 

It’s easier to show the results of the other possibilities.

 

Here’s a filled square object in the upper left of the body part, shown in Layout mode:

pasted-image.png

 

It always looks the same in Browse mode when the window is the same size as the body.

 

But when the user changes the size of the window, different autosize settings produce different results.

 

Left and top:  it stays in the same position, and the body doesn’t change in size.

 

Pic 3.png

 

Right and top: it starts to move to the right, and the body grows in width.

 

Pic 4.png

 

Left+Right and top:  it grows in width along with the body.

Pic 5.png

 

Only top: it starts to move to the right (but half as quickly as “right and top”), and the body grows in width. This setting will keep objects centered if they start out centered within the body.

Pic 6.png

 

The same principles apply to the top and bottom anchors.

 

The Example Solution

 

In the example solution, the portal has the top and bottom anchors set.

pasted-image-2.png

 

This causes the portal to expand vertically, adding rows when there are more to display.

Untitled 2.png

You can see that the same setting has been applied to the Notes field on the left-hand side of the layout. It’s also been applied to the colored rectangle in the background that defines the left-hand side of the layout.



Attachments

    Outcomes