Advertise here




Advertise here

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

OpenGL ES on the iPhone

mauriceatronmauriceatron Posts: 29Tutorial Authors, Registered Users @
edited November 2011 in iPhone SDK Tutorials
I've written a series of iPhone OpenGL ES tutorials which I am going to make available through this forum. The goal of the tutorials is not to teach 3D graphics from the beginning, or even to discuss the evolution of OpenGL, it's really about getting some objects on the screen and playing around with them.

If you have no idea on 3D objects, you may still get some milage out these tutorials. If there's enough requests, I can go back to a more basic level if needed. Also, I'm not going into user input and not even too much on how to set up a screen, I'm using Apple's template for that (with some modifications covered in the initial tutorial.

Ideally, you'll already have some basic concepts of 3D, even maybe a little OpenGL (having looked at Apple's sample code is good enough). I've left out all those fancy matrix maths and other complex concepts; all we're doing is rendering objects on the screen and seeing what we had to do to get OpenGL to do what we want. That's all.

I didn't want to put the tutorials up on here until I had a meaningful series started (currently there are 7 including the initial Xcode set up tutorial) which starts off with the basics of drawing a triangle, then a square, right through to texture mapping a 3D object. As I expand on this series, I'll expand on this post.

As I add new tutorials, they will be added to the below list.

iPhone OpenGL ES Tutorial Series:

Tutorial 00 - Setting Up Your Xcode Project
Tutorial 01 - Drawing Primitives 1 - Triangles
Tutorial 02 - Drawing Primitives 2 - Squares
Tutorial 03 - Transformations
Tutorial 04 - Colours and Shading
Tutorial 05 - Texture Mapping our Square
Tutorial 06 - Objects in 3D
Tutorial 07 - Transforming Objects Independently (Without using glLoadIdentity())
Tutorial 08 - The Final Primitives: Points and Lines in a Stride
Tutorial 09 - Blending without Mr Buzzy Part 1
Tutorial 10 - Multiple Textures, Repeating Textures, and The End of the Book Era
Tutorial 11 - Single Texture: Multiple Looks, Render to Texture, and Getting Inspired in Maths
Tutorial 12 - Landscape View & Handling Touches Part 1 - 2D World
Tutorial 13 - Moving in 3D
Tutorial 13.5 Moving in 3D Part 2: Some Theory that I Should Have Explained
Tutorial 14 - Getting Access to Blender Models Part 1
Tutorial 15 - Getting Access to Blender Models Part 2

NOTE ON BLENDING TUTORIAL: I'm not real happy with it in it's current state but thought I'd just put it up now so you can learn from what's there rather than hold back. I'm going to re-write it at a later date as well as add part 2 where I discuss the blending factors in detail.

Obviously, everything is hosted on my Mobile Me website and all made with iWeb. I really don't hold much interest in web design and that was good for me because all I needed to do was to worry about the content of the tutorials and not how they got there :D

Please use this thread for discussions.

Hooroo!
Simon Maurice
Post edited by mauriceatron on
«13456

Replies

  • kidproquokidproquo Posts: 12Registered Users
    edited April 2009
    Excellent work! This is very helpful. Thanks a lot for taking the effort.

    Do you have a list of topics that you plan to present next? I would recommend talking about the Texture2D class.

    Regards,
    Kid
    <a href="http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=309502338&mt=8"; target="_blank">iDew</a> - "mistify" your pics!<br />
    <a href="itms://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=315128900&mt=8&a
  • mauriceatronmauriceatron Posts: 29Tutorial Authors, Registered Users @
    edited April 2009
    kidproquo wrote: »
    Excellent work! This is very helpful. Thanks a lot for taking the effort.

    Do you have a list of topics that you plan to present next? I would recommend talking about the Texture2D class.

    Regards,
    Kid

    Hi Kid,

    No I haven't an ordered list in my mind, just a list of topics and there's certainly no shortage of those. I had been thinking about the Texture2D class for something later on but I'll try and fit it in somewhere a bit sooner, or maybe just do a stand alone one for those who are interested to get you going.

    cheers
    Simon Maurice
  • AustinAustin Posts: 96Registered Users
    edited April 2009
    Thanks! Very helpful tutorials.
  • HackHack San FranciscoPosts: 2,137Registered Users @ @ @ @
    edited April 2009
    Wow mauriceatron thanks a lot!!!
  • mauriceatronmauriceatron Posts: 29Tutorial Authors, Registered Users @
    edited April 2009
    Just a quick message to say thanks to all of you who've emailed me directly or replied in this thread for the OpenGL ES tutorials. Just to let you all know, I'm working on the next tutorial now.

    I actually was going to do a 3D room and using only the information contained in the Tutorials 1~7 but now I have changed my mind as all the code really doesn't apply to OpenGL ES, it's more generalised iPhone development or non-OpenGL code so I'm not really sure it applies to the above series. Also, there is si much new code, I would have had to split it into around 3 tutorials.

    Maybe, I'll do it anyway and just treat it as a tutorial in it's own right as I am already going to do a couple of "stand alone" tutorials such as:

    How to use Texture2D
    How to use Blender as an Object Editor (including code to load your files)
    3D Worlds and 3D Maths for Beginners (without putting you to sleep)
    Putting it all Together in a 3D Game

    The above of which have been requested commonly.

    Obviously, in the series, we still have much to cover including lines & points, blending, shading, fog, multi-texturing and so on. There's no shortage of stuff to cover so I'll need to get back to it.

    Thanks to all once again.

    Hooroo
    Simon Maurice
  • kidproquokidproquo Posts: 12Registered Users
    edited April 2009
    Cool. How about Render-to-texture? Another one can be blend modes and anti-aliasing.
    <a href="http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=309502338&mt=8"; target="_blank">iDew</a> - "mistify" your pics!<br />
    <a href="itms://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=315128900&mt=8&a
  • mauriceatronmauriceatron Posts: 29Tutorial Authors, Registered Users @
    edited April 2009
    Hey, are all you guys conspiring against me?????? :)

    In the past week, I've had 11 (yes ELEVEN) emails requesting a waving flag effect tutorial like the NeHe one. :confused: I've not read the NeHe one (just had a quick look to see what the fuss was about) and it's pretty basic; just texture mapping a single texture over a series of triangles.

    It's not hard to do and would only take a half hour or so to write the code if that. Will try and knock one out for you as it will get back to texture mapping which is pretty good fun.

    I'll see if I can knock it out tonight.

    Simon
  • KalimbaKalimba ¿La Islas Hermosas?Posts: 2,181iPhone Dev SDK Supporter, Registered Users
    edited April 2009
    Not to take the wind out of your sails, but Jeff LaMarche recently posted a blog specifically about implementing a waving flag in OpenGL. Here's the link: iPhone Development: Wavin' in the Breeze. Jeff has also recently started a series of OpenGL ES tutorials for iPhone.

    iPhone Development: OpenGL ES From the Ground Up, Part 1: Basic Concepts
    iPhone Development: OpenGL ES From the Ground Up, Part 2: A Look at Simple Drawing
    <a href="http://bit.ly/gAmufK"; target="_blank">icon-r-64.png</a> ~~ Word Flurry ~~ <a href="http://itunes.apple.com/us/app/word-flurry/id399660201?mt=8"; target="_blank">App Store</a> / <a href="http://bit.ly/bJiK99
  • mauriceatronmauriceatron Posts: 29Tutorial Authors, Registered Users @
    edited April 2009
    Kalimba wrote: »
    Not to take the wind out of your sails, but Jeff LaMarche recently posted a blog specifically about implementing a waving flag in OpenGL. Here's the link: iPhone Development: Wavin' in the Breeze. Jeff has also recently started a series of OpenGL ES tutorials for iPhone.

    iPhone Development: OpenGL ES From the Ground Up, Part 1: Basic Concepts
    iPhone Development: OpenGL ES From the Ground Up, Part 2: A Look at Simple Drawing

    Ok, take the wind out of my sails as much as you want in this one. I actually wanted to get stuck into some other texture mapping next so I can work on that tonight.

    I hadn't noticed his blog before. Had a look and he's ok.

    Anyway. New tutorial tomorrow instead of tonight. New task now...

    Hooroo
    Simon
  • KalimbaKalimba ¿La Islas Hermosas?Posts: 2,181iPhone Dev SDK Supporter, Registered Users
    edited April 2009
    deviphone wrote: »
    OpenGL tutorials:

    :)
    Spam reported! :)
    <a href="http://bit.ly/gAmufK"; target="_blank">icon-r-64.png</a> ~~ Word Flurry ~~ <a href="http://itunes.apple.com/us/app/word-flurry/id399660201?mt=8"; target="_blank">App Store</a> / <a href="http://bit.ly/bJiK99
  • templar_pengtemplar_peng Posts: 3New Users
    edited April 2009
    kidproquo wrote: »
    Cool. How about Render-to-texture? Another one can be blend modes and anti-aliasing.

    yes, just like before, who can tell me how to render texture,
    and how to use anti-ailasing. thank you very much ~~~
  • mauriceatronmauriceatron Posts: 29Tutorial Authors, Registered Users @
    edited April 2009
    yes, just like before, who can tell me how to render texture,
    and how to use anti-ailasing. thank you very much ~~~

    I'll put a new tutorial up tonight which will have basic render to texture included. This tutorial, and the following ones, will be based in a more 3D world so we can also start to look at scene management.

    Simon
  • templar_pengtemplar_peng Posts: 3New Users
    edited April 2009
    I'll put a new tutorial up tonight which will have basic render to texture included. This tutorial, and the following ones, will be based in a more 3D world so we can also start to look at scene management.

    Simon

    Thank you very much. I'm waiting for you......:D
  • templar_pengtemplar_peng Posts: 3New Users
    edited April 2009
    I'll put a new tutorial up tonight which will have basic render to texture included. This tutorial, and the following ones, will be based in a more 3D world so we can also start to look at scene management.

    Simon

    BTW,I want to know how to render the texture2D, specially about anti-antialias ...
  • john855john855 Posts: 148Registered Users
    edited April 2009
    Since you have so much experience with OpenGL and 3d in general, can you tell us what tools you use on the mac to develop your models? Or can you do most of it by hand?
  • KMcNamaraKMcNamara Posts: 8New Users
    edited April 2009
    These tutorials are awesome. Thanks so much!:D
  • mauriceatronmauriceatron Posts: 29Tutorial Authors, Registered Users @
    edited April 2009
    john855 wrote: »
    Since you have so much experience with OpenGL and 3d in general, can you tell us what tools you use on the mac to develop your models? Or can you do most of it by hand?

    With my limited artistic talents I prefer to let others create models :)

    To answer your question directly though, on the Mac I've mostly used LightWave. I'm no expert with this app but I know it well enough. I do maintain an active licence for it for work purposes mostly. However I think it's probably out of the reach of most of you. Not only for the $1000 price tag but also resources for learning it are limited to more "professional" delivery.

    There is no panacea for model creation for 3D programmers. If you're doing the A-Z of 3D graphics, then when it comes to choosing a tool for editing models, then the best advice I can offer is to choose something there are lots of resources for learning. You're going to spend a lot of time learning so make it easy on yourself.

    Here's a quick run down to what I've got on my Mac at the moment. I am looking for an alternative to LightWave as I do want to refer to something in this tutorial which everyone can access:

    Blender - I find Blender's interface a bit "quirky" but the amount of documentation available for it makes learning it not so hard. Learning fast is like anything in graphics programming: fast is good.

    BRL-CAD - I used this some years ago. It's far different to what used then but looks quite robust. Not as "showy" as others but don't let that turn you off. Has good documentation as well and, personally, I like the way it works.

    Misfit Model 3D - Nice and simple. Outputs Quake II MD2 models only (I think). Needs more experimentation so I have little experience on this.

    Wings3D - I've downloaded. Ran it once. Nothing against it, just haven't learnt how to use it yet. Didn't seem immediately intuitive.

    Just remember that as long as you can learn it well enough to do the models you want and can export from software to a format you can load, then you've chosen the right app. If in doubt, go with Blender.
  • KMcNamaraKMcNamara Posts: 8New Users
    edited April 2009
    Does OpenGL ES only accept certain types of images for textures? I'm trying to use one of my .jpg images for a texture in your tutorial but it just shows up as white.
  • mauriceatronmauriceatron Posts: 29Tutorial Authors, Registered Users @
    edited April 2009
    KMcNamara wrote: »
    Does OpenGL ES only accept certain types of images for textures? I'm trying to use one of my .jpg images for a texture in your tutorial but it just shows up as white.

    The code in the tutorial works with PNG format only.

    You can use a JPEG or other image formats with OpenGL (it's how it's presented that counts) but be aware the JPEGs does not support transparencies which will ultimately limit their usefulness.

    I'd suggest you re-export to PNG (Preview will do to export it). If you really want me to change the loader, I probably can. I'm pretty sure it's only in the call to CGBitmapContextCreate() which is causing the problems. Also glTexImage2D() won't be GL_RGBA, probably just GL_RGB.

    Simon
  • KMcNamaraKMcNamara Posts: 8New Users
    edited April 2009
    Right, thanks!
  • KMcNamaraKMcNamara Posts: 8New Users
    edited April 2009
    Sorry to be flooding this thread (please let me know if there's somewhere else that I should be asking these questions).

    How do we go about getting touch information to opengl? I've gotten touch information from the view controller before, but now my view is an EAGL view. Is there a tutorial on this somewhere so I don't pester you too much?
  • mauriceatronmauriceatron Posts: 29Tutorial Authors, Registered Users @
    edited April 2009
    KMcNamara wrote: »
    Sorry to be flooding this thread (please let me know if there's somewhere else that I should be asking these questions).

    How do we go about getting touch information to opengl? I've gotten touch information from the view controller before, but now my view is an EAGL view. Is there a tutorial on this somewhere so I don't pester you too much?

    You mean: translate between screen co-ordinates and world co-ordinates?

    Just pop me an email and I'll cover it with you because there is no simple answer. 2D games are easy, 3D it a bit more complex because you need to project down the Z axis for "collision detection with other objects.

    Simon
  • AustinAustin Posts: 96Registered Users
    edited May 2009
    Maurice, the tutorials are great!:) I have a quick question about tutorial #5, the texture one. When my texture is on the screen the same time as my triangle the triangle's colors are a lot darker. What is the reason for this? Thanks!

    For example the triangle is set to glColor4f(1.0, 1.0, 1.0, 1.0); yet it appears brown.
  • smashersmasher Posts: 3,859Registered Users @ @ @ @ @
    edited May 2009
    Austin wrote: »
    Maurice, the tutorials are great!:) I have a quick question about tutorial #5, the texture one. When my texture is on the screen the same time as my triangle the triangle's colors are a lot darker. What is the reason for this? Thanks!

    For example the triangle is set to glColor4f(1.0, 1.0, 1.0, 1.0); yet it appears brown.

    If you enabled textures, they'll stay enabled until you turn them off again. If you want to draw your triangle with no texture, call glDisable(GL_TEXTURE_2D) before you draw it.
    TinyCo is Hiring Mobile Game Programmers (C++)
    http://jobvite.com/m?3Ho5wgwr
  • AustinAustin Posts: 96Registered Users
    edited May 2009
    smasher wrote: »
    If you enabled textures, they'll stay enabled until you turn them off again. If you want to draw your triangle with no texture, call glDisable(GL_TEXTURE_2D) before you draw it.

    Thanks for that! Works Great
«13456
Sign In or Register to comment.