1 reply to this topic

[ccbass85]

ok. This game i think this is one of the best flash games ive seen. The dynamics of it and everything. I wonder if anyones ever seen a tutorial on how to make something like this. Ive already seen the collision tutorials on flashkit. but theres alot more to this game than just collision. It would be perfect if i could get the actual source file for the game but i doubt that'll happen. If anyone can help me out please post.

The link:
BikeGame

or

BikeGame2

Edited by ccbass85, 29 March 2006 - 12:05 AM.

[gszauer]

First off, dont let my reply discourage you, if you want to make something like this, by all means go for it!

Now, in my opinion if you are looking for a tutorial you will not find one, and eaven if you did the code would be too owerwhelming....
Belive it or not, there are a lot of things in the game that are not simple hit-test and sutch. For its not simply collision detection, (mc1.htiTest(mc2)) this requires mutch more, namely collision detection between a line and 2 circles....
here is the code for 1 circle and a line with gravety
ball = {};
ball.clip = _root.pb;
ball.x = ball.clip._x;
ball.y = ball.clip._y;
ball.radius = ball.clip._width/2;
ball.xmov = 0;
ball.ymov = 0;
airDecay = .99;
gravity = .2;
depth = 100;
lineArray = [];
function createLine(x, y, angle, length) {
if (angle == 0) {
angle = .000001;
}
lineDepth = ++depth;
name = "line"+lineDepth;
clipName = "line_clip"+lineDepth;
this.attachMovie("bank", clipName, lineDepth);
this[name] = {};
ob = this[name];
ob.lineDecay = .5;
ob.length = length;
ob.realAngle = angle;
ob.angle = ob.realAngle*Math.PI/180;
ob.clip = this[clipName];
ob.clip._x = x;
ob.clip._y = y;
ob.clip._rotation = ob.realAngle;
ob.slope = Math.tan(ob.angle);
ob.sinAngle = Math.sin(ob.angle);
ob.cosAngle = Math.cos(ob.angle);
ob.x = ob.clip._x;
ob.y = ob.clip._y;
ob.b = ob.y-ob.slope*ob.x;
ob.clip.lineStyle(0, 0x000000, 100);
ob.clip.lineTo(ob.length, 0);
ob.x1 = ob.x;
ob.y1 = ob.y;
ob.x2 = ob.x+ob.length*ob.cosAngle;
ob.y2 = ob.y+ob.length*ob.sinAngle;
lineArray.push(ob);
return ob;
}
l = createLine(100, 100, 10, 50);
l = createLine(l.x2, l.y2, 20, 50);
l = createLine(l.x2, l.y2, -30, 50);
function getFrames(tempLine, point) {
//Step 1
var slope2 = point.ymov/point.xmov;
if (slope2 == Number.POSITIVE_INFINITY) {
var slope2 = 1000000;
} else if (slope2 == Number.NEGATIVE_INFINITY) {
var slope2 = -1000000;
}
//The y intercept of the ball trajectory
var b2 = point.y-slope2*point.x;
//intersection point
var x = (b2-tempLine./(tempLine.slope-slope2);
var y = tempLine.slope*x+tempLine.b;
//Step 2
//The angle that the ball is moving
var theta = Math.atan2(point.ymov, point.xmov);
//The difference between the angle of the line and of the ball trajectory
var gamma = theta-tempLine.angle;
//modify x and y
var sinGamma = Math.sin(gamma);
var r = (point.radius+0.000001)/sinGamma;
//The ball's position at point of contact
var x = x-r*Math.cos(theta);
var y = y-r*Math.sin(theta);
//Step 4
//Now find how long it will take to get to the point of contact
var dis = Math.sqrt((x-point.x)*(x-point.x)+(y-point.y)*(y-point.y));
var vel = Math.sqrt(point.xmov*point.xmov+point.ymov*point.ymov);
var frames = dis/vel;
//Step 3
//now check to see if point of contact is on the line segment
var slope2a = -1/tempLine.slope;
var b2a = y-slope2a*x;
//point of contact
var xa = (tempLine.b-b2a)/(slope2a-tempLine.slope);
var ya = slope2a*xa+b2a;
if ((xa>tempLine.x1 && xa<tempLine.x2) || (xa<tempLine.x1 && xa>tempLine.x2) || ((ya>tempLine.y1 && ya<tempLine.y2) || (ya<tempLine.y1 && ya>tempLine.y2))) {
//within segment boundaries
} else {
//not within segment boundaries
//set frame1 high
var frames = 1000;
}
if (frames>0 && frames<=1) {
ballLineReaction(tempLine, point, x, y);
}
}
function ballLineReaction(tempLine, point, x, y) {
var lineDecay = tempLine.lineDecay;
var alpha = tempLine.angle;
var cosAlpha = math.cos(alpha);
var sinAlpha = math.sin(alpha);
//get the x and y velocities of the ball
var vyi = point.ymov;
var vxi = point.xmov;
//project the x and y velocities onto the line of action
var vyip = vyi*cosAlpha-vxi*sinAlpha;
//project the x and y velocities onto the line
var vxip = vxi*cosAlpha+vyi*sinAlpha;
//reverse the velocity along the line of action
var vyfp = -vyip*lineDecay;
var vxfp = vxip;
//translate back to Flash's x and y axes
var vyf = vyfp*cosAlpha+vxfp*sinAlpha;
var vxf = vxfp*cosAlpha-vyfp*sinAlpha;
//set the velocities of the ball based from the results
point.xmov = vxf;
point.ymov = vyf;
point.tempx = point.x+point.xmov;
point.tempy = point.y+point.ymov;
}
function getTempPositions() {
ball.ymov *= airDecay;
ball.xmov *= airDecay;
ball.ymov += gravity;
ball.tempx = ball.x+ball.xmov;
ball.tempy = ball.y+ball.ymov;
}
function bankCollisionDetect() {
for (var i = 0; i<lineArray.length; ++i) {
getFrames(lineArray[i], ball);
}
}
function render() {
ball.x = ball.tempx;
ball.y = ball.tempy;
ball.clip._x = ball.x;
ball.clip._y = ball.y;
}
_root.onEnterFrame = function() {
//now=getTimer();
getTempPositions();
bankCollisionDetect();
render();
//trace(getTimer()-now);
};
... Like i said, owerwhelming...
If you are serious about learning, go to your local book store, or amazon.com and pick up a book called flash game design demistified.... It will teach you everything you need to duplicate an engine like that....
Sorry for the spelling mistakes,
~Gabor
And if you want the source codefor an education purpuse.... Decompile it