How can I change the direction of an object when it hits the edge of a wall according to the direction is headed?

user_17241973 0
Viewed 167

I have made an arrow that can bounce off the edges but I wish for the arrow to change directions according to where it’s headed after being hit. For example, if an arrow is headed downright, when it hits the right wall it needs to change direction as it's headed to the bottom wall and then bounce off upleft. As the object is bouncing off and heading in different directions I want the image of the arrow face to change accordingly so it displays the direction is going, which will be an image of the bottom right arrow for the arrow when it's headed down right, and so on for each direction.

int xspeed;
int yspeed;

Arrows bob;

int x=50, y=50;

void setup()
{
 size(700, 700); 
  bob = new Arrows(30, 350);

}


void draw()
{
 background(255);
 bob.update();
 
 x = x+xspeed;
 y = y+yspeed;
  
}

class Arrows {
  int x;
  int y;
  int dx;
  int dy;
  int speedX = 4;
  int speedY = 4;
  PImage image1, image2, image3, image4;
  
  //constructor
  Arrows(int x, int y)
  {
   this.x = x;
   this.y = y;
   image1 = loadImage("Arrow1.png");
   image2 = loadImage("Arrow2.png");
   image3 = loadImage("Arrow3.png");
   image4 = loadImage("Arrow4.png");
    
  }
  
  void update()
  {
   render();
   move();
  }
  
  void render()
  {
   image(image1, this.x, this.y); 
  }
  
  void move()
  {
    
   x +=speedX; 
   y +=speedY; 
   
   if(x<0||x>(width-50))
   { speedX *=-1;}
   
   if(y<0||y>(height-50))
   { speedY *=-1;}
    
  }   
}
processing java
2 Answers

Just draw the image depending on the direction

Arrows(int x, int y) {
    // [...]

   void render() {
       if (speedY > 0) {
           if (speddX > 0) {
               image(image3, this.x, this.y); 
           } else {
               image(image4, this.x, this.y);
           } 
       else {
           if (speddX > 0) {
               image(image1, this.x, this.y); 
           } else {
               image(image2, this.x, this.y);
           } 
       }
   }
user_55777650

Another way to do it with the use of just 1 image is by making use of processing's ability to influence the drawing matrix (changing the orientation and origin from which you processing will draw).

   void render() {
       pushMatrix(); // store current matrix
       translate(this.x, this.y); // change drawing matrix origin to image coords
       if (speedY > 0) {
           if (speedX> 0) {
                // rotate drawing matrix in right direction
                rotate(radians(0));
           } else {
                rotate(radians(90));
           } 
       else {
           if (speedX> 0) {
                rotate(radians(180));
           } else {
               rotate(radians(270));
           } 
       }
       image(arrow, 0, 0); // draws the rotated angle at new 'origin'
       popMatrix(); // undo translate/rotate, return to previous drawing matrix
   }

The input degrees may not work when you copy and paste this code. This is because you have to rotate the image in each case depending on the original direction the image is pointing in. (You can also save a call to rotate for the original direction the image is pointing into).

user_120946080
Related