I need to draw a Tic-Tac-Toe board in Xcode using OpenGL ES 2.0. I am new to graphics programming and can't find good information on drawing a square in opengl es in iOS. I looked at Ray's tutorials, which are good, however he covers drawing a rotating cube. All I want is a square; how can I describe a square for OpenGL?


This tutorial from Ray covers preparation of the OpenGL render pipeline and the setup required to describe a square. It's about halfway down.

Specifically, to draw a square you'll want to draw two triangles. Ray's code organizes them like this:

Ray Wenderlich square definition

That's four vertices and six indices (two sets of three):

Vector2 vertices[] = {
  Vector2(1, -1), Vector2(1, 1), Vector2(-1, 1), Vector2(-1, -1)

short indices[] = {
  0, 1, 2,
  2, 3, 0

(Ray's tutorial uses 3D positions and also provides color information, which I'm excluding for brevity.)

Store this data into the appropriate buffers using glBufferData (assuming you've previously created both buffers):

glBindBuffer(GL_ARRAY_BUFFER, vertexBuffer);
glBufferData(GL_ARRAY_BUFFER, 4 * sizeof(Vector2), vertices, GL_STATIC_DRAW);

glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, indexBuffer);
glBufferData(GL_ELEMENT_ARRAY_BUFFER, 6 * sizeof(short), indices, GL_STATIC_DRAW);

Then use glDrawElements to submit the draw command to the card.

Note that you'll likely need to adjust the coordinates of the vertices depending on your current projection matrix (et cetera); the provided coordinates will fill the screen when the transformation pipeline is configured with a series of identity matrices, but is only really suitable for initially bootstrapping rendering.


You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .