EaselJS get direction on pressmove - createjs

I am trying to get the direction that the mouse is moving when using pressmove. On mousedown I get store the cursor coordinates values in the variables startX and startY, then on pressmove I check to see which side of startX and startY the mouse is. I would like to only get the general direction and not keep on jumping between the values as I am currently getting. So if the general direction is up then log 'up' and not 'up''left''up'etc.
pressMove = function(event){
var pt = this.globalToLocal(event.stageX, event.stageY);
if(pt.x > this.startPosX){
this.dragDirection = 'right';
}
if(pt.x < this.startPosX){
this.dragDirection = 'left';
}
if(pt.y < this.startPosY){
this.dragDirection = 'up';
}
if(pt.y > this.startPosY){
this.dragDirection = 'down';
}
console.log(this.dragDirection)
}

Related

Align UI lements correctly in SkiaSharp (UWP)

I am trying to align a few buttons in a circular manner using SkiaSharp. My code looks like this
<skia:SKXamlCanvas x:Name="test" PaintSurface="Test_OnPaintSurface" />
Code behind
private void Test_OnPaintSurface(object sender, SKPaintSurfaceEventArgs e)
{
// the canvas and properties
var canvas = e.Surface.Canvas;
// get the screen density for scaling
var display = DisplayInformation.GetForCurrentView();
var scale = display.LogicalDpi / 96.0f;
var scaledSize = new SKSize(e.Info.Width / scale, e.Info.Height / scale);
// handle the device screen density
canvas.Scale(scale);
// make sure the canvas is blank
canvas.Clear(SKColors.Transparent);
// draw some text
var paintSmallCircle = new SKPaint
{
Color = SKColors.CornflowerBlue,
IsAntialias = true,
Style = SKPaintStyle.Fill,
TextAlign = SKTextAlign.Center,
TextSize = 24
};
var paintCircle = new SKPaint
{
Color = SKColors.LightGray,
IsAntialias = true,
Style = SKPaintStyle.Fill,
TextAlign = SKTextAlign.Center,
TextSize = 24
};
var coord = new SKPoint(
scaledSize.Width / 2,
(scaledSize.Height) / 2);
canvas.DrawCircle(coord, 120, paintCircle);
int r = 100;
int angle = 90;
for (int i = 0; i < 12; i++)
{
double x1 = scaledSize.Width / 2 + r * Math.Cos(Math.PI * angle / 180.0) ;
double y1 = scaledSize.Height / 2 - r * Math.Sin(Math.PI * angle / 180.0) ;
var coord1 = new SKPoint((float) x1, (float)y1);
canvas.DrawCircle(coord1, 10, paintSmallCircle);
Button btn = new Button { Content = i, Height = 25, Width = 25, };
btn.SetValue(SKXamlCanvas.LeftProperty, coord1.X);
btn.SetValue(SKXamlCanvas.TopProperty, coord1.Y);
test.Children.Add(btn);
angle = angle - 30;
}
}
With this code, I am able to draw Blue circles correctly, but the button alignment comes wrong. How can I solve this issue?
right now my output looks like this
As you can see blue small circles are aligned correctly, but not buttons.
The expected behavior is that buttons come in the same place where blue circles are rendered
The point is you place the Button's Left & Top property.
When you use canvas.DrawCircle(coord1, 10, paintSmallCircle); to draw a Circle, the center point is coord1.
And you draw the Buttons Left & Top at the center point of the Circle.
So you can draw Button using
btn.SetValue(SKXamlCanvas.LeftProperty, coord1.X - 25 /2);
btn.SetValue(SKXamlCanvas.TopProperty, coord1.Y - 25 / 2);
25 is the Height and Width of your Button.
See the result.

Best way to do object collision?

I'm trying to do wall collision for objects and I've followed a tutorial that offers one method of doing collision.
This is the tutorial: https://www.youtube.com/watch?v=yZU1QJJdxgs
Currently, if the object detects a wall, instead of moving it's full distance, it moves pixel by pixel until it's against the wall. This worked well until I started trying to rotate the object with image_rotate, because it caused objects to get stuck in walls by either sliding against them or if they rotated into them.
I fixed this by using draw_sprite_ext instead and changing the rotation of the sprite itself and not the mask, which worked for about 20 minutes until it started causing more problems.
///obj_player Step
//Initialise Variables
hor_speed = 0;
ver_speed = 0;
accelerationspeed = 0.2;
decelerationspeed = 0.2;
maxspeed = 3;
pointdirection = 0;
//Get player's input
key_right = keyboard_check(ord("D"))
key_left = -keyboard_check(ord("A"))
key_up = -keyboard_check(ord("W"))
key_down = keyboard_check(ord("S"))
pointdirection = point_direction(x,y,mouse_x,mouse_y) + 270
hor_movement = key_left + key_right;
ver_movement = key_up + key_down;
//horizontal acceleration
if !(abs(hor_speed) >= maxspeed) {
hor_speed += hor_movement * accelerationspeed;
}
//horizontal deceleration
if (hor_movement = 0) {
if !(hor_speed = 0) {
hor_speed -= (sign(hor_speed) * decelerationspeed)
}
}
//vertical acceleration
if !(abs(ver_speed) >= maxspeed) {
ver_speed += ver_movement * accelerationspeed;
}
//vertical deceleration
if (ver_movement = 0) {
if !(ver_speed = 0) {
ver_speed -= (sign(ver_speed) * decelerationspeed)
}
}
//horizontal collision
if (place_meeting(x+hor_speed,y,obj_wall)) {
while(!place_meeting(x+sign(hor_speed),y,obj_wall)) {
x += sign(hor_speed);
}
hor_speed = 0;
}
//vertical collision
if (place_meeting(x,y+ver_speed,obj_wall)) {
while(!place_meeting(x,y+sign(ver_speed),obj_wall)) {
y += sign(ver_speed);
}
ver_speed = 0;
}
//move the player
x += hor_speed;
y += ver_speed;
///obj_player Draw
//rotate to look at cursor
draw_sprite_ext(spr_player, 0, x,y,image_xscale,image_yscale, pointdirection, image_blend, image_alpha);
I think the best way to rotate objects is through image_rotate, and I'd like to do it without getting stuff stuck in walls. Can my current method of collision be adapted to do this, or should I attempt to do it in a different way?
Your code looks fine, but if you're going to be rotating objects then you would also need to consider having a "knock back mechanic." Reason being is the player could be sitting next to this wall and if you rotate the object over them so they cant move, its not a fun time being stuck.
So you 'could' have the object that's rotating do a check before rotating and if objects are in the way then either stop it or push them back so they cant be within range.

game maker GML twin stick shooter analogue controller

I am trying to make a twin stick shooter but I cannot get right analogue stick to shoot in the correct direction. Here is the code I have the weapon sits on top of the player and rotates. It all works fine just need to know how to get the correct angle of the right stick and fire a bullet in that direction.
//set depth
depth = -y + obj_player.y_off_set - 1;
//analog left stick face direction
var h_point = gamepad_axis_value(0, gp_axisrh);
var v_point = gamepad_axis_value(0, gp_axisrv);
if ((h_point != 0) || (v_point != 0))
{
var pdir = point_direction(0, 0, h_point, v_point);
var dif = angle_difference(pdir, image_angle);
image_angle += median(-20, dif, 20);
}
//flips gun when turning
if(gamepad_axis_value(0, gp_axisrh) < -0.5)
{
image_yscale = -1;
}else if (gamepad_axis_value(0, gp_axisrh) > 0.5)
{
image_yscale = 1;
}
//fireing
fire = gamepad_button_check_pressed(0, gp_shoulderr) && alarm[0] <= 0;
if(fire)
{
var face = point_direction(0, 0, gp_axisrh, gp_axisrv);
var p = instance_create(x, y, obj_projectile);
var xforce = lengthdir_x(20, face*90);
var yforce = lengthdir_x(20, face*90);
p.creator = id;
with (p){
physics_apply_impulse(x, y, xforce, yforce);
}
as this question is a couple months old, I imagine you found the solution to your problem, but hopefully this answer can help anyone else stuck on the issue.
Based on the code snippet you provided, it looks like if you remove the *90 from the lengthdir_ functions, your code should work.
Here is the code I wrote in my game to get 360 degree shooting working with the right analog stick (this code lives in the step event of the Player object):
if (shooting) {
bullet = instance_create(x, y, Bullet);
with (bullet) {
haxis = gamepad_axis_value(0, gp_axisrh);
vaxis = gamepad_axis_value(0, gp_axisrv);
dir = point_direction(0, 0, haxis, vaxis);
physics_apply_impulse(x, y, lengthdir_x(50, gp_axisrh), lengthdir_y(50, dir));
}
}
This particular thread on the GameMaker community forums was quite helpful as I researched how to solve this issue in my game.

how to scale up and down a shape based on mouseX and mouseY

createjs noob here,
I am trying to make a class, that when you pass in a shape, it lets you scale an object up or down based on mouse position.
beeSyrup.Scaler = function(obj){
console.log("hi from scaler");
if (not(obj) || !obj.on) return;
obj.addEventListener("pressmove", function(e){
obj.cursor = "alias";
mouseX = e.stageX;
mouseY = e.stageY;
var lastMouseX = mouseX;
var lastMouseY = mouseY;
if (lastMouseX < mouseX && lastMouseY < mouseY){
obj.scaleX += .1;
obj.scaleY += .1;
}else{
obj.scaleX -= .1;
obj.scaleY -= .1;
}
stage.update();
});
}
Currently this will scale it down once, but once it scales down you can only scale up. How would the correct if statement logic work?
In your code, mouseX and lastMouseX are always equal, because you are setting lastMouseX = mouseX before comparing them (true of the Y values as well). As such, the else condition is always satisfied, so it will always scale down.
There are many other things you will likely want to change to make this work in an user-friendly manner, but this is your immediate problem.
Here's a very rough JSFiddle to get you started down the right path: http://jsfiddle.net/9zu9jpvx/

Infinite x and y scroll of uiview

I have a 1500x1500 uiview with a 1500x1500 uiimageview inside centered in the main view of my iPad project. The code below will infinitely scroll side to side when you tilt the iPad in either direction. What I have been trying to do is get it to also scroll up and down seamlessly like the side to side. Unfortunately it seems to jump around and not be correct. Any ideas?
- (void)accelerometer:(UIAccelerometer *)acel
didAccelerate:(UIAcceleration *)acceleration {
accelX = acceleration.x;
accelY = acceleration.y;
accelZ = acceleration.z;
int speed;
speed = 1;
imageView.center = CGPointMake(imageView.center.x+delta.x,imageView.center.y+delta.y);
// allows infinite side-to-side scrolling
if (imageView.center.x > 748){
imageView.center = CGPointMake(512,384);
NSLog(#"Greater than 780");
}
if (imageView.center.x < 284){
imageView.center = CGPointMake(519,384);
NSLog(#"Less than 284");
}
if (accelY > 0.01f) {delta.x = -speed;}
else if (accelY < -0.01f) {delta.x = speed;}
else if (0.01f < accelY > -0.01f){delta.x = 0;}
// should allow up/down infinite scrolling but does not - it is very jumpy when it resets
// if (imageView.center.y > 748){imageView.center = CGPointMake(512,384);}
// if (imageView.center.y < 284){imageView.center = CGPointMake(518,752);}
// this makes it run only with the angle of the iPad the way I want it
// if (accelZ > -0.5f) {delta.y = speed;}
// else if (accelZ < -0.1f) {delta.y = -speed;}
// else if (0.3f < accelZ > -0.3f){delta.y = 0;}
}