First of all, note that your "movement" probably isn't exactly what you want.
If my x position is 0, my position increases by 0.03 each time, right?
But if my x position is 199, I move... 6 each time! Whoa!

I think what you really want is movement like:

x += map( abs(width/2.0 - x), 0, width/2.0, 6, .5); // Move .5 near the outsides and 6 near the middle.

Or did you want your speed to increase after moving in one direction for a while? That's something else...

Thanks for the reply, :)

What I was going for was the ellipse to slow on the sides but move a little more free in the center.
I'll try it with your line there and see what I get.

Also I hadn't realized that the .03 was dependent on the x value to how fast it moves as well.

//Edit

thanks tfguy :D that line helped me get the easing to work on the four sides. now all i have to get is the lines to block the ellipse from progressing across the plane. Thanks again :).

Hello,

I am not sure what is the best way to do this (have the lines block the ellipse from progressing across the plane).

Either when moving check in your direction whether there's a line ahead. This seems to be slow and errorprone...

Or you have one Array of vertical and one array of horizontal lines and check those as if it were the screen boundary

http://www.processing.org/learning/topics/bounce.html

this seems better.

you can also paint the lines then going through both arrays with a for loop for each.


Cheers, Chrisir

follwing my second idea I made the following demo

arraylist of only horizontal lines so far

1. ArrayList lines;
2. final int lineWidth = 3;
3. //
4. //
5. // this is the flying shape
6. // see http://www.processing.org/learning/topics/bounce.html
7. int size = 3;        // Width of the shape
8. float xpos, ypos;    // Starting position of shape   
9. float xspeed = 2.8;  // Speed of the shape
10. float yspeed = 2.2;  // Speed of the shape
11. int xdirection = 1;  // Left or Right
12. int ydirection = 1;  // Top to Bottom
13. //
14. // ---------------------------------------------------------------
15. //
16. void setup()
17. {
18.   // init
19.   size(800, 600);
20.   //  frameRate(3);
21.   // Lines: Create an empty ArrayList
22.   lines = new ArrayList();
23.   // A new line object is added to the ArrayList (by default to the end)
24.   lines.add(new Line(10, 210, 100, 210, lineWidth,
25.   color (255, 2, 2)));
26.   lines.add(new Line(210, 140, 290, 140, lineWidth,
27.   color (3, 255, 192)));
28.   //
29.   lines.add(new Line(70, 380, 370, 380, lineWidth,
30.   color (3, 155, 192)));
31.   lines.add(new Line(7, 440, 370, 440, lineWidth,
32.   color (3, 2, 255)));
33.   //
34.   // Set the starting position of the shape
35.   xpos = 12;
36.   ypos = 2;
37.   //
38. } // func
39. //
40. //
41. void draw()
42. {
43.   background(255);
44.   // lines show
45.   drawAllLines () ;
46.   //
47.   // Update the position of the shape
48.   xpos = xpos + ( xspeed * xdirection );
49.   ypos = ypos + ( yspeed * ydirection );
50.   //
51.   // Test to see if the shape exceeds the boundaries of the screen
52.   reflectionOnBoundariesOfTheScreen ();
53.   //
54.   // Test reflection lines
55.   reflectionOnLines ();
56.   //
57.   // Draw the shape
58.   stroke(140);
59.   ellipse(xpos+size/2, ypos+size/2, size, size);
60.   //
61. } // func
62. //
63. // --------------------------------------------------------------------
64. //
65. void drawAllLines () {
66.   // display all lines
67.   for (int i=0; i < lines.size(); i++) {
68.     // An ArrayList doesn't know what it is storing so we have to cast the object coming out
69.     Line myline = (Line) lines.get(i);
70.     myline.display();
71.   }
72. } // func
73. //
74. void reflectionOnLines () {
75.   // Test to see if the shape hits a line
76.   for (int i=0; i < lines.size(); i++) {
77.     // An ArrayList doesn't know what it is storing so we have to
78.     // cast the object coming out
79.     Line myline = (Line) lines.get(i);
80.     if (xpos > myline.x-size && xpos < myline.x2) {
81.       if (ypos <= myline.y-size) {
82.         if ((myline.y-size-ypos)<8.6) {
83.           ydirection = -1*abs(ydirection );
84.         }
85.       }
86.       else {
87.         if (((ypos-myline.y))<8.6) {
88.           ydirection = abs(ydirection);
89.         }
90.       }
91.     }
92.   }
93. } // func
94. //
95. void reflectionOnBoundariesOfTheScreen () {
96.   // Test to see if the shape exceeds the boundaries of the screen
97.   // If it does, reverse its direction by multiplying by -1
98.   if (xpos > width-size || xpos < 0) {
99.     xdirection *= -1;
100.   }
101.   if (ypos > height-size || ypos < 0) {
102.     ydirection *= -1;
103.   }
104. }
105. //
106. // =====================================================================
107. // Simple Line class
108. class Line {
109.   float x;
110.   float y;
111.   float x2, y2;
112.   color myColor;
113.   float speed;
114.   float gravity;
115.   float w;
116.   float life = 255;
117.   Line(
118.   float tempX, float tempY,
119.   float tempX2, float tempY2,
120.   float tempW, color tempmyColor1) {
121.     //
122.     x = tempX;
123.     y = tempY;
124.     x2 = tempX2;
125.     y2 = tempY2;   
126.     w = tempW;
127.     myColor=tempmyColor1;
128.     speed = 0;
129.     gravity = 0.1;
130.   }
131.   //
132.   void display() {
133.     // Display the line
134.     stroke(myColor);
135.     strokeWeight(w);
136.     line (x, y, x2, y2);
137.   }
138. } 
139. // =====================================================================

Greetings, Chrisir   

Sorry about the late reply haha, been busy. But I will most definatly check out the site and your demo that your threw together and see what I can come up with.
Thank a TON,
Nerial

//Edit

Hey again, Ive been messing around with your demo that you posted Chrisir. I can get it to reverse the direction, but it keeps moving on its own. Im confused as how to get it to move only with the arrow keys.(I can get it to move continually and manipulate it with the arrows but it still keeps moving on its own after that)

Here's my code that I have so far:

// Thanks to tfguy44 and Chrisir for helping me get this far :D (I R Still Noob at programming :P)
// I've taken some of their code and atempted to modify it to work (exact outcomes I want not met yet D:)

ArrayList lines;
final int lineWidth = 1;
float x;
float y;
float xpos,ypos;
float xspeed = 2.8;//speed of shape
float yspeed = 2.2;
float easing = .2;
int size = 3;
int xdirection = 1;//left or right
int ydirection = 1;//top or bottom
int radius = 10;
int edge = 56;
int inner = edge + radius;


void setup() {
  size (500, 500);
  strokeWeight(1);
  smooth();
  ellipseMode(RADIUS);
  rectMode(CORNERS);
  //===================================
   lines = new ArrayList();
  // A new line object is added to the ArrayList (by default to the end)
  lines.add(new Line(320, 320, 325, 56, lineWidth,
  color (0,random(255),random(255))));
  lines.add(new Line(210, 140, 290, 140, lineWidth,
  color (0,random(255),random(255))));
  //
  lines.add(new Line(70, 380, 370, 380, lineWidth,
  color (0,random(255),random(255))));
  lines.add(new Line(7, 440, 370, 440, lineWidth,
  color (0,random(255),random(255))));
  //===================================
  xpos = 56; //starting pos for ellipse
  ypos = 56; // ^same^
}

void draw() {
  background(35);
 
  //xpos = xpos + (xspeed * xdirection);
  //ypos = ypos + (yspeed * ydirection);
  drawMovement(); //calls the code for moving the ellipse(see below for info)
  reflectionOnLines();//cals to see if shape hits line or not
  fill(255);
  rect(edge, edge, width-edge, height-edge);
  fill(0, 255, 0);
  rect(76, 76, 56, 56);
  fill(255, 0, 0);
  rect(444, 444, 424, 424);
  fill(216, 117, 11);
  ellipse(xpos, ypos, radius, radius);
  ln();
}

void reflectionOnLines(){
  //test to see if shape hits a line
  for (int i=0; i < lines.size(); i++){
    //ArrayList doesn't know that it's storing so we have to cast the object coming out
    Line myline = (Line) lines.get(i);
    if (xpos > myline.x-size && xpos < myline.x2){
      if(ypos > myline.y-size){
        if ((myline.y-size-ypos)<8.6){
          ydirection = -1 * abs(ydirection);
        }
      }
      else{
        if (((ypos-myline.y))<8.6){
          ydirection = abs(ydirection);
        }
      }
    }
  }
}

class Line{
  float x,y,x2,y2,speed, gravity, w;
  float life = 255;
  color myColor;
  Line(
    float tempX, float tempY, float tempX2, float tempY2, float tempW, color tempmyColor1){
      x = tempX;
      y = tempY;
      x2 = tempX2;
      y2 = tempY2;
      w = tempW;
      myColor = tempmyColor1;
      speed = 0;
      gravity = 0.1;
    }
     void display(){
       //displays the lines
       stroke(myColor);
       strokeWeight(w);
       line (x,y,x2,y2);
     }
}
 



void ln() {
  //display all lines
  for (int i=0; i < lines.size(); i++){
    //an ArrayList doesn't know what it is storing so we have to cast the object coming out
    Line myline = (Line) lines.get(i);
    myline.display();
  //line(320, 320, 325, 56);
  //line(56, 76, 300, 76);
}
}


void drawMovement() { //code to move the ellipse
  if (keyPressed && (key == CODED)) {
    if (keyCode == LEFT) {
      //x -= (x--)*easing; //original code to get ellipse to move
      xpos += map(abs(width/2.0 + xpos),0,width/2.0,6,easing);
    }
    else if (keyCode == RIGHT) {
      //x += (x++)*easing; //original code
      xpos += map(abs(width/2.0 - xpos),0,width/2.0,6,easing);
    }
    else if (keyCode == UP) {
      //y -= (y--)*easing; //original code
      ypos += map(abs(width/2.0 + ypos),0,width/2.0,6,easing);
    }
    else if (keyCode == DOWN) {
      //y += (y++)*easing; //original code
      ypos += map(abs(width/2.0 - ypos),0,width/2.0,6,easing);
    }
    //x = constrain(x, inner, width-inner);
    //y = constrain(y, inner, height-inner); //moved up into void draw(), fixes constrain issues
  }
  }
=============================================================================
there's the code I have, and just wanna say thanks in advance yet again for any help that I can get.

Heylooo again,
Sorry about replying to my own post, it's just that my last reply is a little long so I figured I'd spread it out a bit for a little more clarity.

Okay, so I've added quite a bit of code from tfguy44 and Chrisir's posts/ ideas/ demos, and they've helped out a lot. But alas I'm still having trouble getting the ellipse to react to the lines in the correct way, at least with the arrow keys that is. When I re-add "xpos = xpos + (xspeed * ydirection);" and the same for the ypos, the ellipse reacts to the lines but will keep moving. Below is my code that I've gotten so far and again any help is aforementioned greatly appreciated :).

1. // Thanks to tfguy44 and Chrisir for helping me get this far :D (I R Still Noob at programming :P)// I've taken some of their code and atempted to modify it to work (exact outcomes I want not met yet D:)
2. 
   
3. ArrayList lines;
4. final int lineWidth = 1;
5. float x;
6. float y;
7. float xpos, ypos;
8. float xspeed = 2.8;//speed of shape
9. float yspeed = 2.8;
10. float easing = .2; //how much the ellipse slows as it hits the edge of the constrain
11. int size = 1;
12. int xdirection = 1;//left or right
13. int ydirection = 1;//top or bottom
14. int radius = 9;
15. int edge = 56;
16. int inner = edge + radius; //defines the inner box which is a portion of the constrain as well
17. 
    
18. void setup() {
19.   size (500, 500);
20.   strokeWeight(1);
21.   smooth();
22.   ellipseMode(RADIUS);
23.   rectMode(CORNERS);
24.   //===================================
25.   lines = new ArrayList();
26.   // A new line object is added to the ArrayList (by default to the end)
27.   lines.add(new Line(76, 320, 76, 56, lineWidth, 
28.   color (0, random(255), random(255)))); //sets a line with a random visible color
29.   lines.add(new Line(210, 140, 290, 140, lineWidth, 
30.   color (0, random(255), random(255))));
31.   lines.add(new Line(56, 340, 370, 340, lineWidth, 
32.   color (0, random(255), random(255))));
33.   lines.add(new Line(56, 440, 370, 440, lineWidth, 
34.   color (0, random(255), random(255))));
35.   //===================================
36.   xpos = 56; //starting pos for ellipse
37.   ypos = 56; // "        "   "    "
38. }
39. 
    
40. void draw() {
41.   background(35);
42.   //xpos = xpos + (xspeed * xdirection); // made ball move on its own, didnt want that
43.   //ypos = ypos + (yspeed * ydirection); // "     "    "   "   "   "     "    "    "
44.   drawMovement(); //calls the code for moving the ellipse(see below for info)
45.   reflectionOnLines();//calls to see if shape hits line or not
46.   fill(255); //color of inner box
47.   rect(edge, edge, width-edge, height-edge); //sets where the inner box is located
48.   fill(0, 255, 0); //color of start box
49.   rect(76, 76, 56, 56); //starting box
50.   fill(255, 0, 0); //color of finish box
51.   rect(444, 444, 424, 424); //finish box
52.   fill(216, 117, 11); // color of ellipse
53.   ellipse(xpos, ypos, radius, radius); //defines ellipse 
54.   ln(); //calls lines to be shown
55.   xpos = constrain(xpos, inner, width-inner); //constrains ellipse to inner box
56.   ypos = constrain(ypos, inner, height-inner);// "          "      "    "    "
57. }
    
58. 
    
59. void reflectionOnLines() {
60.   //test to see if shape hits a line
61.   for (int i=0; i < lines.size(); i++) {
62.     //ArrayList doesn't know that it's storing so we have to cast the object coming out
63.     Line myline = (Line) lines.get(i);
64.     if (xpos > myline.x-size && xpos < myline.x2) {
65.       if (ypos > myline.y-size) {
66.         if ((myline.y-size-ypos)<8.6) {
67.           ydirection = -1 * abs(ydirection);
68.  }
69.       }
70.       else {
71.         if (((ypos-myline.y))<8.6) {
72.           ydirection = abs(ydirection);
73.         }
74.       }
75.     }
76.   }
77. }
78. 
    class Line { //how you assign multiple values to multiple lines at the same time; aka an array class
79.   float x, y, x2, y2, speed, gravity, w;
80.   float life = 255; //noidea what this actually does, can be removed and work fine; any ideas?
81.   color myColor;
82.   Line(
83.   float tempX, float tempY, float tempX2, float tempY2, float tempW, color tempmyColor1) {
84.     x = tempX;
85.     y = tempY;
86.     x2 = tempX2;
87.     y2 = tempY2;
88.     w = tempW;
89.     myColor = tempmyColor1;
90.     speed = 0;
91.     gravity = 0.1;
92.   }
93.   void display() {
94.     //displays the lines
95.     stroke(myColor);
96.     strokeWeight(w);
97.     line (x, y, x2, y2);
98.   }
99. }
100. 
     
101. void ln() {
102.   //display all lines
103.   for (int i=0; i < lines.size(); i++) {
104.     //an ArrayList doesn't know what it is storing so we have to cast the object coming out
         Line myline = (Line) lines.get(i);
105.     myline.display();
106.   }
107. }
108. 
     
109. void drawMovement() { //code to move the ellipse 
110.   if (keyPressed && (key == CODED)) {
111.     if (keyCode == LEFT) {
112.       //x -= (x--)*easing; //original code to get ellipse to move now invalid just here to show thought
     
113.        processes :3
114.       xpos += map(abs(width/2.0 + xpos), 0, width/2.0, 6, easing); //updated code to move ellipse with
     
115.       arrow keys
116.     }
117.     else if (keyCode == RIGHT) {
118.       //x += (x++)*easing; //original code
119.       xpos += map(abs(width/2.0 - xpos), 0, width/2.0, 6, easing);
120.     }
121.     else if (keyCode == UP) {
122.       //y -= (y--)*easing; //original code
123.       ypos += map(abs(width/2.0 + ypos), 0, width/2.0, 6, easing);
124.     }
125.     else if (keyCode == DOWN) {
126.       //y += (y++)*easing; //original code
127.       ypos += map(abs(width/2.0 - ypos), 0, width/2.0, 6, easing);
128.     }
129.   }
130. }
     

you have to modify

1. void reflectionOnLines() {