Home

Blogs

Forums

News

Portfolios

Projects

Tutorials

29 users logged in

New? Learn about game development.

Before posting, review our community guidelines.

Chat in the GameDev.net Discord!

🎉 Celebrating 25 Years of GameDev.net! 🎉

Not many can claim 25 years on the Internet! Join us in celebrating this milestone. Learn more about our history, and thank you for being a part of our community!

Back to For Beginners

plane game collision

For Beginners

Started by phil67rpg October 19, 2019 01:03 AM

9 comments, last by Alberth 4 years, 9 months ago

phil67rpg

Author

458

October 19, 2019 01:03 AM

I have an interesting question about collisions. well when I fire a bullet from east to west at a plane it does the collision sprite however when I fire a bullet from west to east it does not draw the collision sprite. here is my collision code. this is a peculiar problem.


void coll_plane_one()
{
	//draw bullet
	float x = 5.0f+horizontal_one;
	float y = 0.0f+vertical_one;
	float oWidth = 0.125f;
	float oHeight = 0.125f;
	//draw plane
	float xTwo = -5.0f+horizontal+up_two;
	float yTwo = 0.0f+vertical;
	float oTwoWidth = 1.0f;
	float oTwoHeight = 1.0f;

	if (checkCollide(x, y, oWidth, oHeight, xTwo, yTwo, oTwoWidth, oTwoHeight) == 1)
	{
		drawcollision_one();
	}
}

void coll_plane_two()
{
	//draw bullet
	float x = -5.0f + horizontal;
	float y = 0.0f + vertical;
	float oWidth = 1.0f;
	float oHeight = 1.0f;
	//draw plane
	float xTwo = 5.0f + horizontal_one + up;
	float yTwo = 0.0f + vertical_one;
	float oTwoWidth = 0.125f;
	float oTwoHeight = 0.125f;

	if (checkCollide(x, y, oWidth, oHeight, xTwo, yTwo, oTwoWidth, oTwoHeight) == 1)
	{
		drawcollision_two();
	}
}

fleabay

1,327

October 19, 2019 03:34 AM

2 hours ago, phil67rpg said:

I have an interesting question about collisions.

What is the question? Don't keep us in suspense.

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

8Observer8

395

October 20, 2019 12:50 PM

Your code is unreadable. Please, read about the Game Loop Pattern: https://gameprogrammingpatterns.com/game-loop.html

I created a GameLoop method and I call it by timer 60 times per second. See my example:


    private GameLoop(): void
    {
        this.Update();
        this.Draw();
    }

    private Update(): void
    {
        // Change game object positions
        // ...
        // Check collisions
        // ...
    }

    private Draw(): void
    {
        // Draw game objects
    }

8Observer8

395

October 20, 2019 02:48 PM

I made a simple example with checking of collision with right wall:

Plunker: https://next.plnkr.co/edit/Bgf18uHzIkrRw9oW?preview
CodeSandbox: https://codesandbox.io/s/texture-movement-webgl-10-typescript-3v8c6
GitHub + Build Instruction: https://github.com/8Observer8/texture-movement_webgl10-typescript

TextureMovement.gif.a7cce4a91add6250bd0fba976dc1d392.gif


    private GameLoop(): void
    {
        this.Update();
        this.Draw();
        requestAnimationFrame(() => this.GameLoop());
    }

    private Update(): void
    {
        this._x += 2;

        // Check a collisiion with the right wall
        if (this._x > this._gl.canvas.width)
        {
            // Move an object to left wall
            this._x = 0;
        }

        mat4.identity(this._modelMatrix);
        mat4.translate(this._modelMatrix, this._modelMatrix, vec3.fromValues(this._x, this._y, 0));
        mat4.rotateZ(this._modelMatrix, this._modelMatrix, 0 * Math.PI / 180.0);
        mat4.scale(this._modelMatrix, this._modelMatrix, vec3.fromValues(32, 32, 1));
 
        let uModelMatrix = this._gl.getUniformLocation(this._program, "uModelMatrix");
        this._gl.uniformMatrix4fv(uModelMatrix, false, this._modelMatrix);
    }

    private Draw(): void
    {
        this._gl.clear(this._gl.COLOR_BUFFER_BIT);
        this._gl.drawArrays(this._gl.TRIANGLE_STRIP, 0, 4);
    }

phil67rpg

Author

458

October 20, 2019 04:28 PM

how do I post an animated video like above?

8Observer8

395

October 20, 2019 05:15 PM

I use Camtasia to export a video to gif-animation.

phil67rpg

Author

458

October 20, 2019 09:01 PM

here is a screenshot of my game so far. https://imgur.com/U00bPSN

8Observer8

395

October 20, 2019 09:32 PM

I can help you to rewrite your code to WebGL and JavaScript. This code draw a square and translate it using a matrix from glMatrix library. You can save this code in index.html file and run it by double click. I can show you how to draw an image later. You can read how shaders work in this book: WebGL Programming Guide

Playground: https://jsfiddle.net/8Observer8/t2q4rmnm/

019_translate_square_using_gl_matrix.png.6a79bee2c8a2f68d1ac94075114c791c.png

index.html


<!DOCTYPE html>
<html lang="en">
 
<head>
    <meta charset="UTF-8">
    <title>WebGL 1.0. Translate a square using glMatrix</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/gl-matrix/2.4.0/gl-matrix-min.js"></script>
    <style>
        #renderCanvas {
            border: 5px solid #aaaaaa;
        }
    </style>
</head>
 
<body>
    <canvas id="renderCanvas" width="250" height="250"></canvas>
 
    <script>
        var vertexShaderSource =
            `attribute vec2 a_Position;
            uniform mat4 u_ModelMatrix;
 
            void main()
            {
                gl_Position = u_ModelMatrix * vec4(a_Position, 0.0, 1.0);
            }`;
 
        var fragmentShaderSource =
            `precision mediump float;
            uniform vec3 u_Color;
 
            void main()
            {
                gl_FragColor = vec4(u_Color, 1.0);
            }`;
 
        var gl = document.getElementById("renderCanvas").getContext("webgl");
 
        var vShader = gl.createShader(gl.VERTEX_SHADER);
        gl.shaderSource(vShader, vertexShaderSource);
        gl.compileShader(vShader);
 
        var fShader = gl.createShader(gl.FRAGMENT_SHADER);
        gl.shaderSource(fShader, fragmentShaderSource);
        gl.compileShader(fShader);
 
        var program = gl.createProgram();
        gl.attachShader(program, vShader);
        gl.attachShader(program, fShader);
        gl.linkProgram(program);
        gl.useProgram(program);
 
        var vertices = new Float32Array([
            -0.5, 0.5, -0.5, -0.5, 0.5, 0.5, 0.5, -0.5
        ]);
 
        var vbo = gl.createBuffer();
        gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
        gl.bufferData(gl.ARRAY_BUFFER, vertices, gl.STATIC_DRAW);
 
        var a_Position = gl.getAttribLocation(program, "a_Position");
        gl.vertexAttribPointer(a_Position, 2, gl.FLOAT, false, 0, 0);
        gl.enableVertexAttribArray(a_Position);
 
        var u_Color = gl.getUniformLocation(program, "u_Color");
        gl.uniform3f(u_Color, 0.635, 0.450, 0.125);
 
        var modelMatrix = mat4.create();
        mat4.translate(modelMatrix, modelMatrix, vec3.fromValues(0.3, 0.3, 0.0));
 
        var u_ModelMatrix = gl.getUniformLocation(program, "u_ModelMatrix");
        gl.uniformMatrix4fv(u_ModelMatrix, false, modelMatrix);
 
        gl.clearColor(0.898, 0.984, 0.905, 1.0);
        gl.clear(gl.COLOR_BUFFER_BIT);
 
        gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
    </script>
</body>
 
</html>

phil67rpg

Author

458

October 20, 2019 09:44 PM

well thanks for all the ideas but I want to stick to freeglut and c++. I will work on my problem in more detail. oh btw I am playing world of Warcraft.