FMLayoutMode.com

I briefly tried to think of a title for this post that made some sort of Viagra joke (you know, with objects getting bigger), but couldn’t think of anything clever. That’s your loss, I’m afraid: What this world really needs is more Viagra jokes.

Anyhow, one of the many cool options that FileMaker came out with a couple versions ago — in FileMaker 9 — was auto-resizing. This gives the developer the ability to specify what layout objects should grow — and in what directions — as the user increases the size of the window.

So let’s apply some auto-resizing to our current layout. If you look at our current layout, you’ll notice that I have the window wrapped tightly around the layout objects. Looks kind of nice like that, eh?

However, if I grab the bottom right corner of that window, dragging down and to the right, here’s what happens:

Up until FileMaker 9 came out, this was the norm. Now the auto-resize feature is turned on in the Inspector in FileMaker 11 … so nowadays, having your layout behave this way is definitely not cool.

Let’s do something about it. Time to enter the magical land of Layout Mode.

Okay, so let’s have a closer look at the Inspector:

If you go to the Inspector’s Position tab, and look at the Autosizing area, that’s the cat we’re working with. All along, I’ve been calling this “auto-resizing” (which is what it’s called in the Help file as well), but on the Inspector, it’s called “autosizing”. I’ve never noticed this before, but I like “auto-resizing” better — since we’re talking about how it changes size when the window does.

Enough of that.

So, you’ll notice that there is a white box on the Inspector, with a lock icon on each of the four sides. That all sits inside a black box.

Those four sides of the white box represent the layout object. The four sides of the black box represent the four sides of the window.

When you click one of the locks, that side of the object is tied to that side of the window. All new objects are created with a default of the left and top locks clicked, which behaves the way you are used to from FileMaker: nothing happens when the window is increased in size.

Let’s start out by selecting the tabs. When you look at the Inspector, you’ll see that the default top and left locks are clicked. we’ll click the other two now, leaving the Autosizing section of the Inspector looking like this:

So this says that all four sides of the tab object will stay relative to the sides of the window, as it is “embiggened” (to quote Jebediah Springfield). Have a look:

I have made the window bigger. See how the tab panel object is bigger now too? The top and left parts stayed where they were; the object stretched so that the bottom will stay up against the bottom of the window; the object also stretched horizontally so that the right edge will stay up against the right of the window.

Now that’s pretty cool. But you already knew that, didn’t you Smarty-pants?

Back to Layout Mode, friends.

Click on the Project tab, and select the portal (just the portal, none of the stuff in it). The top and left locks have been clicked. Let’s click the bottom and right ones as well. We’ll select the blue box that holds the field labels in it, and click the right lock. Not done yet.

Now select the deliveryDate field, and its field label. Click the right lock on, and the left one off.

Last one: Select the projectName field and click its right lock on. Now go into Browse Mode and have a look. Here’s what the layout looks like when the window is at its smallest size:

Now let’s make this window a little taller and wider. The results:

You’ve gotta love that! Here’s what happened:

1. The portal and field label box get wider, because they are “locked” to the left and right side.
2. The portal is taller (with more portal rows — cool!), because it’s locked to the top and bottom of the window.
3. The deliveryDate field and its label moved right, because they are locked to the right side, only.
4. The projectName field is wider.

So all of that gives our users a couple of things: They can see more portal rows just by making the window taller. They can see more of the project name (in case it is an especially long one) by making the window wider.

A couple final things:

• Since the “Go to client list” link is kind of married to the right side of the screen, we may want to lock it to the top and right side. That will move it to the right as the window gets wider.
• Of course, we would need to do all this stuff to the Invoice portal as well.

Notes:

1. If you had selected one of the fields that are inside the portal, and locked it to the top and bottom of the window, then the height of the portal rows would change — instead of showing more portal rows.
2. What do you think happens if you turn off all the locks for an object? Give it a try; it’s pretty cool.

Paul Spafford
FMLayoutMode.com
Spafford Data Solutions