Welcome to part 3 of this series of posts on beginning iOS Application Development. In part one, we got Xcode all set up and looked at how to use the documentation.
In Part 2 we created our first groundbreaking and impressive application that was neither groundbreaking nor impressive but it did work, so that’s something we can build on.
This week we’re going to do a couple of things to make our app a little more interesting. The first is that we’re going to set a custom background on our one and only view.
The second is that we’re going to make our button spit out a bunch of random quotes. These quotes are going to be hard-coded initially.
In a real world app, you’d want to look at getting Core Data involved and sticking them in a Database with relationships (e.g. Who said the quote originally) but that’s a little advanced for this.
Setting the background: Built In Options
Open up your
HelloWorld.xcodeproj and head to the Storyboard editor.
In Xcode, there is no backgroundImage property. There is, however, a backgroundColor property and this can now take images as well as colours.
Make sure that the View is selected (not the View Controlleróthere should not be a blue outline around your view). You can check this by opening up the Document Outline (the little triangle at the bottom) and making sure that
View is highlighted like so:
Make sure that the Utilities window is showing by clicking on the right-most button in the group of 3 View buttons, then click the Attributes button.
Finally, click the dropdown next to
Recently Used Colours there is a list of preset backgrounds. Some of these are textures, such as
Group Table View Background Colour and
Scroll View Textured Background Colour.
Setting the background: Custom Image
For this you’re going to need a background image that you’d like to use. I’m whipped up this shiny noise texture which you are welcome to download and use. Since I’m developing for a retina device, it’s a 640 x 960 PNG (although thinking about it now I probably could have just made it a 20 x 960 PNG and have it repeat. Learning as I go!)
Open the Project navigator window on the left, then drag your image into the root folder (in this case, HelloWorld).
You`ll be presented with these options:
Make sure that
Copy items into destination group's folder is checked`, then hit finish.
Finally, open up HelloWorldViewController.m and then find the code snippet
1 2 3 4 5 6
And replace it with:
1 2 3 4 5 6
your_background_image.png with whatever the name of your background image (if you used mine, it’s
What this code does
- Runs the parent class’s viewDidLoad method.
- Gets the view instance and runs the setBackgroundColor: method
- Passes in a new UIColor object that is created on the fly and passes our image, itself a UIImage object (again created on the fly).
Randomising our Text String
Last week we created our Action for our button which updates the label text string. This week we’re going to update this code and make it return some random quotes.
Find the code from last week that looks like this:
1 2 3
And replace it with this:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22
What This Code Does
- We generate a random number using the built in C function
arc4random(). Because we’re only going to have 5 options, we use the modulus operator (%) to make the number wrap around when it reaches 5, then we assign it to a an
- We set up a new
NSStringobject (don’t forget the
*which indicates that this is a pointer)
- We run a Switch on the variable
rand provide cases for each of the values.
- Within each case, we assign the
NSString *textobject a value.
- If the number is 0, then we let the default case handle it. It’s always a good idea with a Switch statement to have a
default:case to handle any unexpected incidents.
Things to Note
- We use the
%iplaceholder within the strings to indicate that we are going to replace it with an integer, which is then declared after a comma following the string (in this case, it’s our integer variable
- We then declare a
break;after each case to stop the program executing the rest of the switch statement (if we didn’t, the
defaultstate would also be run and we would get unexpected output). Sometimes you’ll want the default to run as well as whichever case matched the parameter but here we don’t.
Boom. Random text generator.
This concludes this 3 part series on iOS Application Development. Feel free to replace the text with some better quotes, build out your archive and submit it to the App Store for $2.99 a pop.
Continuing with your iOS Application Development
- Ray Wenderlick has some great tutorials on iOS application development.
- There’s the famous Stanford iOS course, available free of charge on iTunes U.
- Finally, Apple has a great introductory course on iOS application development (you may need to be logged in to your developer account to access this one).