Chapter    15

Choosing Commands with Buttons

Every program needs to give the user a way to control the computer. In the old days, that meant knowing how to type the proper commands to make a program work, but with today’s graphical user interfaces, the easier way to control a program is to choose from a list of available commands. The simplest way to give a command to a program is through a button.

By displaying multiple buttons on the screen, a user interface offers multiple choices for the user at all times. Instead of memorizing cryptic commands, the user just needs to select a command by pointing at it with the mouse and clicking on it to choose it.

Xcode provides a variety of different types of buttons you can place on a user interface, but they all work the same way. A button represents a single command, and clicking on that button runs Swift code stored in an IBAction method.

To use buttons, just place them on a user interface (either a .xib or .storyboard file), modify the label to display the command you want the button to represent, and connect your button to Swift code through an IBAction method.

All buttons are based on the NSButton class defined in the Cocoa framework. While most buttons display text that can contain the command the button represents, some buttons don’t display text at all. Despite the differences in appearance, all buttons work the same and can be changed into another button type at any time. The different button types available are shown in Figure 15-1:

  • Push Button
  • Gradient Button
  • Rounded Rect Button
  • Rounded Textured Button
  • Textured Button
  • Recessed Button
  • Disclosure Triangle (does not display text)
  • Square Button (does not display text)
  • Help Button (does not display text)
  • Disclosure Button (does not display text)
  • Round Button (does not display text)
  • Bevel Button (does not display text)
  • Inline Button

9781484212349_Fig15-01.jpg

Figure 15-1. The different types of buttons you can place on a user interface

Buttons without titles take up less space but may appear cryptic because the user has no idea what that button might do. The square and bevel buttons are often used to display images that represent commands.

Modifying Text on a Button

For those buttons that display text, Xcode gives you two ways to modify a button’s text:

  • Double-click directly on the button’s text and edit the text.
  • Click on a button to select it, choose View image Utilities image Show Attributes Inspector, and edit the Title property as shown in Figure 15-2.

9781484212349_Fig15-02.jpg

Figure 15-2. The Show Attributes Inspector pane lets you edit the title of a button

To modify text on a button, you can open the Show Attributes Inspector pane and edit the Title property, or you can directly modify the title property in Swift code. To do this, you must first create an IBOutlet that represents your user interface button. Then modify the Title property in Swift using code like this:

@IBOutlet weak var myButton: NSButton!
myButton.Title = "New Text"

Underneath the Title property is an Alternate property, which you can also adjust using Swift code by storing text in a button’s alternateTitle property. The Alternate Title text only appears if a button’s Type property is set to Toggle or Switch as shown in Figure 15-3.

9781484212349_Fig15-03.jpg

Figure 15-3. Changing the Type property of a button

When a button’s Alternate Title text is non-empty and the button’s Type property is Toggle or Switch, clicking on a Toggle or Switch button alternates between showing the Title text and the Alternate Title text. To see how the Title and Alternate Title properties of a button work, follow these steps:

  1. From within Xcode choose File image New image Project.
  2. Click Application under the OS X category.
  3. Click Cocoa Application and click the Next button. Xcode now asks for a product name.
  4. Click in the Product Name text field and type ButtonProgram.
  5. Make sure the Language pop-up menu displays Swift and that no check boxes are selected.
  6. Click the Next button. Xcode asks where you want to store the project.
  7. Choose a folder to store your project and click the Create button.
  8. Click the MainMenu.xib file in the Project Navigator. Your program’s user interface appears.
  9. Click the ButtonProgram icon to display the window of your program’s user interface.
  10. Choose View image Utilities image Show Object Library. The Object Library appears in the bottom right corner of the Xcode window.
  11. Drag a Push Button and a Text Field on to the user interface window and resize both items so it looks like Figure 15-4.

    9781484212349_Fig15-04.jpg

    Figure 15-4. The user interface of the ButtonProgram

  12. Click on the Push Button and choose View image Utilities image Show Attributes Inspector. The Show Attributes Inspector pane appears in the upper right corner of the Xcode window.
  13. Click on the Type pop-up menu and choose Toggle.
  14. Click in the Title text field and type Change Me.
  15. Click in the Alternate text field and type Alternate Text.
  16. Choose Product image Run. Your user interface appears.
  17. Click on the Change Me button. Notice that the text on the button now displays Alternate Text.
  18. Click on the same button again. Notice that the text alternates between Change Me and Alternate Text.
  19. Choose ButtonProgram image Quit ButtonProgram.

Now let’s see how to modify the Title of a button by taking text from the text field and storing it in the Title property of the button by following these steps:

  1. Click on the MainMenu.xib file in the Project Navigator Pane.
  2. Click on the button ButtonProgram to make sure the user interface window appears to display the push button and text field.
  3. Choose View image Assistant Editor image Show Assistant Editor. The AppDelegate.swift file appears next to the MainMenu.xib file.
  4. Move the mouse pointer over the push button, hold down the Control key, and drag the mouse underneath the @IBOutlet line in the AppDelegate.swift file.
  5. Release the Control key and the mouse. A pop-up menu appears.
  6. Click in the Name text field and type myButton.
  7. Move the mouse pointer over the text field, hold down the Control key, and drag the mouse underneath the @IBOutlet line in the AppDelegate.swift file.
  8. Release the Control key and the mouse. A pop-up menu appears.
  9. Click in the Name text field and type changeText. You should now have created two IBOutlets that look like this:
    @IBOutlet weak var myButton: NSButton!
    @IBOutlet weak var changeText: NSTextField!
  10. Move the mouse pointer over the push button, hold down the Control key, and drag the mouse above the last curly bracket in the bottom of the AppDelegate.swift file.
  11. Release the Control key and the mouse. A pop-up menu appears.
  12. Click in the Connection pop-up menu and choose Action.
  13. Click in the Name text field and type changeTitle.
  14. Click in the Type pop-up menu and choose NSButton, then click the Connect button. Xcode creates an empty IBAction method.
  15. Modify this IBAction method as follows:
    @IBAction func changeTitle(sender: NSButton) {
        myButton.title = changeText.stringValue
        }

    This Swift code retrieves the text in the text field (the IBOutlet changeText) and stores it in the Title property of the button (the IBOutlet myButton).

  16. Choose Product image Run. Your user interface appears.
  17. Click in the text field and type Hello there!
  18. Click on the Change Me button. The Alternate Text appears on the button.
  19. Click the button again. The text from the text field now appears.
  20. Choose ButtonProgram image Quit ButtonProgram.

Adding Images and Sounds to a Button

Buttons typically display text that lists the command that the button represents. However, you can also display images on a button. This can be useful to create toolbar icons that display a descriptive icon that represents a command (such as showing a printer to represent the Print command). Images can appear on a button by themselves or with descriptive text.

Besides displaying images, buttons can also play sounds to give the user audio feedback. While most people might click a button using the mouse (or trackpad), some people might prefer using keystroke shortcuts, so you can also assign keystrokes to run an IBAction method linked to a particular button.

To add images to a button, you just need to modify the Image and/or the Alternate property directly underneath the Image property as shown in Figure 15-5.

9781484212349_Fig15-05.jpg

Figure 15-5. The Image and Alternate pop-up menus let you choose from a list of predefined images

You can also define an image to display on a button using the image and alternateImage properties of an NSButton. When defining an image to appear on a button, you can also choose the position of that image relative to any text that also appears on that image.

The Position property defines how an image appears with text where text is represented by a horizontal line and the image is represented by a square as shown in Figure 15-6.

9781484212349_Fig15-06.jpg

Figure 15-6. The Position property lets you align text and images on a button

The seven different positions from left to right are:

  • Text only
  • Image only
  • Image on the left and text on the right
  • Text on the left and image on the right
  • Text overlapping the middle of the image
  • Text underneath the image
  • Text above the image

To define a sound to play when the user clicks on a button, you can modify the Sound property as shown in Figure 15-7. (You may need to adjust the volume of your computer to hear the sound played when you click on a button.)

9781484212349_Fig15-07.jpg

Figure 15-7. The Sound property lets you choose a sound to play

To see how to add images and a sound to a button, follow these steps:

  1. Click in the MainMenu.xib file in the Project Navigator pane.
  2. Click on the push button on your user interface to select it.
  3. Choose View image Utilities image Show Attributes Inspector. The Show Attributes Inspector pane appears in the upper right corner of the Xcode window.
  4. Click in the Image pop-up menu and choose NSCaution.
  5. Click in the Alternate pop-up menu and choose NSComputer (see Figure 15-5).
  6. Click in the Position property to choose the icon (third from the left) that displays the image on the left and the text on the right (see Figure 15-6).
  7. Click in the Sound pop-up menu and choose a sound such as Frog.
  8. Choose Product image Run. Your program appears. Notice that the caution icon appears on the button.
  9. Click in the text field and type Hello there!
  10. Click the button. The text on the button displays the alternate text and plays your chosen sound. Each time you click on the button, it alternates between showing the Title and Image properties and the Alternate (Text and Image) properties.
  11. Choose ButtonProgram image Quit ButtonProgram.

Connecting Multiple User Interface Items to IBAction Methods

Typically you link one IBAction method to one user interface item such as a button. However, it’s possible to connect multiple items to a single IBAction method. When doing this, the IBAction method needs to know what user interface item called the IBAction method to run.

To identify a particular user interface item, you need to change the Tag property of each item linked to the same IBAction method. The Tag property can hold an integer value so you can use distinct Tag values to identify different user interface items.

Once you’ve given each user interface item a distinct Tag value, you can create an IBAction method normally using the Control-drag method from one user interface item into your Swift file. Then you use the same Control-drag method to connect the remaining user interface items to that existing IBAction method.

There’s no limit to the number of items you can link to the same IBAction method just as long as you use the Tag property to identify which user interface item called the IBAction method.

To see how to connect multiple items to a single IBAction method, follow these steps:

  1. From within Xcode choose File image New image Project.
  2. Click Application under the OS X category.
  3. Click Cocoa Application and click the Next button. Xcode now asks for a product name.
  4. Click in the Product Name text field and type MultipleProgram.
  5. Make sure the Language pop-up menu displays Swift and that all check boxes are clear and not selected.
  6. Click the Next button. Xcode asks where you want to store the project.
  7. Choose a folder to store your project and click the Create button.
  8. Click on the MainMenu.xib file in the Project Navigator Pane.
  9. Click on the MultipleProgram icon to make the window of the user interface appear.
  10. Drag a Push Button, Recessed Button, Inline Button, and Label on to the user interface and resize with width of the label as shown in Figure 15-8.

9781484212349_Fig15-08.jpg

Figure 15-8. The user interface of the MultipleProgram

At this point you have three different types of buttons on the window and a label. We’ll create a single IBAction method that all three buttons can run. When you click on a button, the label will display the button title to show you which button you just clicked on.

First, we’ll need to modify the Tag property of each button. The top button will have a Tag value of 0, the middle button will have a Tag value of 1, and the lowest button will have a Tag value of 2.

Then we’ll create an IBAction method that identifies the Tag property and displays the button’s title in the label. To do this, follow these steps:

  1. Click on the MainMenu.xib file in the Project Navigator pane.
  2. Choose View image Assistant Editor image Show Assistant Editor. Xcode displays the AppDelegate.swift file next to the user interface.
  3. Move the mouse pointer over the Label, hold down the Control key, and drag the mouse under the IBOutlet line in the AppDelegate.swift file.
  4. Release the Control key and the mouse button. A pop-up window appears.
  5. Click in the Name text filed, type displayLabel, and click the Connect button. You should have an IBOutlet as follows:
    @IBOutlet weak var displayLabel: NSTextField!
  6. Move the mouse pointer over the Push Button, hold down the Control key, and drag the mouse above the last curly bracket at the bottom of the AppDelegate.swift file.
  7. Release the Control key and the mouse button. A pop-up window appears.
  8. Click in the Connection pop-up menu and choose Action.
  9. Click in the Name text field and type displayButton.
  10. Make sure the Type pop-up menu displays AnyObject. If we wanted to limit the IBAction method only to buttons, we could change this to NSButton, but we want to let other user interface items connect to this IBAction method later.
  11. Click the Connect button. Xcode displays an empty IBAction method.
  12. Move the mouse pointer over the Recessed Button, hold down the Control key, and drag the mouse over the IBAction method until Xcode highlights the entire IBAction method as shown in Figure 15-9.

    9781484212349_Fig15-09.jpg

    Figure 15-9. Connecting to an existing IBAction method

  13. Release the Control key and the mouse button. Xcode connects the Recessed Button to the IBAction method.
  14. Move the mouse pointer over the Inline Button, hold down the Control key, and drag the mouse over the IBAction method until Xcode highlights the entire IBAction method.
  15. Release the Control key and the mouse button. Xcode connects the Inline Button to the IBAction method.
  16. Click the Recessed Button to select it and choose View image Utilities image Show Attributes Inspector. The Show Attributes Inspector pane appears in the upper right corner of the Xcode window.
  17. Scroll down to the View category, click in the Tag text field and type 1. (The Push Button has the default Tag value of 0, the Recessed Button will have a Tag value of 1, and the Inline Button will have a Tag value of 2.)
  18. Click on the Inline Button to select it.
  19. Scroll down to the View category, click in the Tag text field and type 2.
  20. Modify the IBAction method as follows:
    @IBAction func displayButton(sender: AnyObject) {
        if sender is NSButton {
            let whichObject = sender as! NSButton
            switch whichObject.tag {
            case 0:
                displayLabel.stringValue = "Clicked Push Button"
            case 1:
                displayLabel.stringValue = "Clicked Recessed Button"
            case 2:
                displayLabel.stringValue = "Clicked Inline Button"
            default:
                displayLabel.stringValue = "Unknown"
            }
        }
    }

    The sender: AnyObject code means that the IBAction method can connect to any type of user interface item. First, we’ll check if the sender (the user interface item that called the IBAction method) is an NSButton. If so, then we’ll cast the sender as an NSButton and assign that button to whichObject.

    Now we’ll use the tab property of whichObject to determine which button the user clicked using a switch statement. We’ll display the proper message in the label depending on which button the user clicked.

  21. Choose Product image Run. Your program’s user interface appears.
  22. Click on the three different buttons to see the proper message appear in the label.
  23. Choose MultipleProgram image Quit Multiple Program.

In this example, you connected multiple buttons to a single IBAction method. However, you can connect different user interface items to the same IBAction method as long as that IBAction method has (sender: AnyObject) as its parameter.

To see how another user interface item can connect to an IBAction method, follow these steps:

  1. Drag a Vertical Slider and place it anywhere on your user interface.
  2. Move the mouse pointer over the Vertical Slider, hold down the Control key, and drag the mouse over the IBAction displayButton method until Xcode highlights the entire IBAction method.
  3. Release the Control key and the mouse button. The IBAction method is now linked to the Vertical Slider.
  4. Modify the IBAction method so it looks like this:
    @IBAction func displayButton(sender: AnyObject) {
        if sender is NSButton {
            let whichObject = sender as! NSButton
            switch whichObject.tag {
            case 0:
                displayLabel.stringValue = "Clicked Push Button"
            case 1:
                displayLabel.stringValue = "Clicked Recessed Button"
            case 2:
                displayLabel.stringValue = "Clicked Inline Button"
            default:
                displayLabel.stringValue = "Unknown"
            }
        } else if sender is NSSlider {
            displayLabel.stringValue = "Dragged slider"
        }
    }

    The last else-if portion of the code checks if the sender is an NSSlider, which means the user dragged the vertical slider, which called the IBAction method. If the user dragged the vertical slider, then the code puts the string “Dragged slider” into the label.

  5. Choose Product image Run. Your user interface appears.
  6. Drag the vertical slider. Notice that “Dragged slider” appears in the label.
  7. Click on any button. Notice that the label now identifies which button you clicked. The buttons and vertical slider are all linked to the same IBAction method, which must determine which user interface item called the IBAction method to run.
  8. Choose MultipleProgram image Quit MultipleProgram.

Working with Pop-Up Buttons

Buttons can be handy for displaying commands on the screen, but if you need to offer several options, then having each button represent one command can get cumbersome and crowded. One option is to condense multiple options into a single pop-up button. A pop-up button takes less space and can provide a large number of options for the user to select.

To see how pop-up buttons work, follow these steps:

  1. From within Xcode choose File image New image Project.
  2. Click Application under the OS X category.
  3. Click Cocoa Application and click the Next button. Xcode now asks for a product name.
  4. Click in the Product Name text field and type PopupProgram.
  5. Make sure the Language pop-up menu displays Swift and that no check boxes are selected.
  6. Click the Next button. Xcode asks where you want to store the project.
  7. Choose a folder to store your project and click the Create button.
  8. Click the MainMenu.xib file in the Project Navigator. Your program’s user interface appears.
  9. Click the PopupProgram icon to display the window of your program’s user interface.
  10. Choose View image Utilities image Show Object Library. The Object Library appears in the bottom right corner of the Xcode window.
  11. Drag a Popup Button and a Label on to the user interface window and resize the width of the Label so it looks like Figure 15-10.

    9781484212349_Fig15-10.jpg

    Figure 15-10. The user interface of the PopupProgram

  12. Choose View image Assistant Editor image Show Assistant Editor. Xcode displays the AppDelegate.swift file next to your user interface.
  13. Move the mouse pointer over the label, hold down the Control key, and drag underneath the IBOutlet line in the AppDelegate.swift file.
  14. Release the Control key and the mouse. A pop-up window appears.
  15. Click in the Name text field, type labelChoice, and click the Connect button. Xcode creates an IBOutlet as follows:
    @IBOutlet weak var labelChoice: NSTextField!
  16. Move the mouse pointer over the pop-up button, hold down the Control key, and drag the mouse above the last curly bracket in the bottom of the AppDelegate.swift file.
  17. Release the Control key and the mouse. A pop-up window appears.
  18. Click in the Connection pop-up menu and choose Action.
  19. Click in the Name text field and type showChoice.
  20. Click in the Type pop-up menu and choose NSPopUpButton. Then click the Connect button. Xcode displays an empty IBAction method.
  21. Modify the IBAction method as follows:
    @IBAction func showChoice(sender: NSPopUpButton) {
        labelChoice.stringValue = sender.titleOfSelectedItem!
    }
  22. Choose Product image Run. Your user interface window appears.
  23. Click on the pop-up button. Notice that by default, a pop-up button contains three generic items labeled Item 1, Item 2, and Item 3.
  24. Click on an option. Notice that your chosen option appears in the label.
  25. Choose PopupProgram image Quit PopupProgram.

Modifying Pop-Up Menu Items Visually

A pop-up button contains a default list of three items. However, you can add, edit, or delete items from that list at any time. To edit a pop-up menu list, follow these steps:

  1. Double-click on the pop-up button on the user interface. The current list of menu items appears as shown in Figure 15-11.

    9781484212349_Fig15-11.jpg

    Figure 15-11. Double-clicking on a pop-up button displays its list of menu items

  2. Double-click on the menu item you want to edit. Xcode highlights the text of your chosen menu item as shown in Figure 15-12.

    9781484212349_Fig15-12.jpg

    Figure 15-12. Double-clicking on a menu item lets you edit the text

     Note  You can also choose View image Utilities image Show Attributes Inspector and edit the text of a menu item by editing the Title property of the selected menu item.

  3. Use the arrow keys, Backspace, or Delete key to edit the text and type any new text.
  4. Press Return. Xcode saves your edited text for the menu item.

To delete a menu item from a pop-up button, follow these steps:

  1. Double-click on the pop-up button on the user interface. The current list of menu items appears (see Figure 15-11).
  2. Click on the menu item that you want to delete. Xcode highlights your chosen menu item.
  3. Press the Backspace or Delete key. Your chosen menu item disappears.

 Note  If you delete a menu item by mistake, just press Command+Z or choose Edit image Undo to reverse the delete command.

To add a menu item to a pop-up button, follow these steps:

  1. Double-click on the pop-up button on the user interface. The current list of menu items appears (see Figure 15-11).
  2. Choose View image Utilities image Show Object Library. The Object Library appears in the bottom right corner of the Xcode window.
  3. Type menu item and press Return in the search field at the bottom of the Object Library. The Object Library displays a list of menu items as shown in Figure 15-13.

    9781484212349_Fig15-13.jpg

    Figure 15-13. The list of menu items in the Object Library

  4. Drag the Menu Item from the Object Library over the list of menu items stored in the pop-up button on the user interface.
  5. Release the mouse button. Xcode adds a menu item to the pop-up button list.

Adding Pop-Up Menu Items with Swift Code

As an alternative to modifying menu items in a pop-up button visually, you can also use Swift code to add, delete, or change a menu item. Pop-up button menu items are based on the NSMenuItem class, but you can find the methods you need to manipulate a list of pop-up button menu items in the NSMenu class.

If you want to add just one new menu item to a pop-up button, you can use the addItemWithTitle method and specify a string such as:

myPopUp.addItemWithTitle("New Item")

You can also add a list of new menu items by storing them in an array and using the addItemsWithTitles method such as:

myPopUp.addItemsWithTitles(["Cat", "Dog", "Bird", "Fish", "Reptile"])

You can remove individual menu items using the removeItemAtIndex method that needs an Int value to define which item to remove. The first item in a pop-up menu list is at index 0, the second at index 1, and so on.

To remove all items in a pop-up button’s menu list, just use the removeAllItems() method, which clears out the entire list no matter how many (or how few) items may be currently stored in that list.

To see how to use Swift code to add and delete items from a pop-up button menu list, follow these steps:

  1. From within Xcode choose File image New image Project.
  2. Click Application under the OS X category.
  3. Click Cocoa Application and click the Next button. Xcode now asks for a product name.
  4. Click in the Product Name text field and type EditPopProgram.
  5. Make sure the Language pop-up menu displays Swift and that no check boxes are selected.
  6. Click the Next button. Xcode asks where you want to store the project.
  7. Choose a folder to store your project and click the Create button.
  8. Click the MainMenu.xib file in the Project Navigator. Your program’s user interface appears.
  9. Click the EditPopProgram icon to display the window of your program’s user interface.
  10. Choose View image Utilities image Show Object Library. The Object Library appears in the bottom right corner of the Xcode window.
  11. Drag a PopUp Button, three Push Buttons, and a Text Field on to the user interface window and edit the titles on both push buttons so it looks like Figure 15-14.

    9781484212349_Fig15-14.jpg

    Figure 15-14. The user interface of the EditPopProgram

  12. Choose View image Assistant Editor image Show Assistant Editor. Xcode displays the AppDelegate.swift file next to your user interface.
  13. Move the mouse pointer over the pop-up button, hold down the Control key, and drag the mouse underneath the IBOutlet line near the top of the AppDelegate.swift file.
  14. Release the Control key and the mouse. A pop-up window appears.
  15. Click in the Name text field and type myPopUp. Then click the Connect button. Xcode creates an IBOutlet.
  16. Move the mouse pointer over the text field, hold down the Control key, and drag the mouse underneath the IBOutlet line near the top of the AppDelegate.swift file.
  17. Release the Control key and the mouse. A pop-up window appears.
  18. Click in the Name text field and type newItem. Then click the Connect button. Xcode creates another IBOutlet so you should have two IBOutlets that look like this:
    @IBOutlet weak var myPopUp: NSPopUpButton!
    @IBOutlet weak var newItem: NSTextField!
  19. Move the mouse pointer over the Add New Item button, hold down the Control key, and drag the mouse above the last curly bracket at the bottom of the AppDelegate.swift file.
  20. Release the Control key and the mouse. A pop-up window appears.
  21. Click in the Connection pop-up menu and choose Action.
  22. Click in the Name text field and type addNewItem.
  23. Click in the Type pop-up menu and choose NSButton. Then click the Connect button. Xcode creates an empty IBAction method.
  24. Move the mouse pointer over the Delete First Item button, hold down the Control key, and drag the mouse above the last curly bracket at the bottom of the AppDelegate.swift file.
  25. Release the Control key and the mouse. A pop-up window appears.
  26. Click in the Connection pop-up menu and choose Action.
  27. Click in the Name text field and type deleteFirstItem.
  28. Click in the Type pop-up menu and choose NSButton. Then click the Connect button. Xcode creates an empty IBAction method.
  29. Move the mouse pointer over the Add New List button, hold down the Control key, and drag the mouse above the last curly bracket at the bottom of the AppDelegate.swift file.
  30. Release the Control key and the mouse. A pop-up window appears.
  31. Click in the Connection pop-up menu and choose Action.
  32. Click in the Name text field and type addList.
  33. Click in the Type pop-up menu and choose NSButton. Then click the Connect button. Xcode creates another empty IBAction method.
  34. Modify all three IBAction methods as follows:
    @IBAction func addNewItem(sender: NSButton) {
        myPopUp.addItemWithTitle(newItem.stringValue)
    }

    @IBAction func deleteFirstItem(sender: NSButton) {
        myPopUp.removeItemAtIndex(0)
    }
    @IBAction func addList(sender: NSButton) {
        myPopUp.removeAllItems()
        myPopUp.addItemsWithTitles(["Cat", "Dog", "Bird", "Fish", "Reptile"])
    }

    The addNewItem IBAction method takes text from the text field and uses the addItemWithTitle method to add that text as a new menu item in the pop-up button list. The deleteFirstItem IBAction method uses the removeItemAtIndex method to delete the first menu item in the pop-up button’s list. The addList IBAction method uses the removeAllItems method to clear out the current list in the pop-up button, then replaces it with a new array of strings.

  35. Choose Product image Run. Your user interface appears.
  36. Click on the pop-up button. Notice that the menu item list displays three items labeled Item 1, Item 2, and Item 3.
  37. Click the Delete First Item button.
  38. Click on the pop-up button. Notice that the menu item list now displays only two items labeled Item 2 and Item 3.
  39. Click in the text field and type My Item.
  40. Click the Add New Item button.
  41. Click on the pop-up button. Notice that now the menu item list displays three items labeled Item 2, Item 3, and My Item.
  42. Click the Add New List button.
  43. Click on the pop-up button. Notice that now the menu item list displays the array of strings defined inside the addList IBAction method.
  44. Choose EditPopProgram image Quit EditPopProgram.

Summary

Buttons represent commands that users can click on to choose an option. Xcode offers several different types of buttons you can place on a user interface, but they’re all based on the same NSButton class defined in the Cocoa frameworks.

Not all buttons display text, but those buttons that do display text use a Title property to hold text. If you want to display an image on a button, you can define an image using the Image property. If you change the Type property of a button to Switch or Toggle, then you can make a button display text stored in the Title property along with text displayed in the Alternate Text property and/or the Alternate Image property as well.

If you need to offer multiple options to the user, placing more than a handful of buttons on the user interface can get messy and cluttered. A simpler alternative is to use a pop-up button instead that displays a list of options that you can modify visually or through Swift code.

Buttons often connect to a single IBAction method, but you can link multiple buttons (or other user interface items) to a single IBAction method. When connecting multiple user interface items to an IBAction method, you need to use Swift code to identify the user interface item that called the IBAction method. Buttons represent the most straightforward way to offer users an option to select.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset