Now that you have made the connections, close Interface Builder and return to XCode. We need to set up some constants. You can hardcode these values in somewhere, but making them constants makes them easier to change when you are tweaking the mechanics of your game. Open up iTennisViewController.m and add the following code.
Let me explain the purpose of the constants. The first 2 are game states. We use these to determine what is to be shown on screen. Is the game paused, is it running, is it at the title screen? We will add more states later on in the game. The next 2 variables are speeds for the ball to travel. Since the game is 2D, the ball can have an X and Y speed to make up its velocity vector. The next line synthesizes the variables we will use to create their getter and setter methods automatically.
Now let’s write the viewDidLoad method. Add the following code:
First, we are setting our game state to a paused game state. This is so the game doesn’t start right away when the view loads. Next, we create a vector for the ball’s velocity. Adjust the constants that we defined earlier for a faster or slower ball speed. Finally, we create an NSTimer instance. The first parameter is the timestep. We have set the time step to 0.05 seconds. Adjusting this will change the speed of the entire game. Next we set the target. This is telling the timer where the callback is located. The callback is the next parameter. Basically, we are telling the timer to call self.gameLoop every 0.05 seconds. We don’t need to worry about the userInfo param. The last parameter just tells the timer to repeat.
Now that we have initialized our game, let’s create the game loop. Add the following method:
First, we are checking to see if the game is in a running state (we don’t want to move the ball in a paused state). If the game is not running, we will show the tapToBegin label. This is just the label defined earlier that tells the user to tap the screen to begin.
If the game is running, we start by moving the ball according to its velocity vector. The next few lines do some bounds checking. If the ball hits the side of the screen, we want to reverse its velocity so that it “bounces”. Without this code, the ball would fly off the screen.
The last bit of code we will need to write is the touchesBegan method. We will use this method to start the game when the game is in a paused state. Add the following code:
What this does is first checks to see if we are in a paused state. If so, we hide the tapToBegin label and set the game in a running state. This will get the game running. Eventually, we will write the code to control the player paddle in this function.
Finally, being good iPhone developers, we need to clean up the resources that we allocated. Add the following code to the dealloc method.
That concludes part 1 of our game development tutorial series. If you have any questions or comments, feel free to leave them in the comments section of this post. You can download the source code here. Happy iCoding!
I’m afraid I’m having the same problem as Frank- the tutorial video never mentions connecting the background (court) view to anything, but if I don’t I get a crash error telling me the view outlet was not set. However, if I hook it to the “view” connector, the background court image is the only thing I can see. Any guidance would be appreciated!
Thank you.
I’m having the same issue Owen is having. I’ve tried both typing in the code and copying and pasting from the example and neither seems to be working. Is it an issue with dragging over the images to the resources file?
You are a God-send! I have purchased several books trying to learn this stuff, but none of them have made sense. Your tutorial is so well laid out and things are incredibly easy to follow! Thank you so much!
For those still getting the splash screen flashing briefly and then displaying white before fading to the court image 2 seconds later, check that you are not using Default.png instead of Splash.png. It took me awhile to figure it out since I had skipped the step of downloading the Splash.png image having already seen it in the Default.png image.
I am so glad to see such a great example of a basic iPhone game. I followed the tutorial carefully, but what I got is a working splash screen followed by a empty court that doesn’t respond to clicks in the simulator. I had a friend tried my code but ended up with exactly the same thing.
Anyone can help? The only things stood out to me was the info said the different UIImage (like the paddles and the ball as well as the view (court)) are being clipped.
I cannot connect the images to the file owner, seems that the only available option is VIEW. A couple of people is having the same problem but I see no anwser in the posts. what are we doing wrong?
For those that cannot connect the image to the file owner -
Before you can connect then, you have to build the project. Do this in XCode by clicking on build in the top menu bar. Choose to save, and then you can connect the image.
I dont know were to post this; I want to writte an small program that allows me to pass attendace. I have no idea where to start, seems pretty easy in my mind but I need some pointers of what I will need.
I’m having the same problem as Alex up there ^^^. When I enter in the required code, the “*ball” part stays black, and so do the rest of the similar parts of code. Why does that happen? This is my first time using Xcode, so i might be making a dumb mistake, but can someone just correct me then?
I just wanted to reiterate how much I appreciate this tutorial. I am starting out programming for the iPhone and this is so much more fun than most dinky starting tutorials!!!
Cool tutorial, but when I try to do what you are doing in the video, it doesn’t work the same way.
I can drag the Image View onto the iTennis View Controller, and then set the background image no problem.
If I try to drag over another Image View (for the paddle), it doesn’t show a small outline like in the video; rather it is a big outline the same size as the iphone display. If I drop it in, it replaces the background image, and if I try to resize it, it stays stuck in the middle of the screen (I can’t move it around, and the background behind it is striped gray-white).
I have a question about the dealloc method, I thought I read it in some book that since the UIImageViews and UILables were created by the nib, the releases are taken care by the nib, is it wrong?
Thank you for this wonderful tutorial. I’m knew to iPhone / Mac development and this answered most of my basic questions. This is definately the most complete tutorial I’ve seen on game development for the iPhone and you’ve saved me hours (perhaps even days) of thrashing. Thank you so much and please know that I am definately interested in reading / watching more tutorials by you on iPhone development. I would certainly be interested in reading / watching an OpenGL and Quartz tutorial.
Just a minor note, there’s a typo in:Double click on the file iTennishViewController.xib to open it up inside of Interface Builder.
This is just before your video.
I believe it should be iTennisViewController.xib (no h)
Unfortunately, I have a bit of a N00b question: only the court will show up when I try to build and run the program, even when I have all the other UIImageviews on screen and defined. I have checked and rechecked all of the connections for the UIImageViews in both the code and IB, as well as looked over your source code multiple times. I have seen absolutely nothing different between the two, but there is clearly something wrong with mine. Does anyone have any idea of what is going on?
Hmm… I’ve looked over the tutorial and all the replies here but I can’t find the solution to my problem.
I click on ‘Build and Go’ and I see the iTennis loading screen but then the app crashes with:
*** Terminating app due to uncaught exception ‘NSInvalidArgumentException’
…In my code I see a yellow warning at the bottom of my viewDidLoad method, right under the NSTimer: “NSTimer may not respond to ‘+scheduledTimerWithTimeInterval:target:selector:userInfo:repeat:”
Can anybody explain what the fault is when you only see the backgrodun image (the court) and not all other objects? I overlooked it now several times but for some reason I don’t get it
Can anybody explain what the fault is when you only see the background image (the court) and not all other objects? I overlooked it now several times but for some reason I don’t get it
Great tutorial, thanks. I’m having the same problem as Taylor though. The splashscreen fades away to a blank white screen and nothing happens. Since I get no errors or warning from the build Im a little stumped. Did anyone manage to fix this?
For those with the problem of dragging the uiimageView onto the layout and then not being able to drag any more uiimageviews onto the layout, make sure you’re using the right .xib file. Don’t use mainwindow.xib. Use the itennisViewController.xib.
If you have problems getting your reference outlets to work, MAKE SURE that you followed his code to the LETTER in your .h file. The IBOutlets I had defined in mine were the wrong type. I had created pointers to “UIImage”s instead of pointers to “UIImageView”s. Once I did that I could properly drag my connections over to the file’s owner box and see the iboutlets I needed to. Download his source and copy his .h if you still have problems. Run a file comparison to yours if you have to. His tutorial works.
Oh yeah. And the crashing issue. Mine crashed at first, but then I realized I messed up the original reference outlet of the view connecting to the view.
Download his source and look at his xib in interface builder to see what I mean. I started with his screencast tutorials. I took those for granted. They really do make it easier to make sure you follow along correctly. Perhaps seeing him type in every letter reinforces to you, the subtle differences in the code lines.
This is great man, thanks for the tuts and info. I’m a long time windows .net developer, but total n00b to macs and iphones, and i’ve learned tons already by walking through your tutorials.
I’d suggest anyone that really wants to learn should go through these and manually create everything, and not just download the source. I seem to learn much faster by typing the code.
Excellent blog this icodeblog.com well done and I was really pleased to find : this it’s just what I needed to know.
It’s taken me literally 3 hours and 48 minutes of searching the web to find icodeblog.com (lol)
But seriously I am really interested in Bulgaria Property normally and so I shall be very pleased to become a regular visitor
im new to this, xcode and interface builder,
and im already stuck on the connections part, where u explained in ur video, when i try making a new referencing outlet for my two rackets, it only shows ‘view’, instead of all the .png files, any help?
226 Comments
I’m afraid I’m having the same problem as Frank- the tutorial video never mentions connecting the background (court) view to anything, but if I don’t I get a crash error telling me the view outlet was not set. However, if I hook it to the “view” connector, the background court image is the only thing I can see. Any guidance would be appreciated!
Thank you.
Hey! Thanks for this site, you are the greatest! I am learning loads from your tutorials!
I have a few questions about C Objective and Xcode
What is the differennce between .h and .m???
iTennisViewController.h
and
iTennisViewController.m
and @property(nonatomic,retain)
what does nonatomic,copy and retain do?
How do I know which one to use?
@property(nonatomic,retain)
or
@property(nonatomic)
or
@property(nonatomic,copy)
Many Thanks!
Amit
I’m having the same issue Owen is having. I’ve tried both typing in the code and copying and pasting from the example and neither seems to be working. Is it an issue with dragging over the images to the resources file?
You are a God-send! I have purchased several books trying to learn this stuff, but none of them have made sense. Your tutorial is so well laid out and things are incredibly easy to follow! Thank you so much!
For those still getting the splash screen flashing briefly and then displaying white before fading to the court image 2 seconds later, check that you are not using Default.png instead of Splash.png. It took me awhile to figure it out since I had skipped the step of downloading the Splash.png image having already seen it in the Default.png image.
Hi guys,
I am so glad to see such a great example of a basic iPhone game. I followed the tutorial carefully, but what I got is a working splash screen followed by a empty court that doesn’t respond to clicks in the simulator. I had a friend tried my code but ended up with exactly the same thing.
What I have missed?
Thanks!
Anyone can help? The only things stood out to me was the info said the different UIImage (like the paddles and the ball as well as the view (court)) are being clipped.
I cannot connect the images to the file owner, seems that the only available option is VIEW. A couple of people is having the same problem but I see no anwser in the posts. what are we doing wrong?
I got it. It’s because I didn’t connect something, something the tutor didn’t talk about explicitly…
For those that cannot connect the image to the file owner -
Before you can connect then, you have to build the project. Do this in XCode by clicking on build in the top menu bar. Choose to save, and then you can connect the image.
Great! thats works perfectly.
hi, at the start of the coding, where we have to put in
iboutlet uiimage view *ball;
the colour of the word ball stays black, it doesnt go the light green colour. whats the problem?
I dont know were to post this; I want to writte an small program that allows me to pass attendace. I have no idea where to start, seems pretty easy in my mind but I need some pointers of what I will need.
Hello,
Here is a very odd thing.
In the code for ‘viewDidLoad’, I have the following:
[super viewDidLoad];
self.gameState = kGameStatePaused;
ballVelocity = CGPointMake(kBallSpeedX,kBallSpeedY);
WHen I compile, this last line is throwing the following(vague) error:
error:syntax error before ‘;’ token.
I downloaded and ran your source codes with no problems. I even copy and pasted the code from yours to mine, but it caused the same error.
take care,
lee
Hey Brandon,
I’m having the same problem as Alex up there ^^^. When I enter in the required code, the “*ball” part stays black, and so do the rest of the similar parts of code. Why does that happen? This is my first time using Xcode, so i might be making a dumb mistake, but can someone just correct me then?
- Jonathan
I just wanted to reiterate how much I appreciate this tutorial. I am starting out programming for the iPhone and this is so much more fun than most dinky starting tutorials!!!
Thanks!!! You Rock!!!
Cool tutorial, but when I try to do what you are doing in the video, it doesn’t work the same way.
I can drag the Image View onto the iTennis View Controller, and then set the background image no problem.
If I try to drag over another Image View (for the paddle), it doesn’t show a small outline like in the video; rather it is a big outline the same size as the iphone display. If I drop it in, it replaces the background image, and if I try to resize it, it stays stuck in the middle of the screen (I can’t move it around, and the background behind it is striped gray-white).
I have a question about the dealloc method, I thought I read it in some book that since the UIImageViews and UILables were created by the nib, the releases are taken care by the nib, is it wrong?
Thanks.
@Lee
About your vauge error “error:syntax error before ‘;’ token.”… I bet you have semi colons on your #define lines – you shouldn’t.
Bad:
#define someVar 3;
Good:
#define somVar 3
Thank you for this wonderful tutorial. I’m knew to iPhone / Mac development and this answered most of my basic questions. This is definately the most complete tutorial I’ve seen on game development for the iPhone and you’ve saved me hours (perhaps even days) of thrashing. Thank you so much and please know that I am definately interested in reading / watching more tutorials by you on iPhone development. I would certainly be interested in reading / watching an OpenGL and Quartz tutorial.
WONDERFUL Tutorial, thanks so much Brandon!
Just a minor note, there’s a typo in:Double click on the file iTennishViewController.xib to open it up inside of Interface Builder.
This is just before your video.
I believe it should be iTennisViewController.xib (no h)
Again, though, thanks SO MUCH! Great work!
Great series. I’ll add a snippet about it to our news.
Awesome tutorial set! Thank you so much!
Just one question real quick:
I was just wondering why you didn’t add the gameState and ballVelocity variables to the dealloc method?
I’m very new the objective-c programing so I apologize for misused terms and such.
Thanks again!
You’re awesome, dude! Great tutorial and thanks a bunch!
This tutorial is amazing! Thanks for posting it!
Unfortunately, I have a bit of a N00b question: only the court will show up when I try to build and run the program, even when I have all the other UIImageviews on screen and defined. I have checked and rechecked all of the connections for the UIImageViews in both the code and IB, as well as looked over your source code multiple times. I have seen absolutely nothing different between the two, but there is clearly something wrong with mine. Does anyone have any idea of what is going on?
Thanks in Advance.
Fixed it! Never mind! Excellent tutorial! Can’t wait to try the others!
Fixed it, so never mind! Excellent tutorial, Brandon! Can’t wait to try the others!
How? I’m getting the same problem.
wow, helped me allot. im looking forward to reading more of these tutorials. keep up the great work man! =)
This is exactly what I was looking for, thanks a lot!
Hmm… I’ve looked over the tutorial and all the replies here but I can’t find the solution to my problem.
I click on ‘Build and Go’ and I see the iTennis loading screen but then the app crashes with:
*** Terminating app due to uncaught exception ‘NSInvalidArgumentException’
…In my code I see a yellow warning at the bottom of my viewDidLoad method, right under the NSTimer: “NSTimer may not respond to ‘+scheduledTimerWithTimeInterval:target:selector:userInfo:repeat:”
Help?
Can anybody explain what the fault is when you only see the backgrodun image (the court) and not all other objects? I overlooked it now several times but for some reason I don’t get it
Thanks,
PLI
Can anybody explain what the fault is when you only see the background image (the court) and not all other objects? I overlooked it now several times but for some reason I don’t get it
Thanks,
PLI
Great tutorial, thanks. I’m having the same problem as Taylor though. The splashscreen fades away to a blank white screen and nothing happens. Since I get no errors or warning from the build Im a little stumped. Did anyone manage to fix this?
Doh – fixed my white screen problem.
If anyone else has this problem like Taylor and I, check that you put:
viewController.view.alpha = 1.0;
inside the finishedFading method.
For making the size of the UIImageView small enough to have the ball hitting the correct place you can go Layout->Size To Fit while it’s selected.
For those with the problem of dragging the uiimageView onto the layout and then not being able to drag any more uiimageviews onto the layout, make sure you’re using the right .xib file. Don’t use mainwindow.xib. Use the itennisViewController.xib.
If you have problems getting your reference outlets to work, MAKE SURE that you followed his code to the LETTER in your .h file. The IBOutlets I had defined in mine were the wrong type. I had created pointers to “UIImage”s instead of pointers to “UIImageView”s. Once I did that I could properly drag my connections over to the file’s owner box and see the iboutlets I needed to. Download his source and copy his .h if you still have problems. Run a file comparison to yours if you have to. His tutorial works.
Oh yeah. And the crashing issue. Mine crashed at first, but then I realized I messed up the original reference outlet of the view connecting to the view.
Download his source and look at his xib in interface builder to see what I mean. I started with his screencast tutorials. I took those for granted. They really do make it easier to make sure you follow along correctly. Perhaps seeing him type in every letter reinforces to you, the subtle differences in the code lines.
This is great man, thanks for the tuts and info. I’m a long time windows .net developer, but total n00b to macs and iphones, and i’ve learned tons already by walking through your tutorials.
I’d suggest anyone that really wants to learn should go through these and manually create everything, and not just download the source. I seem to learn much faster by typing the code.
Great Job….
It’s been very detailed, can’t wait to have my Mac to follow to follow your instruction…
Ummmmmmmmmmm can i do this on a windows vista??
will u give full game
good works ben, i like it
Hello dear, thank you for useful article. It cleared me a lot of things. Love, Granny.
Hi Brandon,
Thanks for the great tutorial. I have a quick question:
how to add speed to this game? Your answer will be
highly apprecited. Thanks.
Amy
Hi Brandon,
Thanks for the great tutorial. I have a quick question:
how to add speed to this game? It will be very helpful.
Thank you.
Amy
Great, totally awesome tutorial! Please, please continue to make more
Excellent blog this icodeblog.com well done and I was really pleased to find : this it’s just what I needed to know.
It’s taken me literally 3 hours and 48 minutes of searching the web to find icodeblog.com (lol)
But seriously I am really interested in Bulgaria Property normally and so I shall be very pleased to become a regular visitor
Thanks
hey brandon,
im new to this, xcode and interface builder,
and im already stuck on the connections part, where u explained in ur video, when i try making a new referencing outlet for my two rackets, it only shows ‘view’, instead of all the .png files, any help?
Hi there..
When connecting you need to right click when holding down on the icon which connects the item to.
Disregard my last post. I figured it out.
Nice job!
40 Trackbacks