How to stop a Movie Clip from Moving Diagonal? - actionscript-3

Hey everyone this one has me stumped. So I have an Array of Movie clips called sharkthat are added to the stage from either the left or the right side of the stage. Now when they are added I have them move in either the positive or negative x position, so in a Horizontal line. But to make the effect that the player is moving forward in a stream of water and all the other objects are passing the player I also have the array of shark move clips moving in the positive y position so moving vertically downwards. But when I do this have the values in my ENTER_FRAME the shark movie clips in the array appear to be moving Diagonal which is what I don't want at all. Does anyone know how to fix this to have the Movie clip move downwards and also in a straight line across the screen.
Here is what I have so far in my shark class:
private function startPosition():void
{
//Pick the frames for start position
var nRandom:Number = randomNumber(1, 2);
//Setup goto and stop on timeline
this.gotoAndStop(nRandom);
//Pick a random speed
nSharkSpeed = randomNumber(3, 5);
//Pick a random number for start position
var nLeftOrRight:Number = randomNumber(1, 2);
//If our nLeftOrRIght == 1 start on the left side
if (nLeftOrRight == 1)
{
//Start shark on left side and move to right
this.x = (stage.stageWidth / 2) - 240;
sSharkDirection = "R";
}else
{
//Start shark on right side and move to left
this.x = (stage.stageWidth / 2) + 240;
sSharkDirection = "L";
}
//Set y position
this.y = (stage.stageHeight / 2) - 400;
//Move our shark
startMoving();
}
private function startMoving():void
{
addEventListener(Event.ENTER_FRAME, sharkLoop);
}
private function sharkLoop(e:Event):void
{
//test what direction fish is moving in
//If fish is moving right
if (sSharkDirection == "R")
{
//Move Shark right
this.x += nSharkSpeed;
}else
{
//Move Shark left
this.x -= nSharkSpeed;
}
this.y += nSharkSpeed;
}
any help would be appreciated thanks!

It looks like your code does what it means to do: you've told that, firstly, you want sharks to move horizontally, and, secondly, vertically. Well, changing X and Y coordinates gives us diagonal move =)
So, it looks like your code is OK.
Maybe, you should rethink the logic of your application. Also, you may remove/comment the part of code where you change the X position of sharks:
if (sSharkDirection == "R")
{
//Move Shark right
this.x += nSharkSpeed;
}else
{
//Move Shark left
this.x -= nSharkSpeed;
}
And all sharks will move only by Y.

Related

How to create smooth motion for a mouse follower along a predefined path?

I want to make a tracing game. I want my circle to follow the path as the user traces the letter (path of the letter). The user can not go back to the area which is already traced
import flash.events.Event;
import flash.geom.Point;
var i: Number;
var size: int = 80;
var down: Boolean = false;
var up: Boolean = true;
var inside: Boolean = true;
var outside: Boolean = true;
var circle: Shape = new Shape();
stage.addEventListener(Event.ENTER_FRAME, loop);
stage.addEventListener(MouseEvent.MOUSE_UP, mouseup);
char.addEventListener(MouseEvent.MOUSE_DOWN, mousedown);
function loop(e: Event) {
if (down == true) {
// Checks if mouse pointer is on path i.e 'S' alphabet
if (s.hitTestPoint(stage.mouseX, stage.mouseY, true)) {
inside = true;
outside = true;
var point: Point = maskobj.globalToLocal(new Point(stage.mouseX, stage.mouseY));
var point2: Point = new Point();
//Checks if mouse pointer is completely outside of drawn area
for (i = 0; i < 2 * Math.PI; i += (2 * Math.PI) / 10) {
point2.x = stage.mouseX + (size / 3) * Math.cos(i);
point2.y = stage.mouseY + (size / 3) * Math.sin(i);
if ((maskobj.hitTestPoint(point2.x, point2.y, true))) {
outside = false;
break;
}
}
//Checks if mouse pointer is completely inside drawn area
for (i = 0; i < 2 * Math.PI; i += (2 * Math.PI) / 10) {
point2.x = stage.mouseX + (size / 3) * Math.cos(i);
point2.y = stage.mouseY + (size / 3) * Math.sin(i);
if (!(maskobj.hitTestPoint(point2.x, point2.y, true))) {
inside = false;
break;
}
}
//Character will be moved only if mouse position not to far from current position
if (outside == false) {
if (inside == false) {
//Increases drawn area by drawing a circle shape in 'maskobj' MovieClip
circle.graphics.beginFill(0x0000ff);
circle.graphics.drawCircle(point.x, point.y, size);
circle.graphics.endFill();
maskobj.addChild(circle);
//Moves character to new position
char.x = stage.mouseX;
char.y = stage.mouseY;
}
}
}
}
}
function mouseup(e: MouseEvent): void {
up = true;
down = false;
}
function mousedown(e: MouseEvent): void {
down = true;
up = false;
}
When I trace the path,the motion is not smooth. Can someone please suggest a way to make the motion smooth OR suggest another way to achieve the same. Thank you in advance.
I've created a drawing game before that allowed the user to draw a path.
Not sure why Wicked's answer was down-voted, as the first thing you need to do is to use the highest frame rate that you can get away with. The higher the frame rate, the smoother your curve.
I see that your code draws a circle at the current position if the conditions are met. It might be better to draw a line from the last point.x/point.y to the current one instead of just a circle, so that you don't have any holes in your path.
I couldn't get around the fact that the line was jagged (a series of straight lines) as it was being drawn, but as soon as the user lifted their finger I was able to take the points along the line they had drawn and replace them with a smooth bezier Path (a series of simple bezier curves), which worked well. You could also do this on-the-fly once you have 3 points (you need 3 points to draw a curve).
Here is a good reference on how to achieve this, with theory and code samples. See further down the page for bezier paths. You'll need to convert to AS3, but it shouldn't be difficult.
Another tip is to do as little calculation as possible within the ENTER_FRAME. You could pre-calculate the two values used by your loops (2 * Math.PI) and ((2 * Math.PI) / 10) as these are constants. You could also calculate (size/3) once at the top of the function, and especially pre-calculate the 10 values for Math.sin(i) and Math.cos(i) and store them in an Array (basically a LUT - Look Up Table) as these are the heaviest math ops you're doing.
My final tip is that your code doesn't check if the point being drawn is very close to the last point that was drawn. I would recommend you do this, and only draw a point after the mouse has moved a minimum distance (e.g. 2 pixels). Otherwise you could get the mouse sitting still in one spot and your code is drawing circle upon circle on top of itself needlessly.
Try increasing the FPS in your document to atleast double what you currently have
Modify>Document...>Frame Rate

AS3 move towards mouse click

In a side-scroller type game, I want the object to move wherever I click the mouse and then stop at that location. What is the best way to accomplish this? The object can only move on the x-axis so I don't have to worry about moving on the y-axis.
What I would do is set a target x coordinate, then move towards it each frame (or timer tick) based on a constant movement speed.
const moveSpeed:Number = 5;
var targetX:Number = 0;
stage.addEventListener(MouseEvent.CLICK, click);
function click(e:MouseEvent):void {
targetX = mouseX;
addEventListener(Event.ENTER_FRAME, update);
}
function update(e:Event):void {
if (Math.abs(targetX - player.x) < moveSpeed) {
// reached target
player.x = targetX;
} else if (targetX > player.x) {
// move right
player.x += moveSpeed;
} else {
// move left
player.x -= moveSpeed;
}
}
Use tweener:
http://hosted.zeh.com.br/tweener/docs/en-us/
And apply a tween like this:
Tweener.addTween(myObject, {_x:myObject.parent.mouseX, time:1, transition:"linear"});
And you can play with the time and the transition type. Good overview of transition types can be found here:
http://hosted.zeh.com.br/tweener/docs/en-us/misc/transitions.html

How do I constrain a turret's movements?

I have a turret I want to constrain rotation with the turret rotating and facing the mouse, so it doesn't go over the maximum rotation and stops rotating if you reach the maximum point. and does not go lower than minimum degrees when it reaches minimum degrees, but the max and min angles change depending on the side the mouse is facing.
When the mouse goes on the right side of the turret, aka mouseX is greater than turret's x position.
the turret will change scaleX and the turret turns to the right and has constrained aiming rotation between 120 degrees and -160.
when the turret faces left, aka the mouseX is less than the turret's x position. the turret will switch scaleX and turn to the left. then, the constrained aiming rotation switches to between 70 degrees and -20 degerees.
Here is my code, I'm new to calculating rotations and degrees so I think I got it completely wrong, because the turret doesn't rotate at all unless i remove the code. I need help on fixing the code. Thanks!
function update(e:Event)
{
//make the turret face the mouse
if (parent != null)
{
var dx = parent.mouseX - x;
var dy = parent.mouseY - y;
var angle = Math.atan2(dy, dx)/Math.PI * 180;
//this is supposed to constrain the rotation if the mouse is bigger than turret's x
//position, else constrain it the other way, this part of the code doesnt work.
//this code makes it so the turret is unable rotate at all
//if i remove the code, the turret can rotate freely though.
if(mouseX > x)
{
angle=Math.min(angle,120);
angle=Math.max(angle,-160);
}
else
{
angle=Math.min(angle,-20);
angle=Math.max(angle,70);
}
rotation = angle;
}
}
You haven't specified how update is being called. If it's called by (say) a mouse move event, you can get the mouse coords directly from the event.
Here is another version which works for me using that technique. Script is in the timeline of the 'turret' movieclip.
function update(e:MouseEvent)
{
//make the turret face the mouse
if (parent != null)
{
var dx = e.stageX - x;
var dy = e.stageY - y;
var angle = Math.atan2(dy,dx) / Math.PI * 180;
//this is supposed to constrain the rotation if the mouse is bigger than turret's x
//position, else constrain it the other way, this part of the code doesnt work.
//this code makes it so the turret is unable rotate at all
//if i remove the code, the turret can rotate freely though.
if (mouseX > x)
{
angle = Math.min(angle,120);
angle = Math.max(angle,-160);
}
else
{
angle = Math.min(angle,-20);
angle = Math.max(angle,70);
}
rotation = angle;
}
}
stage.addEventListener(MouseEvent.MOUSE_MOVE, update);

Why isn't it going off stage?

The objective is for the red circle move horizontally to the left and when completely off stage to reappear on the right side.
Why is it that setting the property X in ball.graphics.drawCircle (300, 300, 50); causes the ball to disappear before it reaches the stage left side?
If I leave x being 0 it behaves as I want
Class.
public function RedBall()
{
ball.graphics.beginFill (0xFF0000);
ball.graphics.drawCircle (300, 300, 50);
ball.graphics.endFill();
}
In my main
function update(e:Event):void {
a.ball.x -= 10;
if (a.ball.x < -a.ball.width) {
a.ball.x = stage.stageWidth + a.ball.width;
}
}
I think this probably must be some very obvious errors as I'm beginning to learn AS3 but if needed I can post the whole code.
You are drawing your circle at a point of 300,300, but you are not later accounting for that in your code where you check its position.
You can do one of two things.
Recommended:
Draw the circle at the point of origin, and place the instance of ball at an x of 300.
Alternative:
Use the ball's actual bounds to determine its position:
function update(e: Event): void {
ball.x -= 10;
if (ball.getBounds(stage).x < -ball.width) {
ball.x = stage.stageWidth - ball.getBounds(stage).x;
}
}

AS3 Determining what object overlaps it?

I'm current building a game in as3; the proplem I have right now is when I roll the virtual dice, the player(marker) moves accross the board but what I need to know is: is there a way to find the instance name of the object(box) that the player lands on?
And Sorry my english isn't good.
It depends a lot on how your board is laid out. One way is to put all of the objects your player can land on into an array, then check the player's x and y coordinates to see if they fall inside of each object's box.
For example:
var boardObjects:Array; // This would contain references to all the objects the
// player object might land on. Initialize it, then use boardObjects.add(object)
// on each one until they're all in the array.
// once the player has moved:
for(var i:int = 0; i < boardObjects.size; i++) {
var obj:* = boardObjects[i];
if (player.x >= obj.x && player.x <= obj.x + obj.width) {
if (player.y >= obj.y && player.y <= obj.y + obj.height) {
// If these if statements are all true, the Player's top-left corner
// is inside the object's bounding box. If this is a function,
// here is a good spot to put a return statement.
}
}
}
You may want to calculate it based on the middle of the player rather than their top-left corner, in which case just add half the player's width to their x position and half their height to their y position.
For performance (and avoiding unnecessary code), if it's tile based / dice why not do something like this
private function rollDice(){
var results:Array = [Math.ceil(Math.random() * 6), Math.ceil(Math.random() * 6)] //Accurately simulates two 6 sided dice
dice1.rollAnimation(results[0]);
dice2.rollAnimation(results[1]);
player.position += results[0] + results[1];
}
The board would be an array, and in Player you can use getters/setters to 'wrap' the board like this
private var _position:int = 0;
public function get position():int{
return _position;
}
public function set position(value:int){
_position = value;
while(_position > GameBoard.TILES){
_position -= GameBoard.TILES;
}
x = //Whatever you determine the positioning of the player..
}