{"id":678,"date":"2014-06-06T12:22:49","date_gmt":"2014-06-06T18:22:49","guid":{"rendered":"http:\/\/jamesonquave.com\/blog\/?p=678"},"modified":"2015-04-16T18:10:47","modified_gmt":"2015-04-17T00:10:47","slug":"developing-ios-8-apps-using-swift-interaction-with-multiple-views","status":"publish","type":"post","link":"https:\/\/jamesonquave.com\/blog\/developing-ios-8-apps-using-swift-interaction-with-multiple-views\/","title":{"rendered":"Developing iOS 8 Apps Using Swift – Interaction with multiple views (Part 6)"},"content":{"rendered":"

This section completely updated to reflect changes in Xcode 6.3, as of April 16, 2015<\/i><\/strong><\/b><\/p>\n

In parts 1 through 5 we went over some basics of Swift, and set up a simple example project that creates a Table View and a puts some API results from iTunes inside of them. If you haven’t read that yet, check out Part 1<\/a><\/p>\n

If not, and you just want to start from here, download the code for Part 5<\/a> to get started. We’ll use it as a template to begin.<\/p>\n

In this tutorial we’re going to do quite a few things, so let’s get started!<\/p>\n

Modifying The API Controller code<\/strong><\/p>\n

First off, our actual plan for this app is to show iTunes music information. So let’s modify the API controller to better handle this information.<\/p>\n

One thing’s been bothering me though. When we create our APIController, we set a delegate after it’s created. But, an API Controller without a delegate isn’t all that useful, so why even offer the option to make one?<\/p>\n

Let’s add a constructor that accepts the delegate as it’s only argument.<\/p>\n

\r\ninit(delegate: APIControllerProtocol) {\r\n    self.delegate = delegate\r\n}\r\n<\/pre>\n
Now, our delegate variable in the APIController isn’t actually going to be an optional any more. There is no APIController without a delegate!
\nSo also change the delegate property to be an every day, non-optional APIControllerProtocol object.<\/p>\n
\r\nvar delegate: APIControllerProtocol\r\n<\/pre>\n
There’s also going to be an error at the end of the searchItunesFor method, because we’re treating the delegate object as an optional, but it’s not optional any more. So change the erroneous line to say this:<\/p>\n
\r\nself.delegate.didReceiveAPIResults(results)\r\n<\/pre>\n
The only difference is we removed the ? from after the delegate property, to indicate it’s not an optional.<\/p>\n
Now in our SearchResultsController, we need to change a few things. First, since the APIController constructor now needs the delegate object to be instantiated before *it* can be instantiated itself, we need to make it an implicitly unwrapped optional, and wait until viewDidLoad to assign it.<\/p>\n
So in the api variable declaration change to this:<\/p>\n
\r\nvar api : APIController!\r\n<\/pre>\n
In the viewDidLoad method we need to unwrap the api object in order to call searchItunesFor(). You should end up with this<\/p>\n
\r\noverride func viewDidLoad() {\r\n    super.viewDidLoad()\r\n    api = APIController(delegate: self)\r\n    api.searchItunesFor(\"JQ Software\")\r\n}\r\n<\/pre>\n
 <\/p>\n
Searching for Albums<\/strong>
\nLet’s also modify our call to the searchItunesFor() in the APIController to use a search term for music. We’ll also show a networkActivityIndicator, to tell the user a network operation is happening. This will show up on the top status bar of the phone.<\/p>\n
\r\noverride func viewDidLoad() {\r\n    super.viewDidLoad()\r\n    api = APIController(delegate: self)\r\n    UIApplication.sharedApplication().networkActivityIndicatorVisible = true\r\n    api.searchItunesFor(\"Beatles\")\r\n}\r\n<\/pre>\n
Now in our urlPath in the APIController, let’s modify the API parameters to look specifically for albums.<\/p>\n
\r\nlet urlPath = \"https:\/\/itunes.apple.com\/search?term=\\(escapedSearchTerm)&media=music&entity=album\"\r\n<\/pre>\n
We’ll now get results in the form of Album data, but this schema is a little different from apps. In fact running the app right now will we’ll just get default cells because the expected JSON data isn’t there. This is really fragile code, but we can make it slightly less fragile by doing some modeling of the data we expect.<\/p>\n
Creating a Swift model for iTunes Albums<\/strong><\/p>\n
In order to facilitate passing around information about albums, we should create a model of what an album is exactly. Create a new swift file and call it Album.swift with the following contents:<\/p>\n
\r\nimport Foundation\r\n\r\nstruct Album {\r\n    let title: String\r\n    let price: String\r\n    let thumbnailImageURL: String\r\n    let largeImageURL: String\r\n    let itemURL: String\r\n    let artistURL: String\r\n    \r\n    init(name: String, price: String, thumbnailImageURL: String, largeImageURL: String, itemURL: String, artistURL: String) {\r\n        self.title = name\r\n        self.price = price\r\n        self.thumbnailImageURL = thumbnailImageURL\r\n        self.largeImageURL = largeImageURL\r\n        self.itemURL = itemURL\r\n        self.artistURL = artistURL\r\n    }\r\n}\r\n<\/pre>\n
It’s a pretty simple struct, it just holds a few properties about albums for us. We create the 6 different properties as strings, and add an initializer that sets all the properties based on our parameters.<\/p>\n
So now we have a struct for albums, let’s use it!<\/p>\n
Using our new Swift Album model<\/strong><\/p>\n
Back in our SearchResultsController, let’s modify the tableData array variable, and instead opt for a Swift native array for Albums. In swift, this is as easy as:<\/p>\n
\r\nvar albums = [Album]()\r\n<\/pre>\n
We can do away with do line var tableData = []<\/strong>, we won’t be using that any more.<\/p>\n
This creates an empty array containing strictly Albums. We’ll now need to change our tableView dataSource and delegate methods to understand albums.
\nIn the numberOfRowsInSection method, let’s change the number of items to the count of albums in our albums array:<\/p>\n
\r\nfunc tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {\r\n    return albums.count\r\n}\r\n<\/pre>\n
Now in cellForRowAtIndexPath, let’s swap out those dictionary lookups for a single album lookup:<\/p>\n
\r\nfunc tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {\r\n    let cell: UITableViewCell = tableView.dequeueReusableCellWithIdentifier(kCellIdentifier) as! UITableViewCell\r\n    let album = self.albums[indexPath.row]\r\n\r\n    \/\/ Get the formatted price string for display in the subtitle\r\n    cell.detailTextLabel?.text = album.price\r\n    \/\/ Update the textLabel text to use the title from the Album model\r\n    cell.textLabel?.text = album.title\r\n    \r\n    \/\/ Start by setting the cell's image to a static file\r\n    \/\/ Without this, we will end up without an image view!\r\n    cell.imageView?.image = UIImage(named: \"Blank52\")\r\n    \r\n    let thumbnailURLString = album.thumbnailImageURL\r\n    let thumbnailURL = NSURL(string: thumbnailURLString)!\r\n    \r\n    \/\/ If this image is already cached, don't re-download\r\n    if let img = imageCache[thumbnailURLString] {\r\n        cell.imageView?.image = img\r\n    }\r\n    else {\r\n        \/\/ The image isn't cached, download the img data\r\n        \/\/ We should perform this in a background thread\r\n        let request: NSURLRequest = NSURLRequest(URL: thumbnailURL)\r\n        let mainQueue = NSOperationQueue.mainQueue()\r\n        NSURLConnection.sendAsynchronousRequest(request, queue: mainQueue, completionHandler: { (response, data, error) -> Void in\r\n            if error == nil {\r\n                \/\/ Convert the downloaded data in to a UIImage object\r\n                let image = UIImage(data: data)\r\n                \/\/ Store the image in to our cache\r\n                self.imageCache[thumbnailURLString] = image\r\n                \/\/ Update the cell\r\n                dispatch_async(dispatch_get_main_queue(), {\r\n                    if let cellToUpdate = tableView.cellForRowAtIndexPath(indexPath) {\r\n                        cellToUpdate.imageView?.image = image\r\n                    }\r\n                })\r\n            }\r\n            else {\r\n                println(\"Error: \\(error.localizedDescription)\")\r\n            }\r\n        })\r\n    }\r\n    return cell\r\n}\r\n<\/pre>\n
Then there is the didSelectRowAtIndexPath method that needs to be modified to use the albums array. But, actually we’re not going to need this any more, so let’s just delete the whole method.<\/p>\n
Creating Album objects from JSON<\/strong><\/p>\n
Now, all of this is not much use if we aren’t creating our album information in the first place. We need to modify our didReceiveAPIResults method of SearchResultsViewController to take album JSON results, create Album objects, and save them in to the albums array. Since we have a model for Albums now, it makes sense to move this functionality in to the Album model itself. So let’s make a minor adjustment to didReceiveAPIResults and delegate the responsibility of construction the albums array to the Album class.<\/p>\n
\r\nfunc didReceiveAPIResults(results: NSArray) {\r\n    dispatch_async(dispatch_get_main_queue(), {\r\n        self.albums = Album.albumsWithJSON(results)\r\n        self.appsTableView!.reloadData()\r\n        UIApplication.sharedApplication().networkActivityIndicatorVisible = false\r\n    })\r\n}\r\n<\/pre>\n
Note that since this is where the api request comes to it’s conclusion, we also turn off the networkActivityIndicator.<\/p>\n
Now in the Album.swift file we need to add a static method that creates a list of albums from a JSON list.<\/p>\n
\r\nstatic func albumsWithJSON(results: NSArray) -> [Album] {\r\n    \/\/ Create an empty array of Albums to append to from this list\r\n    var albums = [Album]()\r\n    \r\n    \/\/ Store the results in our table data array\r\n    if results.count>0 {\r\n        \r\n        \/\/ Sometimes iTunes returns a collection, not a track, so we check both for the 'name'\r\n        for result in results {\r\n            \r\n            var name = result[\"trackName\"] as? String\r\n            if name == nil {\r\n                name = result[\"collectionName\"] as? String\r\n            }\r\n            \r\n            \/\/ Sometimes price comes in as formattedPrice, sometimes as collectionPrice.. and sometimes it's a float instead of a string. Hooray!\r\n            var price = result[\"formattedPrice\"] as? String\r\n            if price == nil {\r\n                price = result[\"collectionPrice\"] as? String\r\n                if price == nil {\r\n                    var priceFloat: Float? = result[\"collectionPrice\"] as? Float\r\n                    var nf: NSNumberFormatter = NSNumberFormatter()\r\n                    nf.maximumFractionDigits = 2\r\n                    if priceFloat != nil {\r\n                        price = \"$\\(nf.stringFromNumber(priceFloat!)!)\"\r\n                    }\r\n                }\r\n            }\r\n            \r\n            let thumbnailURL = result[\"artworkUrl60\"] as? String ?? \"\"\r\n            let imageURL = result[\"artworkUrl100\"] as? String ?? \"\"\r\n            let artistURL = result[\"artistViewUrl\"] as? String ?? \"\"\r\n            \r\n            var itemURL = result[\"collectionViewUrl\"] as? String\r\n            if itemURL == nil {\r\n                itemURL = result[\"trackViewUrl\"] as? String\r\n            }\r\n            \r\n            var newAlbum = Album(name: name!, price: price!, thumbnailImageURL: thumbnailURL, largeImageURL: imageURL, itemURL: itemURL!, artistURL: artistURL)\r\n            albums.append(newAlbum)\r\n        }\r\n    }\r\n    return albums\r\n}\r\n<\/pre>\n
I know this looks like a lot of new code, but actually there’s not much going on here. It’s really just looping through the list coming from allResults, and its grabbing values for some keys, and setting defaults if they’re missing.<\/p>\n
The ?? operator used here is pretty neat. It works like this:<\/p>\n
\r\nlet finalVariable = possiblyNilVariable ?? \"Definitely Not Nil Variable\"\r\n<\/pre>\n
The finalVariable value is set to possiblyNilVariable if it is not nil. But if it is nil? It uses the value of the thing on the right-hand side of the ?? operator. In this case, the string “Definitely Not Nil Variable”.<\/p>\n
We use this here in order to prevent getting nil values passed in to our Album.<\/p>\n
On line 39, we create an Album object. On line 40 the album is added to the list.
\nFinally on line 43 the list of albums is returned.<\/p>\n
If you run the app now you should see a new list of Album’s pop up. Cool, right?<\/p>\n
 <\/p>\n
Creating a second view<\/strong><\/p>\n
Now to actually show the details of an album, we’ll need a new view. First let’s create the class.
\nAdd a new file called DetailsViewController.swift that inherits from UIViewController.<\/p>\n
Our view controller will be pretty simple to start. We’re just going to add an album, and implement UIViewController’s init method as well as viewDidLoad().<\/p>\n
\r\nimport UIKit\r\n\r\nclass DetailsViewController: UIViewController {\r\n    \r\n    var album: Album?\r\n    \r\n    required init(coder aDecoder: NSCoder) {\r\n        super.init(coder: aDecoder)\r\n    }\r\n    \r\n    override func viewDidLoad() {\r\n        super.viewDidLoad()\r\n    }\r\n}\r\n<\/pre>\n
This code doesn’t do much yet, but that’s okay. We just need the class to exist in order to set up our storyboard.<\/p>\n
Since we’ll be pushing views back and forth on the stack we’ll want a navigation bar as well. It’s hard to explain in text, and there is an NDA preventing me from showing parts of Xcode 6 in screenshots, so instead I created a short video demonstrating how to do this in Xcode 5. The process is nearly identical for Xcode 6 Beta, and is not under any sort of NDA.<\/p>\n