Hopefully, you have had time to check out some of the fantastic new features in FileMaker 16. One of the more useful features, from a development standpoint, is the Layout Objects palette. This shows you a hierarchy of objects placed on your layout, including fields, portals, buttons, web objects, rules, and shapes. Upon examination, one thing you might have noticed is that there are lot more objects on your layouts than you might realize. Place a few fields and buttons in a portal, and you can see it add up very quickly.
While the Layout Objects palette undoubtedly makes managing all of this easier, you may want to minimize the number of objects you are placing on your layout. Shapes, in particular, create a lot of clutter – especially if you are like me, and you like to use shaded and colorized areas to delineate different parts of your layout. This is a good technique to help users understand the logical hierarchy of their data by putting it together in chunks, or drawing attention to the more important data points.
Take a look at the layout below. How many objects do you think have been placed on this layout? How many parts are there? Go ahead, take a look. I’ll wait.
Now for the answer: zero. Zip. Nada. Zilch. Bupkis. There are absolutely no objects placed on the layout. Here’s what the Layout Objects palette looks like:
This was achieved by a relatively simple and obscure technique. In essence, we are exploiting a little-known quirk of the Parts definition. Everyone knows that any part can have a gradient applied to it. But did you know that a gradient, when the two color sliders are perfectly stacked on top of one another, creates a hard line between the two colors? Furthermore, did you know that you can have more than one set of gradient sliders on one part or object? That’s what I did here. Look closely at the slider for the header. At first glance, it might look like there are just two sliders, but there are actually four – two sets, each stacked on top of one another. One set consists of a black and a grey slider; the second consists of the same grey and blue. This gives us the same flat, sharp look that we would get from placing rectangle objects on the layout.
To add an additional slider to a gradient control, just hover your mouse over an empty area of the control. A green “+” circle will appear. Click to add the slider. You will need to do this twice to replicate the technique shown here and create three distinct areas of solid color using four sliders (note: you can have no more than five sliders total, so if you are hoping for four areas of color, too bad).
So how did we get the vertically divided area in the body part of the list view? I can’t tell you, it’s very advanced. Just kidding. It’s extremely simple, and requires only one step: by default, the angle of the gradient tool is set to 270º. This divides the gradient horizontally. By rotating the gradient angle control to 0º, we change to the desired vertical division.
Here’s another really cool thing about dividing a body part this way: by changing the colors of the gradient for the active state, we can change both of these color areas to whatever we want as the user hovers over the record. This is not easily achievable with a rectangle object placed on the layout.
There are some things you need to consider before applying this technique to your own layout. First of all, you can control the size of each section of color by moving a pair of sliders to a different location on the control. You will quickly find that the control is finicky, and you will see the colors flip-flop as you try to stack them up. Be patient, young padawan. You will learn to control them with practice. As for getting an exact measurement, guides are your friend. There is no numeric indicator of the sizing of the sections. Not only that, but resizing the part means resizing all of its gradient sections, and this can affect your design. Second, as soon as you place any object on your layout that is not limited in its anchoring to top and left only, you will find that your layout parts have become elastic in browse mode, and some wild resizing can take place. You may find a circumstance where this is a desirable behavior; so far, I have found no practical use for this. Contact me if you come up with one!
All in all, this can be a good technique if used sparingly and with forethought. Have fun!
