Creating AppleScript Studio applications complete with interfaces is a great way to make your scripts user friendly, and allow users to specify information that affects how your script will behave. However, when lots of options are necessary, an interface can quickly become cumbersome. This is where tab views can become very handy. A tab view can allow you to organize your interface elements into structured groups of common elements, which can be navigated by a user selecting the appropriate tab.
Creating a Tab View
We’re going to walk through the process of interacting with a tab view in a few different ways. However, before we do this, we need to create an AppleScript Studio project that contains a tab view. This particular project will be used only to demonstrate how a tab view works. However, you can take the techniques that we will discuss here, and put them to more practical use within your own AppleScript Studio projects.
Begin by creating a new AppleScript Studio project in Xcode, using the AppleScript Application template provided by Apple. Name the project Tab View Example, and save it into the desired location on your hard drive.
Next, double click on the MainMenu.nib element within your project to open the project’s interface in Interface Builder. The MainMenu.nib window should now be displayed in Interface Builder. Double click on the Window instance within the MainMenu.nib window to display the project’s interface window, if it’s not already visible.
Click on the Cocoa Container Views button in the toolbar of the Palettes window (command + /). You should see a number of container objects, one of which is a tab view. See figure 1.
Figure 1: A Tab View Interface Element
Drag the tab view element from the Palettes window into the main interface window of your project. In the Attributes pane of the Inspector palette (command + 1), you can modify various attributes of the tab view, if desired, such as the number of tabs, whether the tabs are visible, and so forth. For this exercise, the tab view should have 2 visible tabs, which exist by default.
Like any other AppleScript Studio interface object, a tab view can be assigned event handlers via the AppleScript pane of the Inspector palette. Assign the awake from nib and will select tab view item event handlers to the tab view, and link them to the Tab View Example.applescript script in your Xcode project. See figure 2.
Figure 2: Assigning Event Handlers to a Tab View
With the tab view still selected in the interface window, you may navigate to a given tab by clicking on it. Once you’ve done this, you can drag other interface elements into that tab from the Palettes window. Select the first tab in the tab view. Change its title to Tab 1, and drag a text field into the tab. See figure 3. Also, assign an AppleScript name of tab1 to the tab. You do not need to assign any event handlers to the tab.
Figure 3: Preparing Tab 1 of the Example Project
Next, select the second tab in the tab view. Change its title to Tab 2, assign an AppleScript name of tab2 to the tab, and drag a button into the tab. See figure 4. Change the title of the button to Go to Tab 1, assign a clicked event handler to the button, and link it to the Tab View Example.applescript script in your Xcode project.
Figure 4: Preparing Tab 2 of the Example Project
Now the example interface for our project is complete, and we’re ready to begin working on the code. Save the interface, and click the Edit button at the bottom of the AppleScript pane of the Inspector window.
Targeting Objects Within a Tab View
When working with a tab view, interface elements aren’t placed within the tab view itself. Rather, they are placed within a given tab of the tab view. Because of this, they must be targeted via AppleScript within this enclosing structure.
In AppleScript Studio, tabs are denoted by the tab view item class, which is an element of the tab view class. The following example code demonstrates how to set the content of the text field that we added within the first tab of the tab view of our example interface. This same methodology would be used to target any other types of elements within a tab view item.
set content of text field 1 of tab view item 1 of tab view 1 of window 1 to "Some Text"
Setting the Selected Tab
Suppose you are creating a tab view within what will serve as a preferences window for your AppleScript Studio project. In cases like this, you may want your tab view to default to displaying a specific tab whenever the preferences window is opened. To ensure that this is the case, you will probably want to write code that will make sure that the desired tab view is displayed when the window is opened. This may be done by modifying the value of the current tab view item property of the tab view. Set the value of this property to a reference to the desired tab view item.
To demonstrate this, modify the awake from nib handler within your example project, as follows.
on awake from nib theObject
tell tab view 1 of window 1
set current tab view item to tab view item "tab2"
end tell
end awake from nib
When you build and run your project, the example code above should cause the second tab view item to become selected when the interface is loaded and displayed. Of course, if you wanted to use this code in the preferences window scenario that was previously mentioned, then you would want to perform this task whenever the code that displays the preferences window is executed.
Triggering Code when a Tab is Selected
Tab views can also be configured to respond to events when tabs are selected. In our example project’s interface, we have configured the tab view to respond to the will select tab view item event handler. This handler will be executed once the user has selected a tab, and that tab is about to be displayed in the interface. To illustrate the functionality of the will select tab view item handler, add the following code to your example project.
on will select tab view item theObject tab view item tabViewItem
if name of tabViewItem = "tab1" then
set theText to text returned of (display dialog "Please enter some text:" default answer "")
set content of text field 1 of tabViewItem to theText
end if
end will select tab view item
Next, build and run the project. When the interface is displayed, the second tab should be displayed automatically by the code in the awake from nib handler. Select Tab 1, and the will select tab view item handler will be called. The code within this handler will determine if the first tab was selected, based on its name. If the first tab was selected, then you will be prompted to enter some text. The contents of the text field in the first tab view item will then be set to the specified text. See figure 5.
Figure 5: A Populated Text Field in Tab View Item
Invisible Tab Views
In our example project, we’ve been working with a tab view that can be navigated by manually selecting the desired tab in the interface window. However, it is also possible for a tab view to have invisible tabs. This type of tab view is known as a tabless tab view, and can be useful when you need the ability to completely change the set of available interface elements within your project’s interface. Rather than adding all of the interface elements to the main interface, and then hiding/showing them as needed, you can organize them into the tabs of a tab view. These tabs can then be hidden, and displayed as needed via the code within your project.
To make the tabs of your example tab view invisible, select the tab view back in Interface Builder, and navigate to the Attributes pane of the Inspector palette. Next, select the Tabless radio button, and select the first Style button to hide the outline of the tab view. See figure 6.
Figure 6: Making a Tab View Tabless
Save the nib in Interface Builder, navigate back to Xcode, and modify the clicked handler within your project as follows.
on clicked theObject
tell tab view 1 of window 1
set current tab view item to tab view item "tab1"
end tell
end clicked
Next, build and run your example project. Again, the second tab should be displayed by the awake from nib handler. However, this time, the tab view outline and the tabs themselves should not be visible. See figure 7.
Figure 7: The Second Invisible Tab
Click the Go to Tab 1 button in the interface, and the will select tab view item handler should be called. You will be prompted to enter some text. Next, the first tab view should be displayed, and the text you specified should be entered into the text field within the first tab. See figure 8.
Figure 8: The First Invisible Tab
In Conclusion
Although in this month’s column, we didn’t build a very functional tab view, we did discuss how to construct a tab view, as well as how to target elements within it and execute code when tabs are selected. These techniques will probably meet most of the needs you will encounter when working with tab views. Of course, if you want to learn more about tab views, be sure to check out the AppleScript Studio Terminology Guide, found in Xcode’s help, as well as on the Apple Developer Connection website.
If you’re interested in downloading the Xcode project that was used for the examples discussed in this month’s column, you can do so from here.
Until next time, just script it!
-Ben Waldie