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.



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:



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.



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.