Advertisement

tic tac toe

Started by October 21, 2019 04:47 PM
61 comments, last by 8Observer8 5 years, 1 month ago

well I am working on a simpler game called tic tac toe, my question is how do I get the mouse click to draw an X on the  board. when I click the mouse nothing happens.


#include <freeglut.h>
#include <iostream>

using namespace std;

void drawBoard()
{
	glPushMatrix();
	glColor3f(1.0f, 0.0f, 0.0f);
	glBegin(GL_LINE_STRIP);
	glVertex3f(-18.75f, 6.25f, 0.0f);
	glVertex3f(18.75f, 6.25f, 0.0f);
	glEnd();
	glBegin(GL_LINE_STRIP);
	glVertex3f(-18.75f, -6.25f, 0.0f);
	glVertex3f(18.75f, -6.25f, 0.0f);
	glEnd();
	glBegin(GL_LINE_STRIP);
	glVertex3f(-6.25f, 18.75f, 0.0f);
	glVertex3f(-6.25f, -18.75f, 0.0f);
	glEnd();
	glBegin(GL_LINE_STRIP);
	glVertex3f(6.25f, 18.75f, 0.0f);
	glVertex3f(6.25f, -18.75f, 0.0f);
	glEnd();
	glPopMatrix();
}

void drawText()
{
	glColor3f(0.0f, 1.0f, 1.0f);
	glRasterPos2f(10.0f, 10.0f);
	glutBitmapCharacter(GLUT_BITMAP_TIMES_ROMAN_24, 'X');
}

void renderScene()
{
	glClear(GL_COLOR_BUFFER_BIT);
	drawBoard();
	glutSwapBuffers();
}

void ChangeSize(GLsizei w, GLsizei h)
{
	GLfloat aspectRatio;
	if (h == 0)
		h = 1;
	glViewport(0, 0, w, h);
	glMatrixMode(GL_PROJECTION);
	glLoadIdentity();
	aspectRatio = (GLfloat)w / (GLfloat)h;
	if (w <= h)
		glOrtho(-100.0, 100.0, -100.0 / aspectRatio, 100.0 / aspectRatio, 1.0, -1.0);
	else
		glOrtho(-100.0*aspectRatio, 100.0*aspectRatio, -100.0, 100.0, 1.0, -1.0);
	glMatrixMode(GL_MODELVIEW);
	glLoadIdentity();
}

void mouseClicks(int button, int state, int x, int y)
{
	if (button == GLUT_LEFT_BUTTON && state == GLUT_DOWN)
	{
		drawText();
	}
}

int main(int argc, char**argv)
{
	glutInit(&argc, argv);
	glutInitDisplayMode(GLUT_DOUBLE);
	glutInitWindowPosition(600, 400);
	glutInitWindowSize(800, 600);
	glutCreateWindow("Tic Tac Toe");
	glutDisplayFunc(renderScene);
	glutReshapeFunc(ChangeSize);
	glutMouseFunc(mouseClicks);
	glutMainLoop();
}

 

You are making the same mistake again. You need to do all your drawing in one place and paint a complete screen. If you only draw something when you click the mouse, it gets lost on the next update.

So you basically want to store your naughts and crosses in an array and do the appropriate drawing inside the renderScene function. When you click the mouse, you only modify the array and then call glutPostRedisplay. This will then execute renderScene and update the screen.

Hope this makes sense.

Advertisement
1 hour ago, phil67rpg said:

my question is how do I get the mouse click to draw an X on the  board.

Only missing that little hook at the end but this is great progress. Thumbs up.

🙂🙂🙂🙂🙂<←The tone posse, ready for action.

5 hours ago, Prototype said:

When you click the mouse, you only modify the array and then call glutPostRedisplay. This will then execute renderScene and update the screen.

I will work on this, thanks for all the good comments. should I use an integer array?

1 hour ago, phil67rpg said:

I will work on this, thanks for all the good comments. should I use an integer array?

You probably want chars because that's what you will feed into glutBitmapCharacter. You only need 9 chars to store the board. In drawText, you draw all of them in a loop using the array index to calculate its position. 

Here's a handy formula for that:


float x = left + (index % 3) * square_width;
float y = top + (index / 3) * square_height;


BTW You don't need push/popmatrix if you do not modify any matrices. Also try to make a habit of using variables/constants instead of hardcoded values.

I have written a console version of Tic-Tac-Toe. But I have not written this game using OpenGL. I will use deprecated OpenGL v1.1 too. But I will use C# and OpenTK because I use C# for Unity and I need a practice with C#.

I used C++ and FreeGLUT a few years ago. FreeGLUT allows to create a window from a console project. FreeGLUT has his own game loop. OpenTK allows the same thinks. If you want to learn C# too you can simply install OpenTK from NuGet just write in the NuGet: opentk. I think that C# is more simple than C++ and you can use C# later in Unity because C++ in Unreal Engine will be too complicated for you.

I wrote a simple example that draws a green triangle. Just create a console application, install OpenTK with NuGet and copy these files in your new project:

TicTacToe_OpenTkOpenGL11CSharp.png.cce51af83026cd153b0a2d1915de648a.png

Program.cs



namespace TicTacToe
{
    class Program
    {
        static void Main(string[] args)
        {
            using (var window = new Window())
            {
                window.Run();
            }
        }
    }
}

Window.cs



using System;
using OpenTK;
using OpenTK.Graphics.OpenGL;

namespace TicTacToe
{
    class Window : GameWindow
    {
        // Called only once at the beginning
        protected override void OnLoad(EventArgs e)
        {
            base.OnLoad(e);

            Title = "Tic Tac Toe";
            Width = 256;
            Height = 256;
        }

        // Called 60 time per second before OnRenderFrame()
        protected override void OnUpdateFrame(FrameEventArgs e)
        {
            base.OnUpdateFrame(e);
        }

        // Called 60 time per second after OnUpdateFrame()
        protected override void OnRenderFrame(FrameEventArgs e)
        {
            base.OnRenderFrame(e);

            // Set a viewport
            GL.Viewport(0, 0, Width, Height);

            // Clears the render canvas
            GL.Clear(ClearBufferMask.ColorBufferBit);

            // Set a triangle color
            GL.Color3(0f, 1f, 0f);

            GL.Begin(PrimitiveType.Triangles);
            GL.Vertex2(-0.5f, -0.5f);
            GL.Vertex2(0.5f, -0.5f);
            GL.Vertex2(0f, 0.5f);
            GL.End();

            // Swaps the front and back buffer
            SwapBuffers();
        }
    }
}

 

Advertisement
12 hours ago, phil67rpg said:

I will work on this, thanks for all the good comments. should I use an integer array?

I will use a character 2D array:


        private char[,] _gameField = new char[,]
        {
            { ' ', 'x', ' ' },
            { ' ', 'x', ' ' },
            { '0', ' ', ' ' }
        };

 

My source code will be here (it draws a one triangle): https://github.com/8Observer8/TicTacToe_OpenTkOpenGL11CSharp

I create a public board on Trello: https://trello.com/c/dXgd3zxg/1-tictactoeopentkopengl11csharp

I completed only two steps. Trello and GitHub are very useful tools for game development.

TicTacToe_OpenTkOpenGL11CSharp_Trello.png.998ff1a3be20ba041a52cd01ae61409e.png

I created a new challenge in by blog, subscribe: 

 

I made my board public: https://trello.com/b/0kam2I8k/simple-games

23 hours ago, Prototype said:

You probably want chars because that's what you will feed into glutBitmapCharacter. You only need 9 chars to store the board. In drawText, you draw all of them in a loop using the array index to calculate its position. 

Here's a handy formula for that:



float x = left + (index % 3) * square_width;
float y = top + (index / 3) * square_height;

I am working on this problem do you have any more advice for me?

This topic is closed to new replies.

Advertisement