How I built my first iOS app in 8 hours

Ion Vrinceanu
4 min readMay 25, 2016

--

N.B. English is not my native language, so any suggestion to change the text is welcome.

When I graduated I knew that I didn’t want to work as an electrical engineer, and one of my hobbies was technology, I started to learn programming. Soon I was hired as a web developer in a small company. After 3+ years working as full stack developer, I decided that I needed to make a change and started to learn develop mobile apps with phonegap. It was cool, but i didn’t like them: it’s a huge difference between a native app and a hybrid app(in my case build with phonegap). So few months ago I decided to start learning new programming language to build native iOS apps. And here I had 2 options: to learn Objective-C or Swift. Advantage of Objective-C is that almost all iOS developers are using it, on the internet is a lot of documentation about it, but for me Swift seems easier to learn(it’s easier to move from PHP to Swift than to Objective-C). Also, it’s open source and I think in few years it will be used everywhere.
So I started to read apple’s documentation for swift, but it was boring and searched for some tutorials on youtube. There are few channels that provide good content, so in the evening, before sleep I watched 1–2 tutorials. I think I spent 20–25 hours on these tutorials. Last Friday, browsing Pinterest, I saw a nice animation, which made me to create tap.tap app. Next day, in few hours app was sent to app store for approval.

tap.tap app is pretty simple: there is a tube filled with 2 colors, and two buttons which represents colors in the tube. Buttons needs to be tapped to keep color in the tube:

Play screen: tube filled with 2 colors and two buttons which represents colors in tube

App has 5 levels, each level will change after 1 minute. With each level tube will be smaller in width. Level 5 has unlimited time. The goal is to break the record and try to keep both colors in tube as much as possible. At the moment when in tube is just one color the game is over. Almost forgot — if game is over, then you’re starting from level one, even if you’re on level 5. Just for fun :)

Next you’ll find technical details about how app was made. First created a new single page application in XCode, then created 2 views in Main.storyboard: one for home screen and second for play screen. As I don’t have designer skills, I used just text and 2 colors, no icons and other stuff.

Home Screen — here we have only one button, which will display Play Screen. Between screens segue is created and named “playGame”, so on button tap will call it:

play button tapped functionality

As a web dev, for me it’s easier to create all elements and styles programmatically, so I’ve made a function which is called in viewDidLoad:

function for custom styles on home screen

Play Screen — here is the action. All functionality is added in GameViewController.swift file. Code is written in the way to create styles in function of device screen size. In createGameElements() function all elements and styles for them are added, also tap event for buttons. As you can see in code(see link at the end of this post) color change is made with an animation. In the beginning it was a bit buggy, but at the end found that the solution was to remove all animations when on of the buttons is tapped. So everytime when button is tapped, first thing is to remove all animations with stopBarAnimations(). All animations are made on the tube. When I wrote the app, there were two solutions to create this tube with color:

  1. to have 1 view with 2 smaller views inside it, one for each color
  2. to have 1 view(colorBar) with background color with only 1 view(blueBar) inside it with another color

I’ve choosed 2nd case because here is less code to write and just 1 view to animate, which means less resources needed. From start our smaller tube(blueBar) has 0.5 from parent tube(colorBar). On button tap it will animate to full width(1) or to 0 width. If animation is finished, the game is over.

Best score is saved as NSUserDefaults.

app running stats

So this is how I build my first iOS app with Swift(2.0).

All suggestions are welcome.

Download “tap.tap” app here

Source code

--

--