Six Fried Rice

Tab controls have added a wealth of options to FileMaker developers looking to better organize and present data to their clients. The only limitation is that the tabs could only be placed on the top of the tab controls isn’t always ideal. FileMaker 9 provides a much more powerful and interesting way of controlling your tabs.

The Tabless Tab Control

FileMaker 9 adds functionality that allows you to make that tabs on a tab control completely disappear. “Great Jesse…. What I am going to do with out the tabs? How am I ever going to switch from tab to tab?” Says Geoff. Well, slightly older Padawan learner, not only can you remove the tabs from the tab control but you can also create your own script/button driven tab interface! Exciting huh?

Once you are no longer limited to the same old tabs-across-the-top interface, you’re able to create some very interesting and dynamic layouts. And here’s how you do it.

Note: This technique was demoed at Devcon 2007 by Andy LeCates. Not really sure who he created for this one but whoever you are… good work

Naming your Tabs

The first part of the Tab-less Control process is to name your tabs. I’m actually not talking about the name that is displayed across the top of the tab but the name of the Tab Panel itself. Each individual tab panel in your control actually has it’s own name. To edit the name of your tab panel, you’ll need to open the Object Info window by selecting View >> Object Info. If you’ve never seen this window before this is what it looks like:

You’ll notice the Object Name input box at the top of the Object Info window. That’s the name we are looking for. Select each tab panel in your tab control and set the it’s Object Name. Feel free to use the same name that you used in the tab control setup window. We’re going to need this name later on, so I’ll come back to it, but for now let’s get ride of those tabs.

Note: I first saw this technique at Devcon 2007 when Andy LeCates did his his “Under The Hood” session. I’m not sure whom he created it with…. but if you’re that person. You’re the man.

The Zero Width Tab

FileMaker 9 introduces a new feature that allows you much deeper control over how your tabs appear on the layout. When you create a new tab control or go to Format >> Tab Control Setup after selecting an existing tab control, you should see the following updated dialog:

You’ll notice the addition of Tab Width option to the setup window. There are a couple of different options for the tab width but we here we are going to focus on the Fixed Width of: option. Select Fixed Width of: from the drop down list and you will see a new input box magically appear with another drop down list of it’s own.

The drop down allows you to specify which unit you want your tabs to be measured in: Pixels, Inches or Centimeters. I like Pixels, but for this project it really doesn’t matter because all you need to do is put a zero into the input box.

What we’ve done here is to tell Filemaker that we want the actual width of the tabs themselves to be zero. You’d think that would be it but we’re not quite to fully banishing the tabs into nothingness. When you OK out of the setup dialog you’ll probably notice that there are little slivers where your tabs used to be.

Yea my tab control looks pretty stupid I know… I’m not quite finished though.

Making the Tabs Disappear for Good

When FileMaker draws a tab control it actually adds a little bit of formatting to the tab control to give it the ol’ patented FileMaker Tab Control look. These formats are being applied to the tabs themselves and adding some addition garbage to our crafty tabless control. All we have to do now is get ride of that formatting and we’re golden.

The two formats that are applied are a one point bordering line and an embossed effect. Get ride of the of embossing by selecting none in the Effect drop down on your Status Area like so:

We’re almost there, let’s get ride of that little line that’s the last vestige of the tab. Just change the line thickness of the border to zero and you’re finished.

Note: You’ll notice that FileMaker still leaves some space at the top of the tab control for where the tabs should be rendered. To eliminate the space as much as possible, set the Font Size on the tab to 1 points.

Navigating Between Tabs

Now that the tabs are gone, we really don’t have a way of navigating between tabs and that is where our object names we created come in handy. It’s actually quite easy. All you need is the Go To Object[] script step and then name of the tab you want. So if your tab is cleverly named “tab1″, then select you the Go To Object[] script step, click specify and type in “tab1″ into the Object Name.

Simple.

You can either place this command in a script or just tie it straight to a button. You’re going to need a button for each tab you wish to navigate to. The beauty of this technique is that you can easily create any system of navigation you would like. If you want a neat little side bar that drives a tab control or maybe just a grip of buttons littered across the page go ahead. Once you are no longer limited to standard tabbed tab control, you can find some very interesting ways of displaying your data.

Oh yea… here’s a nice video to show the technique in action. Notice that I click erratically where tabs should be and nothing happens.