Carrie’s Notes – Meeting 5

Palace Coffee, 2/24/19, 1:00 – 2:30

Attendees: Mark Nair, Kenneth Jackson, Carrie Zinck.

Topics

Protocols:

• Swift is a protocol-driven object language.
• A protocol is like a set of parameters and rules for an event. (Like plates on a banquet table for a foreign ambassador.)
• In tables, there are protocols that are automatically adopted. Once adopted, they pop up in the prompts.

Customizing a table

1. Pull up existing (completed) example from the last meeting (restaurant list with icons).
2. The prototype cell handles the customization of all the following cells
3. Main Storyboard – click the data cell.
4. Go in the Attributes Inspector.
5. Change Style to Custom. (Lets us customize it.)
6. Go to Style Inspector. Change row height to 82.
7. We will bring in our own image. Go to Library >> ImageView.
8. Browse for an Image View object and drag it to the prototype cell.
9. Resize the image view to fit. 60 x 60, the spacing of 14 and 10
10. Want to include name, type, and location. Add a label to the cell. Name it Name. On font, make it Headline view. Change to dark gray.
11. Add labels for location and type to the cell. Style is the subhead.
12. Command-click all three labels. At the bottom, click Embed In -> Stack.
13. Open Attribute Editor for the new stack view. Change spacing to 1.
14. Command-click stack view and image view, Embed In -> Stack.
15. Attribute Info on the new stack: change spacing to 15.
16. On folder view, select Image View. Hold down Control and drag the mouse to the right margin. Hold down Shift to select Width and Height. We have now told Image View to constrain height and width to 60. If you select the height constraint and look on the Attribute Inspector, it will show 60 under Constant. This is important because that’s where we can edit it.
17. Go to the upper Stack View. Go to Add New Constraints. 6 on left,0 on others, and Constrain to Margins. This sets the width of the labels appropriately.
18. How do we change the info in the cell? We need to make a new class that tells this cell what is happening. Not the content—just tells the cell what is going on. It tells the labels how to change
    1. New File -> Cocoa Touch. RestaurantTableViewCell, subclass of UITableViewCell.
    2. Open RestraurantTableViewCell.swift.
       1. Inside the class, we will define our outlet. @IBOutlet var name:Label: UILabel! This is how we will make the connection.
       2. In Main Storyboard, select datacell -> Identity Inspector ->Class -> RestaurantTableViewCell.
       3. Now we can build our connections.
       4. Alternate path: control-drag from each label and the imageto the RestaurantTableVIewCell.swift file; set up an outlet for each.
       5. Now we need to update the View Controller. Go to RestaurantTableViewController.
          1. Where we dequeue the reusable cell, we must downcast to convert the object of dequeue reusable cell to restauranttableviewcell. Add “as! RestaurantTableViewCell” to the end of the “let cell =tableview.dequeue….” line.
          2. In the “configure the cell” section, we need to handleall three labels.
          3. Change the textLabel to nameLabel and imageView to thumbnailImageView.
          4. Run it. Success!

Making the images circular on a cell

1. Go to Main Storyboard. Image View, Identity Inspector, User Defined Runtime Attributes. +, layer.cornerRadius, type Number, value 30.
2. Attributes Inspector, check Clip to Bounds.
3. Run it. Success!

Handling the location and type:

1. Create arrays for location and type.
2. Copy the statement for Name and change the variables.
3. Run it. Success!

Activating a cell:

Protocol: when selected, do this. Mark will add code to Slack to demonstrate this.

Did set: Setters and Getters

• Run an action based on the change of a variable. Need to discuss later.

Closures

Need to discuss later.