Porting my app Biblicious from iOS to OS X, Part 1

We have been spoiled by UIKit. I hadn’t realized how spoiled I had become until I started to port my iOS trivia game from iOS over to OS X. One would think that since it’s all Objective-C under the hood, it would be a fairly simple task. It is not. UIKit for iOS gives us Layers automatically which are great for interface manipulation. Need to push a new view on to the screen? The UINavigationController handles that for you: “Here, show me this view. Thanks!” Using Core Animation is easier, and even more convenient thanks to the new Facebook POP Animations. My game used the basic UIKit controls on iOS and therefore, I thought doing the same on OS X would be simple.

On iOS, the user is presented with a TableView of options, one of which is to start the game. Once they choose to start the game, a Game Setup view is pushed onto the navigation stack. Since the app is a Bible trivia game, the player can choose which parts of the Bible to receive questions as well as how long of a game to play.

Since there is no concept of the UINavigationController on OS X, I had to change up the design. To make things easier on me, I have a static sized window that is the same size as the iPad screen when turned horizontally. Instead of a UINavigationController, I have NSViews created in Interface Builder that I swap out in order to update the screen. I also created a “MasterViewController” that uses delegation so child views can tell it when they are done and be popped off the “stack”.

Integrating Facebook’s POP into iOS was quite simple and I’ve taken to using it quite a bit. It really brings the interface to life. When controls slide in, they can extend past their end location slightly and bounce back simulating inertia. Pushing a button can look like it has been pressed. Also, if you want to catch the user’s eye, you can make the icon or text periodically “twitch” for example instead of throwing a modal UIAlertView in the user’s face when asking for a review. In my reading, it looked like POP was able to be used in OS X applications, but I can’t get it to work. When trying to slide an NSButton on or off my view, it crashes with an “unrecognized selector sent to instance”. I’ve made sure the QuartzCore & CoreGraphics frameworks are linked to the project but no joy. Right now I’m using the old school setFrame: method to move the controls around. (Hey, just like iPhoneOS v2!)

The other problem I’m having is that with UIKit, one can display a UIAlertView with no buttons & have it automatically dismiss after a certain amount of time. I have yet to find a solution using NSAlert with AppKit & am afraid I might have to roll my own.

Another plus with UIKit is that there are a bunch of events when a view is instantiated and about to become visible or just became visible… We have initWithNibNameviewDidLoadviewWillAppear, and viewDidAppear. Good things to know! With AppKit, the only events I seem to get are initWithNibNameawakeFromNib. On iOS my game used each of those UIKit events to perform certain actions for either continuing a game after another view was displayed such as the web view, sharing a score, multi-user score board, and the modal blocking “introduction view”. The first OS X release won’t be multi-player so I won’t need to deal with that, but I am currently having game start up issues due to lack of events.

BibliciousWelcome

Biblicious Main Screen

So far the main screen looks like this. (Click the thumbnail to get the full size.) I’d like the buttons to fly in from off the screen using POPAnimation, but again, on OS X, it’s just crashing. Once the player has chosen a single-player game or a single-player-practice game, they are taken to the game settings screen.

 

 

 

Biblicious Settings

Again, I’m just swapping out the views to show the settings screen. This is where the using can choose the number of questions and which part of the Bible to use. Clicking on the thumbnail will give you the full size image.

 

 

 

 
Biblicious Game ScreenAnd then here is the in-progress game screen. Notice the programmer “escape” button in the upper-left corner. You can also see that the text is way too small. I haven’t made a decision about the background image yet. Right now I’m just trying to get the game to function. Again, click on the thumbnail to see the full size image.