David's Recent Forum Activity

  • Construct doesn't have any implimentation of Vectors...yet.... but anyways I thought I might write a quick article about them and how they can be useful for doing maths.

    Basically, a vector is like a position on your screen. It has an x component, and a y component. Similarily, it also usually has the ability to retrieve additional information, such as the length of the vector, and the angle of the vector. A vector can be graphically represented as an arrow like this:

    <img src="http://dl.dropbox.com/u/939828/Tutorial/Vector/vector.png">

    So...lets look at an example where vector maths could be useful..

    Suppose we are making a sling shot....

    <img src="http://dl.dropbox.com/u/939828/Tutorial/Vector/1.png">

    Lets think of some rules. Firstly...at rest, the player is in the middle.

    <img src="http://dl.dropbox.com/u/939828/Tutorial/Vector/2.png">

    Secondly, we limit how far the user can drag the player by a radius. Lets call it 'drag_radius'

    <img src="http://dl.dropbox.com/u/939828/Tutorial/Vector/3.png">

    So at this point...how would we do it using X and Y values?

    We would probably declare some variable:

    middleX = 100
    middleY = 50
    
    dragRadius = 50
    
    playerX = mouseX
    playerY = mouseY
    
    if distance between playerX, playerY, middleX, middeY is greater than dragRadius
    	angle = angle(middleX, middleY)
    	playerX = middleX + cos(angle) * dragRadius
    	playerY = middleY + sin(angle) * dragRadius
    [/code:32j3851s]
    
    So already, the code is getting a bit messy. You have sin and cos, and angle and distance formulars around the place. 
    
    Now, lets have a look at how we would do it using vectors.
    
    [code:32j3851s]
    middleXY = {100,50}
    dragRadius = 50
    offsetXY = mouseXY - middleXY
    
    if differenceXY.length is greater than dragRadius
    	differenceXY.length = dragRadius
    	
    playerXY = offsetXY + middleXY
    [/code:32j3851s]
    
    Okay, so we've done things a bit differently with the vectors. OffsetXY is a vector representing the offset of the player from the middle. If the length of offset is larger than dragRadius, we force the length to change to dragRadius
    
    <img src="http://dl.dropbox.com/u/939828/Tutorial/Vector/4.png">
    
    So in this picture, the black arrow represents what offsetXY is, and the blue one represents what it becomes when we change its length to drag radius
    
    Okay now lets get a bit more complicated.
    
    Suppose we want to make it so the angle that the player fires towards is inbetween the two elastic bands...how would we go about doing that?
    
    <img src="http://dl.dropbox.com/u/939828/Tutorial/Vector/5.png">
    
    Well, we need to declare some more variables, such as the position of the left and right pins that hold the elastic band.
    
    [code:32j3851s]
    leftPinX = 0
    leftPinY = 50
    rightPinX = 200
    rightPinY = 50
    middleX = 100
    middleY = 50
    
    playerX = ...
    playerY = ...
    
    playerToLeftPinAngle = angle(playerX, playerY, leftPinX, leftPinY)
    playerToRightPinAngle = angle(playerX, playerY, rightPinX, rightPinY)
    
    -- The only way to find the average between two angles to to convert them into component form, add them together, then find the angle
    
    playerToLeftPinX = cos(playerToLeftPinAngle)
    playerToLeftPinY = sin(playerToLeftPinAngle)
    
    playerToRightPinX = cos(playerToRightPinAngle)
    playerToRightPinY = sin(playerToRightPinAngle)
    
    playerShootAngle = angle(0,0, playerToLeftPinX + playerToRightPinX, playerToLeftPinY + playerToRightPinY)
    [/code:32j3851s]
    
    Now lets have a look at how this could be done using vectors
    
    [code:32j3851s]
    leftPinXY = {0, 50}
    middleXY = {100,50}
    rightPinXY = {200, 50}
    playerXY = {..., ...}
    
    playerToLeftPin = leftPinXY - playerXY
    playerToRightPin = rightPinXY - playerXY
    
    playerToLeftPin.length = 1
    playerToRightPin.length = 1
    
    playerShoot = playerToLeftPin + playerToRightPin
    playerShootAngle = playerShoot.angle
    [/code:32j3851s]
    
    So basically...in terms of vectors...we have something like this picture:
    <img src="http://dl.dropbox.com/u/939828/Tutorial/Vector/6.png">
    
    So playerToLeftPin and playerToRightPin are the black vectors, and the one we want to find is the red one.
    
    By adding them together we can find the red one:
    <img src="http://dl.dropbox.com/u/939828/Tutorial/Vector/7.png">
    
    So yeah, thats pretty much what vectors can do. I personally love vectors because they are easy to visualise as arrows so its kind of a more 'arty' approach to thinking of positions and speeds etc.
  • http://dl.dropbox.com/u/939828/Message%20System.cap

    Here we go, a lot simplier

  • You should use parameters in the time line. I'll make you a quick example one sec...

  • After much debugging I worked out what causes the else condition to bugger up when its nesting. It should be fixed for the next version

  • By the way, there are 'push out of obstacle' actions in the custom movement so you dont need to use while loops and stuff.

  • Also, Quazi that looks awesome!

  • In what way do you mean platform movement broke your engine?

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • Damn thats an awesome game

    Good job, very polished, and if I have a dream that i'm being chased by a giant skull tonight its ur fault!

  • Yikes...when did the wait object get added into the distributed version of Construct

  • Getting something to render in 3d isn't that hard, its just that Construct is designed specifically for 2d stuff. Also, theres plenty of really good software programs for making 3d games, such as Unity. Really we'd just be reinventing the wheel if we were to try to make a 3d engine. I've coded a '3d object' that can display obj models that will probably be included in the next build, but its pretty limited. There are so many things a 3d engine should have that Construct just isn't designed for.

  • Okay I'll add an exe to the main post as well

  • Oh as a cool little bonus, you might notice when the symbol flies past that it changes to a 'blurred' image. This is exactly what motion blur does automatically, but since I know that the symbol moves at a fixed speed, i pre-blurred it in photoshop and thus when the symbol flies past it looks smooth!

David's avatar

David

Member since 21 May, 2007

None one is following David yet!

Trophy Case

David has no trophies yet!

How to earn trophies