1
\$\begingroup\$

How can I set the bullets start position to shoot from the front right of the sprite?

It is currently shooting from the top of the sprite.

P.S. I'm doing a tutorial online with the sprite shooting upwords. I'm trying to change the direction of the bullet to shoot sideways to the right, which I got but the starting position isn't correct.

Here's my the code:

// Extending bullets sprite to funtion in the game
class Bullet extends Sprite {
    constructor(divName, assetDesc, position) {
        super(divName, position, assetDesc.fileName, new Size(assetDesc.width, assetDesc.height));
        this.life = GameSettings.bulletLife;
        this.dead = false;
        this.addToBoard(true);
    }

// Defining the bullets funtions to update throughout the game & bullet direction
update(dt) {
    let inc = dt * GameSettings.bulletSpeed;
    this.incrementPosition(inc, 0);
    this.life -= dt;
    if (this.life < 0) {
        this.killMe();
    }

}
    killMe() {
        this.dead = true;
        this.removeFromBoard();
    }
}

// Collection of bullets & how many added to player
class BulletCollection {
    constructor(player) {
        this.listBullets = [];
        this.lastAdded = 0;
        this.player = player;
        this.total_bullets = 0;
    }

    reset() {
        for (let i = 0; i < this.listBullets.length; ++i) {
            this.listBullets[i].removeFromBoard();
        }
        this.listBullets = [];
        this.lastAdded = 0;
        this.total_bullets = 0;
    }
// Bullets update
    update(dt) {
        for (let i = this.listBullets.length - 1; i >= 0; --i) {
            if (this.listBullets[i].dead == true) {
                this.listBullets.splice(i, 1);
            } else {
                this.listBullets[i].update(dt);
            }
        }
        this.lastAdded += dt;

// Detection to whether we need to add bullet to the game 
        if (this.lastAdded > GameSettings.bulletFireRate && 
            this.player.state != GameSettings.playerState.hitFlashing) {
                this.lastAdded = 0;
                this.listBullets.push(
                    new Bullet(
                        'bullet_' + this.total_bullets,
                        GameManager.assets["burrito_dog"],
                        new Point(this.player.position.x + (this.player.size.width / 2), 
                        this.player.position.y)
                    )
                );
                this.total_bullets++;
            }
    }
}

Thank you for the support!

Here's an img for reference:

enter image description here

\$\endgroup\$
0
\$\begingroup\$

It looks like the origin of your sprites might be in the top-left, with y increasing downwards.

This bit of code spawns a new bullet:

new Bullet(
    'bullet_' + this.total_bullets,
    GameManager.assets["burrito_dog"],
    new Point(
        this.player.position.x + (this.player.size.width / 2), 
        this.player.position.y
    )
)

You can see the bullet spawns at the player's position (top-left of the player sprite), shifted to the right by half the player sprite's width - that puts it at roughly the top center, as observed in your screenshot.

Try changing the point to....

new Point(
    this.player.position.x + this.player.size.width, 
    this.player.position.y + this.player.size.height / 2
)

We'll shift right the full width of the sprite, to take us all the way from the left side to the right side, and shift down half the height of the sprite, to take us to the vertical midpoint.

You might need to play with these offsets a little to get it to align just the way you want. For instance, the edge of your saucer might be three-quarters of the way down your sprite, rather than exactly halfway.

| improve this answer | |
\$\endgroup\$
  • \$\begingroup\$ Thank you so much @DMGregory! I get how it works better now. Only changed the division from 2 to 1.5 lowering to a perfect spawning position. \$\endgroup\$ – Rick N May 25 at 19:00

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.