iOS Development Products Programming

A New App — Four³

After investing in some tools, a few months of working evenings, and a ten day wait in the App Store approval queue my second iOS app is now available.

Initial Thoughts

The Easter Bunny was kind enough to wait in line on release day at my local Apple store and deliver to wife a shiny new iPad. When I saw the resolution and clarity of the screen I knew I wanted to do a game for it. After looking for an hour at the simple games that already existed in the app store, it occurred to me that–since some of the apps had set the bar pretty low–it shouldn’t be too hard to improve on a graphical 3D Tic Tac Toe. And since 3x3x3 Tic Tac Toe is no challenge what-so-ever, I decided to go to 4x4x4–hence the name of the game Four³.

Four³ is a true 3D, four-in-a-row implementation of Tic Tac Toe.


My initial thinking was to do the game in OpenGL (which led to my previous post) but as I researched what it would take to implement my game it became apparent that using OpenGL would require me to do more than just the graphics and I was really hoping to get something into the App Store sooner rather than later. Since I didn’t want to give up all my family time, and my App Store exposure is not (yet) great enough for me to quit my day job, I decided to invest in some game development tools to simplify the process.

I googled 3D game engines and wound up selecting Unity3D. After downloading the demo (and a gracious extension of said demo after a two week halt in development due to the uncertainty of the new iOS 4 TOS) I was able to almost fully prototype my application with only the demo license. At that point I was convinced the $300 cost of the Unity iPhone basic license was warranted. Although games based on the Unity engine are still being approved in the App Store the folks at Unity3D are working hard on a workaround to reduce the ambiguity about the new terms of service and the use of a tool like Unity.

The Game Board

My 4x4x4 tic tic toe game board is simply defined by 9 intersecting planes which delineate 64 game spaces. These planes are easily fabricated.

The game tokens were also easy to generate–the “O” token is simply a sphere and the “X” token is six carefully arranged smaller cubes combined into a single “prefab”.

So the game board and the player tokens were the easy part; more complicated was determining how to allow players to select a game space. In my prototyping phase I realized it would be a simply matter to allow the player to choose a smaller sphere–a “move dot”– which is pre-populated in a game space. The Unity engine allows the kinematics to be defined on an object-by-object basis, so it was a simple matter to configure the grid planes not to respond to touches and configure the “move dots” to do so. Essentially the translucent planes defining the board are invisible to touches. (This is the type of thing that would have been much more time consuming had I gone straight to OpenGL.)

Suspending the game board in space was a simple matter of surrounding it with a skybox.

Since the game tokens can quickly fill any single plain of the game board, it was imperative that the user be able to rotate/spin the board to be able to view the unused game spaces.

The Game Play

It was easy to determine the set of winning vectors. It was a simple matter to track when either player had control of winning vector–control being defined as one player, but not both, having a token in the vector. It was easy to implement the two-player game as no AI was needed, other than determining when a draw had occurred. Implementing the AI for the more advanced device game play slowed me down a bit. I actually set things aside for about ten days to fiddle with some other development.

I decided to make the easy level really easy–on this level the device simply picks a random unused game space. This makes it very easy to beat the device as there is really no offensive or defensive strategy involved when the device chooses its next move.

The medium and hard levels present different combinations of offensive and defensive strategy. I will not be revealing the full details, but I will say that much of the decision making is based on how much control a given player has of a given win vector and the hard level presents a greater defensive strategy than the medium level. I was quite pleasantly surprised when, even as the developer, the hard level beat me the first two out of three games I played against it (I let the device go first.)

iPhone Input Sample Script

The primary purpose of this post is to return something to the Unity community. I learned an awful lot from the forums and other resources I discovered.

Below is a portion of my game script which deals with iPhone touch input. There was no single example available when I started my research that showed quite this much interaction so I am publishing this to help others with their Unity development.

The highlights in this script include:

  1. Detecting taps to select a move dot
  2. Detecting a swipe to rotate the game board
  3. Detecting pinches to zoom in and out

I hope someone finds it useful.


// Control all user interactions here

#pragma strict
private var touchBegan: boolean;
private var previous: Vector2;
private var swipe: int;
private var dx: float;
private var dy: float;
private var dVec: Vector3;
private var minDist: float; 
private var maxDist: float;
private var moveFactor: float;
private var minMajorDist: float;
private var curDist: Vector2;
private var prevDist: Vector2;
private var	touch2: iPhoneTouch;	
private var nTouch;
private var dpos: Vector2;
private var pinch: boolean;
private	var slide: float;
private var nextDeviceMove: GameObject;
private var go: GameObject;
private var pos: Vector3;
private var hit: RaycastHit;
private var currentPlayer: int;
private var undoLimit: float;
private var undoAllowed: boolean;
private var undo: boolean;
private var devicePlays: int;
private var timeSinceLastMove: float;
private var iPhoneInUse: boolean;
private var myPosition: Vector2;
private var rotationRate: float;
static var touch: iPhoneTouch;
static var popup : boolean;
static var tap: boolean;

function Start() {
	// currentPlayer and devicePlays set by settings screen
	Debug.Log("PlayGame() - currentPlayer ("+currentPlayer+")");
 	if (devicePlays && 2 == currentPlayer) {

function resetGamePlay() {
	touchBegan = false;
	swipe = 0;
	pinch = false;
	dVec =;
	minDist = 16; 
	maxDist = 30;
	moveFactor = 0.05;
	minMajorDist = 15;
	maxMinorDist = 7; 
	popup = false;
	tap = false;
	defRotationRate = 45.0;
	rotationRate = defRotationRate;
	undoLimit = 2.0;
 	nextDeviceMove = null;
	orientationReset = iPhoneSettings.screenOrientation;
	undoAllowed = false;
	undo = false;
	iPhoneInUse = (iPhoneSettings.model.Substring(0,1) == "i");

// Check for iPhone Touches here
function FixedUpdate () {
 	// if the popup menu is visible don't do normal processing
	if (popup)
	timeSinceLastMove += Time.deltaTime;
	if (undoAllowed && timeSinceLastMove > undoLimit) {
  		undoAllowed = false;

		Debug.Log("Time for device move "+timeSinceLastMove);
		if (devicePlays && 2 == currentPlayer) {
	if (!iPhoneInUse) {
		// get position from mouse (for developemnt only)
		tap = Input.GetMouseButtonUp(0); 
		myPosition = Input.mousePosition;
	// Decode touches here
	nTouch = iPhoneInput.touchCount;
	if (nTouch == 1) {
		pinch = false;
		touch = iPhoneInput.GetTouch(0); 
		if (touch.phase == iPhoneTouchPhase.Began) {
			dvec =;
			previous = touch.position;
			touchBegan = true;
			swipe = 0;
			tap = false;
		} else if (touchBegan && touch.phase == iPhoneTouchPhase.Moved) {
			dpos = touch.position - previous;
			dx = Mathf.Abs(dpos.x);
			dy = Mathf.Abs(dpos.y);
			if (dx >= minMajorDist && dy <= dx) {
				// swipe in x-axis
				swipe = (dpos.x<0) ? -1 : 1;
				previous = touch.position;
				dVec = Vector3.up;
			} else if (dy >= minMajorDist && dx <= dy) {
				// swipe in y-axis
				swipe = (dpos.y<0) ? -1 : 1;
				previous = touch.position;
				dVec = -transform.right;
		} else if (touch.phase == iPhoneTouchPhase.Ended) {
			touchBegan = false;
			tap = (0 == swipe);
			swipe = 0;
	} else if (nTouch == 2) {
		pinch = false;
		touch = iPhoneInput.GetTouch(0); 
 		touch2 = iPhoneInput.GetTouch(1); 
		dVec =;
		if (touch.phase == iPhoneTouchPhase.Moved &&
		    touch2.phase == iPhoneTouchPhase.Moved) {
			curDist = touch.position - touch2.position; 

			prevDist = (touch.position - touch.deltaPosition) - 
			                  (touch2.position - touch2.deltaPosition); 
			slide = moveFactor * (prevDist.magnitude - curDist.magnitude);
			mag = transform.position.magnitude;
			slide = Mathf.Clamp(mag + slide, minDist, maxDist);
			dVec = Vector3.forward * (mag - slide); 		
			pinch = true;

function Update () {
	// process all frame updates here
	// show next device move
	if (null != nextDeviceMove) {
		nextDeviceMove = null;
	if (undo) {
		undo = false;

	if (popup)

	// Do 3D dtuff here
	if (swipe != 0) {
		// rotate around the origin along the selected major axis (dVec)
		transform.RotateAround (, dVec, swipe * rotationRate * Time.deltaTime);
		//swipe = swipe - k*i;
		// As coded we get a continuos rotation if the swipe has not ended,
		// even when the touch is held stationary.
		// Uncomment the line below to stop rotation when touch is 
		// stationary but not ended

		// swipe = 0;
	} else if (pinch) {
		// move the camera in and out based on how far we pinched
		// make sure we're still looking at the origin
		// don't pinch on next update
		pinch = false;
	// Check to see if the user selected a MoveDot
	// don't process taps while we're in the undo time interval
	if (!tap || undoAllowed)
	tap = false;

	if (iPhoneInUse) {
		myPosition = touch.position;
	// We need to actually tap on an object
	if (!Physics.Raycast(Camera.main.ScreenPointToRay(myPosition),  hit, 100))
	// And we need to hit a rigidbody that is not kinematic
	if (!hit.rigidbody || hit.rigidbody.isKinematic)

	go = hit.rigidbody.gameObject;
	// get position of move dot that was tapped
	pos = go.transform.position;

	// destroy move dot that was tapped
	undoAllowed = PlayerMove(pos);  

function PlayerMove(pos: Vector3) {
	// place player token in gameboard
	return true;

function DeviceMove() {
	// logic for next device move
	// nextDeviceMove = Game Object of selected move dot	

function LastMoveUndo() {
	// remove player token
	// restore move dot
	undo = false;
iOS Development Programming

iPhone Utility App with EAGLView on Flipside

I am just getting started on OpenGL ES development for the iPhone. There’s a lot of sample code out there, but it’s mostly basic stuff. This post presents (hopefully) a slightly more useful example.

I started with the existing instructions found here. I will not walk you through creating the basic template (OpenGL ES Application and Utility Application) applications in XCode–if you can’t do at least that much on your own, then it’s probably best you learn how to do that much and come back later! The following was done in XCode 3.2.2.

I will repeat the basic steps from the link above and highlight my changes, as such.

  1. Use the utility app as a base
  2. Add QuartzCore and OpenGLES frameworks
  3. Copy EAGLView files (*Render*, EAGLView*) across from your OpenGL template app (these last two steps are easily accomplished having both template application projects open in XCode at the same time and dragging from one project to the other.)
  4. In the FlipsideView.xib file change View to be type EAGLView
  5. In FlipsideViewController add “@class EAGLView” and an EAGLView ivar called glView and make it an IBOutlet property, so it looks like this:
  6. //
    //  FlipsideViewController.h
    @class EAGLView;
    @protocol FlipsideViewControllerDelegate;
    @interface FlipsideViewController : UIViewController {
        id  delegate;
        EAGLView *glView;
    @property (nonatomic, assign)
            id  delegate;
    @property (nonatomic, retain)
            IBOutlet EAGLView *glView;
    - (IBAction)done;
    @protocol FlipsideViewControllerDelegate
    - (void)flipsideViewControllerDidFinish:
            (FlipsideViewController *)controller;
  7. In IB FlipsideView.xib connect from File’s Owner to the new glView.  At this point if you save all files in IB and invoke build and run (ignoring the @synthesize warning,) you have the basic functionality.  Running in the simulator you should see this:

    When you click the info button the flipside will appear and you should see this:

    Note that we have a static image here. The code to animate the colored box is shown in the next step.
  8. Make changes to FlipsideViewController.m methods so it looks like this:
  9. //
    //  FlipsideViewController.m
    //  util
    #import "FlipsideViewController.h"
    #import "EAGLView.h"
    @implementation FlipsideViewController
    @synthesize delegate;
    @synthesize glView;
    - (void)viewDidLoad {
        [super viewDidLoad];
        self.view.backgroundColor =
             [UIColor viewFlipsideBackgroundColor];
        self.glView.animationFrameInterval = 1.0 / 60.0;
        [self.glView startAnimation];
    - (IBAction)done {
        self.glView.animationFrameInterval = 1.0 / 5.0;
        [self.glView stopAnimation];
        [self.delegate flipsideViewControllerDidFinish:self];
    - (void)didReceiveMemoryWarning {
        // Releases the view if it doesn't have a superview.
        [super didReceiveMemoryWarning];
        // Release any cached data, images, etc that aren't in use.
    - (void)viewDidUnload {
        // Release any retained subviews of the main view.
        // e.g. self.myOutlet = nil;
    - (void)dealloc {
        [super dealloc];

At this point, build and debug, then hit the info button–you should have a bouncing box in the flip side! (Note that I’ve added the “@synthesize glView;” as I should have earlier.)

Most of the games I’ve seen present some GUI elements first to select number of players, level, etc., prior to the actual game play. I think this example presents a more realistic template for implementing that use case; selecting number of players and such can be done on the main view then a button push invokes the flip side view for game play. Good luck with your development!