Search code examples
treeprocessingsuperclassdisplayflower

Subclass doesn't display Processing


I'm working on an assignment that needs to create a base class Tree, with subclass Flower. But I don't know where I get it wrong, the flowers don't appear on the tree when mouse is pressed, only the tree appears. Here is my code so far,

Tree tree;
ArrayList<Tree> treeList = new ArrayList<Tree>();

Flower flowers;
ArrayList <Flower> flowerList = new ArrayList<Flower>();

void setup() {
  size(800, 800);
  tree = new Tree(mouseX, mouseY, HALF_PI, height/12);
  flowers = new Flower(mouseX, mouseY, HALF_PI, height/12);
}

void draw() {
  background(255);

  //current tree
  for (int j =0; j < treeList.size(); j++)
  {
    tree = treeList.get(j);
    tree.drawTree(tree.xPos, tree.yPos, tree.rotation, tree.tall);
  }

  //current flower
  for(int i = 0; i < flowerList.size(); i ++){
    flowers = flowerList.get(i);
    flowers.drawFlower();
  }
drawMouseTree(mouseX, mouseY, HALF_PI, height/12);

}

void mousePressed() {
  treeList.add(new Tree(mouseX, mouseY, HALF_PI, height/12));
  flowerList.add(new Flower(mouseX, mouseY, HALF_PI, height/12));
}

void drawMouseTree(float xPos, float yPos, float rotation, float tall) {
  //growing branch 
  float endX = xPos - tall * cos(rotation);
  float endY = yPos - tall * sin(rotation);

  //draw a tree
  stroke(0);
  strokeWeight(2);
  line(xPos, yPos, endX, endY);

  //create 2 branches 
  if (tall > 5 ) {
    drawMouseTree(endX, endY, rotation - PI/5, tall * 0.7); //left
    drawMouseTree(endX, endY, rotation + PI/5, tall * 0.7); //right
  }

  //create flowers each branch
  if (tall > 5 ) {

    stroke(255,102,178);
    fill(255, 102, 178);
    ellipse(endX, endY, 5, 5);
  }
}


class Tree {
  float xPos, yPos;
  float rotation;
  float tall, endX, endY;

  Tree(float xPos, float yPos, float rotation, float tall) {
    this.xPos = xPos;
    this.yPos = yPos;
    this.rotation = rotation;
    this.tall = tall;
  }

  void drawTree(float xPos, float yPos, float rotation, float tall) {
    //end of a branch
    float endX = xPos - tall * cos(rotation);
    float endY = yPos - tall * sin(rotation);

    //draw a tree
    stroke(0);
    strokeWeight(2);
    line(xPos, yPos, endX, endY);

    //create 2 branches 
    if (tall > 5) {
      drawTree(endX, endY, rotation - PI/5, tall * 0.7); //left
      drawTree(endX, endY, rotation + PI/5, tall * 0.7); //right
    }
  }
}

class Flower extends Tree {

  Flower(float xPos, float yPos, float rotation, float tall) {
    super(xPos, yPos, rotation, tall);
  }


  void drawFlower() {
    super.drawTree(xPos, yPos, rotation, tall);

    //create flowers each branch
    if (tall < 40 && tall > 5) { //so the flowers will appear around top of tree


      stroke(255, 102, 178);
      fill(255, 102, 178);
      ellipse(endX, endY, 5, 5);
    }
  }
}

I'm still new to the super-child class concept. Any help to fix this would be very appreciated!

Edit: Find out my mistake of using endX, endY in drawFlower(). Here is the new code:

class Flower extends Tree {

  Flower(float xPos, float yPos, float rotation, float tall) {
    super(xPos, yPos, rotation, tall);
  }

  void drawFlower() {
    super.drawTree(xPos, yPos, rotation, tall);
    //create flowers each branch

    if (tall > 5 ) {
      //draw flower

      stroke(255, 102, 178);
      fill(255, 102, 178);
      ellipse(finX, finY, 5, 5);

    }
  }
}
class Tree {
  float xPos, yPos;
  float rotation;
  float tall, finX, finY;

  Tree(float xPos, float yPos, float rotation, float tall) {
    this.xPos = xPos;
    this.yPos = yPos;
    this.rotation = rotation;
    this.tall = tall;
  }

  void drawTree(float xPos, float yPos, float rotation, float tall) {
    //end of a branch
    float endX = xPos - tall * cos(rotation);
    float endY = yPos - tall * sin(rotation);
    finX = endX;
    finY = endY;

    //draw a tree
    stroke(0);
    strokeWeight(2);
    line(xPos, yPos, endX, endY); //branch

    //create 2 branches 
    if (tall > 5) {

      drawTree(endX, endY, rotation - PI/5, tall * 0.7); //left
      drawTree(endX, endY, rotation + PI/5, tall * 0.7); //right
    }
  }
}

However, the result is: https://i.sstatic.net/vTzOK.png Is there anyway to have a flower on each end branch of the tree? Like this: https://i.sstatic.net/YTdiV.png


Solution

  • The height of your window is 800.

    The last parameter you pass into the Tree or Flower constructor is height/12.

    800/12 is 66.6666..., which gets truncated to 66.

    In other words, the tall variable holds the value 66. You then use that variable in this if statement:

    if (tall < 40 && tall > 5) {
    

    This if statment never evaluates to true, since 66 is not less than 40.

    You can easily test this yourself by simply printing out the value of tall right before that if statement:

    println(tall);
    

    Even if you comment that if statement out, you still won't see flowers. Again, the println() function to the rescue:

      stroke(255, 102, 178);
      fill(255, 102, 178);
      println(endX + ", " + endY); //prints 0.0, 0.0
      ellipse(endX, endY, 50, 50);
    

    The value of endX and endY is always 0 at this point. And that makes sense with how you're using them.

    I see what you're going for here, but at this point in the code you don't really have access to the end position of the branches.

    If I were you, I'd start out much simpler. Instead of using a recursive function to draw your trees, start out with a single line with a flower at the top, then go from there.