Over the past couple years I’ve noticed some patterns when it comes to noobs and the more useful iOS UI elements. Whether your dealing with UICollectionViews, UITableViews, or UIPickerViews, the pattern is essentially the same. And a lot of beginners, don’t quite grasp how similar these views really are. This recipe will focus a little less on the nitty gritty of doing a single one of these view types, and more on how the pattern works for them all. As a bonus, this will be the first tutorial I’ll be doing with Swift. As far as the UI elements go, it’s all the same philosophy, just a slightly different syntax.
iOS Programming Recipe 35 – Implementing The Common Views: UIPickerView, UITableView, and UICollectionView
Sometimes it can be handy to either translate an address into a set of coordinates, or get an address from a set of coordinates. These processes are known as geocoding and reverse geocoding respectively. This quick tutorial will go over how to do these things using location services.
This week we’re gonna check out some of the mapping functionality available in iOS 7. If you haven’t heard by now, developers now have nearly full access to 3D mapping API’s. Now, you can show you’re own 3D maps.
One of the coolest things about the iPhone is it’s ability to handle audio. Since it was born out of an iPod, the iPhone handles audio quite well. In this recipe we’ll explore audio recording and playback. We’ll be creating a simple app that records a sound file and plays it back. We’re basically making a voice memo app that only saves one memo and plays it back.
This week I thought I would have a bit of fun and explore image manipulation using Core Image. This sounds like it could be pretty tough, but Apple has actually made this very easy. In this Recipe we’ll be creating a photo filter app that will let you choose a photo or take a photo using the camera and filter it.
- You know the basics of Xcode, If not, we got you covered: Familiarizing Yourself With Xcode
- You know how to create outlets and actions using the interace builder
- You have a developer account and can run this app on hardware, This will be necessary if you want to capture an image using the camera
Setting Up the Project
Setting Up the Framework
Go ahead and start with a single view controller application using storyboards and title it “ImageFilterApp”.
For this App we’ll need to use the Core Image framework. To add a framework select the top level project from the project navigator on the left and scroll down in the main window to “Linked Frameworks and Libraries”. Here you can press the “+” button to add the new framework. When the dialogue opens choose the “CoreImage.framework” and press the “Add” button.
One of the coolest things smartphones are capable of now is the ability to sense motion and orientation. The iPhone does this with the use of a 3-axis Accelerometers and Gyroscopes. In this tutorial we’re going to create an app that indicates the current G and speed of rotation. Not exactly a pretty app but still instructional.
- You have a developer account and have provisioned a device. Unfortunately we can’t simulate this stuff without hardware. Follow the Apple documentation here to get set up.
- Make Sure you head over our Github page and download the source code. NSCookbook Github Recipe 19
- You have looked over some of the past tutorials and are comfortable with creating outlets and actions from the interface builder
Setting Up the Interface
Our Interface will be pretty simple as we will be displaying 12 values. We’ll show Max and Current Acceleration and Rotation about the X,Y and Z axis’.
Start with a new single view project titled “GyrosAndAccelerometers” and make sure the storyboards are selected.
Once the new project is created, open up the storyboard and drag 25 Labels onto the view. Twelve of these labels will be our outlets that will display the output data for each axis. Rename the labels and add a button as shown in the image below:
This Week I thought I would explore A nice iOS library which allows you to customize the look and feel of your application. While this library is built on UIAppearance, it extends it by introducing a CSS like way of defining the look and feel. We already had a recipe on UIAppearance, so we’ll start by creating the same thing and then explore customizations.
- You have already read through the UIAppearance Recipe.
Setting Everything Up
Creating the Project
To get started we’ll need to create a new project and add the UISS library to it using cocoapods.
- Create a new project and title it “Recipe17UsingUII”. Make sure to use ARC and select iPhone from the devices.
Since UITableView is so prominent in iOS apps, I felt it would be a good idea do one more useful recipe on the subject. For this Recipe we’ll be creating a UITableview complete with a detail view and a navigation controller. In addition, we’ll populate the table and the subsequent detail view with information retrieved from a web service. For this tutorial, we’ll be using the google places API to retrieve a list of restuarants in a city, display them in a tableview, and show more restaurant details in a detail view.
- You have a grasp on Xcode Basics. If not, go get some education here.
- I also recommend reading the other two tutorials on creating table Views as I’ll be building on some of the concepts in those tutorials.
Designing The Interface
To start off, we’re going to create a project using the Single View Application Template. Title the project “WebTableView”. On the storyboard, drag a new navigation controller into the scene. Control click from the prototype cell of the table view controller to the view controller and choose push from the segue type.
UICollectionView is great for displaying information in a grid or other custom layouts. In iOS 6 you’ll see collection views most likely used in many apps such as the podcasts app for viewing different podcasts. Since in most cases you’ll want to use UICollectionViewController, we’ll focus on that for this recipe.
- You are familiar with Xcode and setting up a single view controller. If not check out our recipe on Xcode first.
Setting Up The View
Go ahead and create a new single view controller project. I titled mine “CollectioViewFun”. When the project opens up, You’ll want to delete the single view controller from the storyboard and drag a new collection view controller in it’s place. This should look like the following:
Now since our class type has changed from a standard view controller to a collection view controller we’ll want to change the class type in the viewController.h file as well. Go ahead and change the class name from ViewController to CollectionViewController as well. Don’t forget to change all instances of the term “ViewController” in both the .m and .h files:
In Recipe 11 we created a UITableview which relied on 4 arrays to supply the data sources with data. Since we didn’t have much data, this wasn’t an issue, but what if we wanted 40 different animals? Then our arrays would be very long. One way we can organize this data a little better is through the use of a Property Lists (Plist). Plist can be handy for storing Arrays, Dictionaries, and Strings.
- You have looked over Part 1 and 2 of the UITableview recipes. I’ll be modifing the Tableview example a bit to remove these arrays and include them into a plist so you may want to go read those.
First, A Word on Property Lists
Plists are basically just text files intended to be more of a readable source of static values. In general, Don’t use them if:
- Your data is large. The entire Plist gets loaded into memory and is therefore large data doesn’t play well with them.
- You need relationships. Actions such as joins and searches don’t work at all in plist.
- You need to update often, edit data, remove items. These are all operations that are better suited for a Core Data or SQL.
- Your data does not consist primarily of strings and numbers.
So there you have it in a nutshell! Feel free to check out the documentation on the Mac Developer Library here
Creating The Property List
Alright, while there are a few formats of Plist (XML,binary,ASCII), XML is the most prevailent so we’ll be proceeding with this recipe using XML. Where we left off in the UITableview tutorial, the viewDidLoad method had four defined arrays. We’ll be removing these arrays and putting that data into a Plist instead. The viewDidLoad method looked like this when we left off: