# A Ball bouncing in a rect

**URL:** <https://discourse.processing.org/t/a-ball-bouncing-in-a-rect/19799>\
**Category:** Coding Questions\
**Tags:** homework\
**Created:** [April 15, 2020, 10:42am UTC](https://discourse.processing.org/t/a-ball-bouncing-in-a-rect/19799 "2020-04-15T10:42:52Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![gurki](https://avatars.discourse-cdn.com/v4/letter/g/47e85d/32.png) [@gurki](https://discourse.processing.org/u/gurki)\
**Post date:** [April 15, 2020, 10:42am UTC](https://discourse.processing.org/t/a-ball-bouncing-in-a-rect/19799/1 "2020-04-15T10:42:52Z")

</div>

Hello Guys,

This is my next taks where I need help;

> Schreiben Sie ein Programm mit einem 100x100 Fenster mit einem Ball (Durchmesser 20) in einem Rechteck(Position20,10 - Breite 60, Höhe 80). Verwenden Sie noFill() für das Rechteck!
> 
> Animieren Sie den Ball so, dass er von den Wänden des gezeichneten Rechtecks abprallt. Startpunkt ist 50,50. Geschwindigkeit zufällig im Bereich -3 bis 3 in beide Richtungen. Verwenden Sie float für Position und Geschwindigkeit! Der Ball sollte das Rechteck nie verlassen. Achten Sie darauf, dass der Ball korrekt abprallt. d.h. er berührt die Seiten, aber übertritt sie nicht.

Now this is my unfinished code:

```auto
float x = 0;
float y = 0;
float speed = random(-3,3);

void setup () 
{
  
  size(100, 100);
}

void draw() 
{  
background(0);
  fill(255);
  rect(20, 10, 60, 80);
  
  ellipse(50+x,50+y,20,20);
  x = x + speed ;
  y = y + speed;
  
  if(x >60 && x <40)
  {
    speed = -speed;
  }
  
  if(y >80 && x <20)
  {
    speed = -speed;
  }
  
  
}

```

Now what I dont understand is the noFill() thing.  
When I put it after or before the rect. I cant see anything.  
There I need a solution.

And the If causes are wrong.  
The ball is not gooing backwards.

Can someone give me a hint. Then I will try it again.

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [April 15, 2020, 11:43am UTC](https://discourse.processing.org/t/a-ball-bouncing-in-a-rect/19799/2 "2020-04-15T11:43:21Z")

</div>

> Schreiben Sie ein Programm mit einem 100x100 Fenster mit einem Ball (Durchmesser 20) in einem Rechteck(Position20,10 - Breite 60, Höhe 80). Verwenden Sie noFill() für das Rechteck!

> Animieren Sie den Ball so, dass er von den Wänden des gezeichneten Rechtecks abprallt. Startpunkt ist 50,50. Geschwindigkeit zufällig im Bereich -3 bis 3 in beide Richtungen. Verwenden Sie float für Position und Geschwindigkeit! Der Ball sollte das Rechteck nie verlassen. Achten Sie darauf, dass der Ball korrekt abprallt. d.h. er berührt die Seiten, aber übertritt sie nicht.

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [April 15, 2020, 11:44am UTC](https://discourse.processing.org/t/a-ball-bouncing-in-a-rect/19799/3 "2020-04-15T11:44:54Z")

</div>

Erste Zeile: ` if(x >60 && x <40)` UND zweite Zeile `if(y >80 && x <20) `

- Wo ist der Tippfehler? Tipp: Schaue nach, wo x steht und wo y steht.

- Ausserdem: `if (x>60 && x<40)` —\>\>\> was bedeutet hier das `&&` ? Wann ist die Bedingung WAHR? Tipp: Nie.

Wie lautet die Bedingung richtig, wenn du sie auf Deutsch erläutern solltest?

Beste Grüße,

Chrisir

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [April 15, 2020, 11:53am UTC](https://discourse.processing.org/t/a-ball-bouncing-in-a-rect/19799/4 "2020-04-15T11:53:02Z")

</div>

Es sind eine ganze Reihe von Fehlern in deinem Code.

Du musst einfach mehr testen und mit mehr Ruhe überlegen. Du behelligst sonst das Forum mit jeder einzelnen Aufgabe. Eigentlich solltest du diese ganz alleine lösen können und nur in Ausnahmefällen eine Frage im Forum stellen.

- Warum meinst du z.B., dass speed für x und y stets gleich sein sollte?

**zum Thema `noFill()`**

einfach mal in die **reference** schauen, da steht jeder Befehl erklärt.

`noFill()` stellt die Füllung für alle nachfolgenden Formen (Rechteck, Ellipse…) **aus**.

Dies bleibt erhalten, auch wenn draw() erneut startet (was 60x pro Sekunde passiert).

Beispiel:

```auto

void setup () 
{
  size(500, 500);
  stroke(255, 0, 0);
}

void draw() 
{  
  background(0);

  fill(255); // WEISS 
  rect(20, 10, 60, 80);

  noFill(); // KEINE Füllung
  ellipse(250, 250, 50, 50);

  rect(20, 310, 60, 80); // KEINE Füllung

  fill(0, 0, 255); // BLAU 
  rect(220, 410, 60, 80);
}

```

---

<div class="post-metadata">

**Author:** ![gurki](https://avatars.discourse-cdn.com/v4/letter/g/47e85d/32.png) [@gurki](https://discourse.processing.org/u/gurki)\
**Post date:** [April 15, 2020, 7:53pm UTC](https://discourse.processing.org/t/a-ball-bouncing-in-a-rect/19799/5 "2020-04-15T19:53:34Z")

</div>

Ganz verstehe ich es leider nicht.

Die If werte sind komplett falsch.  
Es prallt leider nicht zurück oder geht über dem Recheck.

```auto
float x = 0;
float y = 0;
float speed = random(-3,3);

void setup () 
{
  background(0);
  size(100, 100);
}

void draw() 
{  
  

  fill(255);
  rect(20, 10, 60, 80);
  fill(255);
  ellipse(50+x,50+y,20,20);
  
  
  x = x + speed ;
  y = y + speed;

  if(x < 20 || x > width-40 ) 
  {
    speed = -speed;
  }
  else{
    speed = -speed;
  }
    
  if(y < 20 || y > height-20)
  {
    speed = -speed;
  }
  else
  {
    speed = -speed;
  }
  
}

```

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [April 15, 2020, 8:37pm UTC](https://discourse.processing.org/t/a-ball-bouncing-in-a-rect/19799/6 "2020-04-15T20:37:59Z")

</div>

Wie gesagt, da speed auch die Richtung bezeichnet, muss speed für x und y unterschiedlich sein.

> [@gurki](#):
>
> ellipse(50+x,50+y,20,20);

Bitte sage hier nicht +50 für x und y, stattdessen gebe x und y anfangs (also vor `setup()`) einen Wert, so dass sich der Ball im Rechteck befindet.

> [@gurki](#):
>
> {  
> speed = -speed;  
> } else  
> {  
> speed = -speed;  
> }

eine if-Abfrage, bei der erste Teil gleich dem else-Teil ist, ist sinnlos. Einer wird immer ausgeführt. Stattdessen lasse den else-Teil bitte fort.