stuck again (Invaders)

How do I make these aliens into one variable? Once I start shooting them, they become a mess of confusion.

I have no idea what do to.

If you answer, please talk to me like you'd talk to a five year old... Thanks.

https://openprocessing.org/sketch/421935

Answers

  • Learn about ArrayList.

  • edited April 2017

    First, stop having three classes for three different types of aliens. Have one class of aliens, and add a type variable to that class that determines what a specific alien looks like.

    Then, add a boolean to that class as well, that determines if an alien exists any more. Do not draw aliens that do not exist. Do not bother updating their position. Do not cause the aliens to change direction because of an alien that does not exist.

    Now when you shoot them, if an alien gets hit, all you need to do is change that value from true to false...

  • Hi Tf, I work in p5 and i think classes in p5 are called constructor functions. I have three aliens, where or how do I start to make one class. Or how do I start or where do I look to get going with regards to your first paragraph?

  • edited April 2017

    @tim50 -- whether you choose to call p5.js classes "classes" or not...

    https://github.com/processing/p5.js/wiki/JavaScript-basics#objects

    ...TfGuy's advice is that you have three of them, and you should combine them into one. So instead calling three different constructor functions "Alien()" "Alien1()" "Alien2()" you would pass a type argument to a single constructor function, "Alien()", which does something different depending on the argument: "Alien(0)" "Alien(1)" "Alien(2)"

  • I did this. Now I only have one class. I don't have an array. If I had an array, I'd only be able to make an unlimited amount of ONE of the ellipses- the first one. Does the term "type variable" mean something?

    https://openprocessing.org/sketch/422108

  • Each of your Aliens has an X position, right? Even though it is different for each Alien, you have an X position variable in your Alien class (or object constructor function), so each Alien has their own copy of an X position variable.

    Do the same thing for a new variable, but store a number for the TYPE of Alien that each alien is. So Some Aliens will have a type-value of 0, some will have 1, and some will be 2. Then draw the aliens differently based on the value each alien has stored in it's own copy of the type variable.

  • edited April 2017

    Does the term "type variable" mean something?

    No. It short for "what-TYPE-of-alien-is-it variable."

    edit: example written in Processing(Java), not p5.js

    class Alien{
      int alienType;
      Alien(int type){
        alienType = type;
      }
      void display(){
        if(alienType==0){
          // draw type 0
        }
        if(alienType==1){
          // draw type 1
        }
      }
    }
    
  • edited April 2017

    My x and y positions are a mess.

    translate(this.x, this.y); 
    alien_2[m++] = new Alien2(-100 + (190*i), 25 + (190*j));
    aliens[m++] = new Alien(-30 + (135.5*i), 435 + (105*j));
    alien1[m++] = new Alien1(-30 + (105.4*i), 235 + (93*j));
    
  • edited April 2017

    I don't know what I'm doing and I have no idea where to go from here. I don't know (and it's going to take me a while to know) what a different class is going to mean about anything... Would you guys say, my code is completely off?

  • I'm really stuck. I think you guys are saying: Make one class and put the three aliens in one constructor and put them into an array then you have them as [0, 1, 2].... so I guess if that is what you are saying, I should be able to figure that out... but will that help the overall problem I have with hit detection?

  • Here is an example. It has one Alien class, but there are three types of aliens. Notice that the class has a type variable, which determines the shape and color for each alien.

    class Alien { // A SINGLE CLASS.
      int type; // WITH MANY TYPES.
      float x;
      Alien(int itype, float ix){
        type = itype;
        x = ix;
      }
      void draw(){
        switch(type){ // What type of alien is this?
          case 0: // Red square alien.
            fill(255,0,0);
            rect(x,200,40,40);
            break;
          case 1: // Green triangle alien.
            fill(0,255,0);
            triangle(x,220,x+20,180,x-20,180);
            break;
          case 2: // Blue circle alien.
            fill(0,0,255);
            ellipse(x,200,40,40);
            break;
        }
        // And draw a generic face.
        fill(255);
        ellipse(x-4,190,6,6);
        ellipse(x+4,190,6,6);
        fill(0);
        ellipse(x-4,190,2,2);
        ellipse(x+4,190,2,2);
        rect(x,200,16,2);
      }
    }
    
    Alien [] aliens; // A SINGLE ARRAY.
    
    void setup(){
      size(800,400);
      rectMode(CENTER);
      ellipseMode(CENTER);
      noStroke();
      aliens = new Alien[3];
      for(int i = 0; i < aliens.length; i++){
        aliens[i] = new Alien(i, 200 * (i+1));
      }
    }
    
    void draw(){
      background(0);
      for(int i = 0; i < aliens.length; i++){
        aliens[i].draw();
      }
    }
    
  • edited April 2017

    Yes, that is exactly what I mean. And then, once you have one class for Aliens, you won't have to have three copies of the hit-detecting code. You will also be able to add a single boolean to the class that gets set to true when an Alien is hit.

  • edited April 2017

    Jeremy left this above. If I were to do this, would it help me at all? I can do this but there is no array so why would I want to do it?

    https://p5js.org/examples/objects-multiple-objects.html

    I can make one class and one constructor but I can't get those methods or whatever they are called into one array because the array uses the class name, not the constructor part that says: this.alien1 = function(). I don't know processing. That will just confuse me more. Where does the type variable thing go? Do I use push?

    aliens = [];
    
     function Alien() {
       this.x = ___;
       this.y = ____;   
    
       this.alien1 = function(){
      }
       this.alien2 = function(){
      }
       this.alien3 = function(){
      }
    }
    
    for (var i = 0; i < 10; i++){
          aliens[i] = new Alien
    

    NOTE: Should I just take a screenshot of the aliens, buy photoshop, create a png, and after a year of trying to figure all that out, use a png image for the aliens? or will that not work?

  • Okay, here is the same example done using P5.js:

    function Alien(itype, ix){
    
      this.type = itype;
      this.x = ix;
    
      this.draw = function() {
        push();
        translate(this.x,60);
        switch(this.type){ // What type of alien is this?
          case 0: // Red square alien.
            fill(255,0,0);
            rect(0,0,40,40);
            break;
          case 1: // Green triangle alien.
            fill(0,255,0);
            triangle(-20,-20,20,-20,0,20);
            break;
          case 2: // Blue circle alien.
            fill(0,0,255);
            ellipse(0,0,40,40);
            break;
        }
        // And draw eyes on it.
        fill(255);
        ellipse(-4,-10,6,6);
        ellipse(4,-10,6,6);
        fill(0);
        ellipse(-4,-10,2,2);
        ellipse(4,-10,2,2);
        pop();
      } // End of draw()
    
    } // End of Alien()
    
    var aliens = [];
    
    function setup(){
      createCanvas(windowWidth,windowHeight);
      rectMode(CENTER);
      ellipseMode(CENTER);
      noStroke();
      for(var i = 0; i < 3; i++){
        aliens.push(new Alien(i, 60 * (i+1)));
      }
    }
    
    function draw(){
      background(128);
      for(var i = 0; i < aliens.length; i++){
        aliens[i].draw();
      }
    }
    
    function windowResized() {
      resizeCanvas(windowWidth, windowHeight);
    }
    

    See how there is one Alien function? Any object created by the Alien() constructor function is an Alien. But there are three types of Aliens, and the type is passed to the Alien() function as a parameter. The stored type then determines how the Alien actually looks when it is drawn.

    The "type" variable could be named anything. The concept here is that each Alien has it's own copy of the variables used in the Alien() constructor function, and "type" is just one of them. You can now add other variables (and behavior) to this single class.

  • Thanks Tf... Sorry, just frustrated. I better go away from it for a bit.

Sign In or Register to comment.