iPhone, iOS 5, iPad SDK Development Tutorial and Programming Tips » Category: iPhone Programming Tutorials

Tutorial: Develop An Angry Birds Like Game With Cocos2D And Box2D Step-By-Step

John — Thu, 15 Sep 2011 12:02:03 +0000

In the past I mentioned a good tutorial on creating an Angry Birds like game with Cocos2d and the Chipmunk physics engine (using the SpaceManager wrapper).

I’ve come across an excellent tutorial that while creating a similar takes a different approach using the Box2D game engine. The tutorial uses a catapult to fire at the structures, and creates a much more polished result with a scrolling camera, Box2D joints, and more.

Here’s a video demonstrating the end result in action:

The tutorial is from Gustavo Ambrozio, and can be found in 2 parts here:
How To Make a Catapult Shooting Game with Cocos2D and Box2D Part 1
How To Make a Catapult Shooting Game with Cocos2D and Box2D Part 2

A very high quality step-by-step tutorial on building an Angry Birds like game with Box2D and Cocos2D that should get you off to a great start if you’re looking to build this type of game.

Tutorial: In-Depth Tutorial On The iOS UITableView And UIPickerView

John — Sat, 10 Sep 2011 03:33:56 +0000

If you are new to the iOS it’s likely that you are or will spending a tremendous amount of time learning to work with the UITableView component, and the UIPickerView component. These two components are extremely useful, but can be difficult to work with as illustrated by the over 4,000 combined questions on Stack Overflow about these two components.

I’ve found an excellent tutorial that demonstrates how to build a thermostat building application with interactive tableview cells, and an integrated UIPickerView component in exhausting detail. There is an extensive amount of information on these tutorials and if you are seeking to master these components then you might want to check them out.

Included is full source code for the tutorial, and here’s a video showing the end result in action:

The concepts used in creating this app are explained in these 3 tutorials by Tom Thompson here:

Displaying Tabular Data On iPhones

Making Two-Way Tables On iOS

Improving Data Entry With UIPickers

These are some of the most in-depth tutorials I’ve seen on this topic covering not just what you need to know, but covering everythings in depth with many diagrams are provided. If you are looking for a thorough guide that explains everything this is the ticket.

Tutorial: Building A Beautiful Front End Interface For A News App

John — Thu, 08 Sep 2011 12:21:39 +0000

I’ve mentioned a great tutorial demonstrating how to format articles in a magazine/news app, and I came across a tutorial demonstrating how to create an interesting front end user interface for a news app.

This tutorial demonstrates that front for a news app, and is styled after the Pulse News App for iPhone and iPad. Effectively the tutorial demonstrates how to create a grid view with multiple images, and headlines. The cool part is the user can slide each row on the grid so that you can display a large number of article headlines and thumbnails.

Here’s a video demonstrating the end result of this tutorial in action:

You can find the tutorial by Felipe Laso in two parts here:
How To Make An Interface With Horizontal Tables Like The Pulse News App: Part 1
How To Make An Interface With Horizontal Tables Like The Pulse News App: Part 2

You can find the Pulse News app free here:
iPad Version - iPhone Version

Some great ideas and techniques in this tutorial on manipulating a table view that can definitely be useful.

Tutorial: Build A Multiplayer Cocos2D Game That Runs On Your Own Server

John — Tue, 09 Aug 2011 06:04:57 +0000

Previously I mentioned a tutorial on creating a multiplayer Cocos2D game with GameKit, and a tutorial demonstrating how to create a multiplayer game using Game Center as the lobby.

I’ve come across an extensive multiplayer game tutorial that demonstrates how to create a multiplayer game using Cocos2D that runs on a server created by you. This is a pretty daunting topic, and what I really like is that every little detail is covered even how to code the server that will host the games.

If you are interested in some in-depth Cocos2D game development training please take this survey.

I will be getting together with a successful Cocos2D expert and putting together a comprehensive training course.

We will be giving out some free copies to those who fill in the survey. You can get to the survey by clicking here.

The tutorial is from Ray Wenderlich, the creator of the Space Game Starter Kit and co-author of the Learning Cocos2D book and can be found in these 2 parts here:
Create An iOS Game Hosted On Your Own Server 1/2
Create An iOS Game Hosted On Your Own Server 2/2

In addition to Cocos2D and the iOS SDK the tutorial utilizes Python and the Twisted networking engine.

Fair warning this tutorial will take quite a long time to go through – but you will definitely be ready to start tackling this complicated topic.

Tutorial: Upload Videos With The Facebook Graph API

John — Fri, 05 Aug 2011 05:59:11 +0000

In the past I mentioned mention a couple of excellent tutorials demonstrating the basics of using the Facebook Graph API such as how to authenticate using Oauth, getting profile information, and posting to the wall. Those tutorials are still relevant, but the iOS SDK has changed considerably in the meantime so it may be difficult to follow along.

I’ve found an excellent, new tutorial covering the basics of using the API with Xcode 4. Also included is a demonstration project showing how to post a video and set the privacy settings for that video. Overall it’s a very well made step-by-step tutorial starting right at the beginning, and the project can be used as a basis for doing anything with the Facebook Graph API.

The tutorial is from Christine Abernathy from the Facebook Developer’s blog, and can be found here:
http://developers.facebook.com/blog/post/532/

A very useful bookmark if you need to implement the Facebook Graph API within an app.

Tutorial: A Colored Lens On A Black And White Background With Core Graphics

John — Thu, 04 Aug 2011 06:25:13 +0000

You have likely noticed the effect in many different applications where the area showing what the user has currently selected is in color, and the unselected area is black and white. It may be a small detail, but it could give your app or game an extra amount of polish.

I’ve come across tutorial demonstrating how to implement this effect using Core Graphics. The tutorial demonstrates how to render the image with separate black and white, and color sections, and how to draw a polished looking lens over the colored area. The tutorial also covers some performance optimizations that you may need to perform.

The tutorial is from Yuchen of ClingMarks, and here’s a video demonstrating the end result:

You can find the tutorial here:
Implement “Focus Area” Special Effect in iPhone Apps

A simple concept, but it can definitely add a touch of class to an interface.

Tutorial: Creating An Evernote Style Button Activated Keyboard

John — Fri, 29 Jul 2011 06:35:57 +0000

The Evernote app is an excellent note taking app for iOS devices (and the Mac platform). It is also very easy to use and well designed. One of the features within the Evernote app is a keyboard button which allows you to hide and show the keyboard when pressed.

I’ve found a tutorial demonstrating how to duplicate the Evernote style keyboard. What I find interesting about this tutorial is that not only does it show how to create the sliding door image stretch effect, and perform button animations, but that it mentions a Ruby script that allows you to easily grab images from an app.

Of course you not want to do this within an app you are submitting to the app store, but if you want to learn how to implement some cool feature not having to create your own placeholder images is a big time saver.

You can find the tutorial here:
Creating a Keyboard Show Hide Button

The script mentioned in the article can be found on Github in this nice collection of open source goodie sfrom iDevrecipes.com in the utilities folder:
https://github.com/boctor/idev-recipes

A pretty nice effect, and a very handy script.

Tutorial: Building Complete Games With SpriteHelper And LevelHelper

John — Fri, 22 Jul 2011 06:00:16 +0000

I’ve previously mentioned the excellent SpriteHelper and LevelHelper tools. These tools work with Cocos2d, Cocos2D X, and Corona SDK games and allow to quickly add graphics design levels, and physics to your games with drag-and-drop and parameter selection.

Together these tools are a very powerful combination, and save an incredible amount of time – while being pretty inexpensive. You can build your own games very quickly. I’ve always liked, but then run into issues whenever using drag’n'drop game dev tools. What I love about these tools is that you get the ease of development, but can still do whatever you want in code.

Recently Vladu Bogdan, creator of the tools recently added a couple of excellent tutorials on how to build complete games.

Marin Todorov has also created an easy to follow guide for beginners working with SpriteHelper and Level Helper working with Cocos2D.

You can find Vladu’s extensive complete game tutorials on building a run’n'gun game here:
Full Game Tutorial – Corona SDK
Full Game Tutorial – Cocos2d

You can find Marin’s tutorial here:
How To Quickly Create Physics Levels For Your Games

If you’ve been trying to get the most out of these tools these tutorials should definitely help you get started.

Tutorial: Using And Building OpenCV (Open Computer Vision) On iOS Devices

John — Tue, 19 Jul 2011 06:46:13 +0000

If you have any interest in computer vision or augmented reality with marker detection then you have probably heard of OpenCV, the Open Source Computer Vision library for real time computer vision.

There are many apps, and some augmented reality libraries (even commercial ones) that use the BSD licensed OpenCV. However, building for iOS was a real pain, and for awhile it almost seemed like some wanted to keep the entire process secret (can’t really blame them!). I mentioned a tutorial that explained the process but definitely didn’t make things easy.

I recently came across a build script that alleviates all that pain so you can have OpenCV installed for iOS devices automatically, and it’s been updated to support OpenCV 2.2.9. The build script is from Khvedchenya Eugene and in the second part he writes on getting started with OpenCV in Objective-C.

Update: If you don’t mind precompiled binaries Khvedchenya has a precompiled iOS binary also available of OpenCV 2.3RC (thanks for telling me Tom!).

You can find Khvedchenya’s tutorials here:
Building OpenCV For iPhone In One Click
Using OpenCV In Objective-C Code

You can find the Github for the most recent version of the build script here:
https://github.com/BloodAxe/OpenCV-iOS-build-script

[UPDATE] For those interested in OpenCV 2.3 pre-compiled binary:
OpenCV 2.3 Release Candidate Is Available

If you ever want to dabble in augmented reality on iOS devices this is a great help.

. Tags: iPhone, augmented reality, computer vision library, opencv, open computer vision, ios

Tutorial: Calculator App Style Glossy Buttons With Core Graphics

John — Fri, 15 Jul 2011 06:18:35 +0000

In the past I’ve posted about creating iOS style buttons mentioning this tool, and this library which allow you to draw glossy buttons similar to those found in most iOS apps.

The basic calculator app however has different buttons. They have a rounded gloss at the top, and a steady gradient all the way down the button. You may have noticed when using the app that when you press the buttons there is a much more noticeable effect as the button look seems to reverse giving the impression that the finger has caused the button to reverse.

A developer named the Code Padawan has written up a quick tutorial, and provided sample code demonstrating how to duplicate this effect.

You can find their tutorial here:
iPhone Glossy Buttons

The effect is done entirely using core graphics so no need to break out Photoshop or any other tool.

[via Ole Begemann]

. Tags: buttons, tutorials, glossy buttons, core graphics, calculator buttons, ios