Memory card game

Processing Coding Questions
1

Hi,
I have to make this memory card game in processing and Im a little stuck somewhere. I have three screens and on the third screen the game is displayed based on the selected number of cards in the second screen. This is what I have so far for the memory game:
I can’t seem let the front images show when you click on the back of a card.

PImage backing;
PImage memory;
PImage[] voorkant;
int aantalKaarten = 32;

int kaarten[] = new int [aantalKaarten];

boolean one_showing = false;
boolean two_showing = false;
int aantalKlikken = 0;

boolean beurtSpelerEen;
boolean beurtSpelerTwee;
boolean gelijkeKaarten = false;
int kaartAchterkant = 0;
    
String[] afbeeldingen = {
      "kaart1.jpg",
      "kaart2.jpg",
      "kaart3.jpg",
      "kaart4.jpg",
      "kaart5.jpg",
      "kaart6.jpg",
      "kaart7.jpg",
      "kaart8.jpg",};
      
void drawHetSpel(){ 
  
 background(#BFBFBF); 
 fill(#FF8C00);
 stroke(0);
 rect(windowX, windowY, windowBreedte, windowHoogte);
 backing = loadImage( "kaart0.jpg");      
 voorkant = new PImage[aantalKaarten];
      
 kaartenMaken();
 spelerInformatie();
 kaartDraaien();

}
      
void kaartenMaken(){
 float kaartenX = windowX + 25;
 float kaartenY= windowY + 10;
 float reset = kaartenX;
 aantalKaarten = sliderPositie + 16;
  
 if (aantalKaarten%2==0 && kaartAchterkant == 0) {   
    gelijkeKaarten = true;
 for(int i = 0; i < aantalKaarten; i++){
    image(backing, kaartenX, kaartenY,75,100);
    kaartenX+=85;
        
    if(kaartenX>=windowBreedte){
       kaartenY+=110; 
       kaartenX= reset;
      }
    if(kaartenY >= windowHoogte && kaartenX >= windowBreedte){
      
      }
  }
    
  if(mouseX > kaartenX && mouseX <= kaartenX + 75 && mouseY > kaartenY && mouseY <= kaartenY + 100){
    
    noFill();
    stroke(0,0,255);
    strokeWeight(5);
    rect(kaartenX, kaartenY, 75, 100);
    
  }else{
    stroke(0);
  }
}
 
else{
  gelijkeKaarten = false;
  fill(#BFBFBF);
  rect(width/2-100, height/2, 200, 100);
  fill(0);
  text("Oneven Kaarten, ", width / 2 - 75, height / 2 + 30);
  text("Ga terug! ", width / 2 - 50, height / 2 + 50);
  if(mousePressed && mouseX > width/2-100 && mouseX <= width/2 +100 && mouseY > height/2 && mouseY <= height/2 + 100){
    drawInstellingen();
    level = 1;
  }
 }
}


void spelerInformatie(){
  float spelerEenX =windowX+( windowX * 2);
  float spelerY = windowHoogte - 100;
  float spelerBreedte = 200;
  float spelerHoogte = 100;
  float spelerTweeX = spelerEenX + (windowBreedte / 2);
  
  
  fill(#BFBFBF);
  noStroke();
  rect(spelerEenX, spelerY, spelerBreedte,spelerHoogte);
  rect(spelerTweeX, spelerY, spelerBreedte,spelerHoogte);
  
  fill(0);
  textSize(20);
  text("Speler 1: ", spelerEenX, spelerY-10);
  text("Speler 2: ", spelerTweeX, spelerY-10);
  text("Paren: ", spelerEenX, spelerY+50);
  text("Paren: ", spelerTweeX, spelerY+50);
}

void kaartDraaien(){
  boolean kaartDraaien = false;
  float kaartenX = windowX + 25;
  float kaartenY= windowY + 10; 
  
   if(kaartDraaien == true){
   for(int i = 0; i < aantalKaarten; i++){ 
     voorkant[aantalKaarten] = loadImage("kaart" + i + ".jpg");
   }
  }
  if(mousePressed && mouseX > kaartenX && mouseX <= kaartenX + 75 && mouseY > kaartenY && mouseY <= kaartenY + 100){
   kaartDraaien = true;
   }
  //kaartDraaien = false;
  println(kaartDraaien);
 
}

I hope someone can help me out.
I know there is still a lot left to do to make the code look better:)

1 Like
2

Do front images display with this line commented?
Beause I have an idea, but I cant try it by myself
(nobody can try this code bc we dont have your .jpg files)

3

I hope this will work:
https://drive.google.com/open?id=1OwgO0yDizwzmBbBOcJwjBNV-dAW8b_0z
This is the entie file with images and code :slight_smile:

4 
void kaartDraaien(){
  boolean kaartDraaien = false; // exists only inside the function
  float kaartenX = windowX + 25;
  float kaartenY= windowY + 10; 
  
   if(kaartDraaien == true){
   for(int i = 0; i < aantalKaarten; i++){ 
     voorkant[aantalKaarten] = loadImage("kaart" + i + ".jpg");
      kaartenX += 85;
      kaartenY += 110;
   }
  }
  if(mousePressed && mouseX > kaartenX && mouseX <= kaartenX + 75 && mouseY > kaartenY && mouseY <= kaartenY + 100){
   kaartDraaien = true;
   }
  //kaartDraaien = false;
  println(kaartDraaien);
 
}

I think your problem is that
boolean kaartDraaien = false;
is a variable declared inside the function and you are modifying the variable inside the function,
then the function ends, the variable goes out of scope (stop existing).
The function is called once again and the variable exists again and its false
I tried switching the order : if(mouse pressed … ){…} --> if(kaartDraaien == true){…}
But i get “out of index” error.
(I dont program Java but I see a lot of similiraties with C++, and understand what is written( in english :wink: ))
More than this I cant help, but I hope i was useful
When you started Java?

1 Like
5

Thank you for you reply and time. I will look further into this!
I have to make this for school and we began a couple of weeks ago.

6

The problem is solved

7

@roeludh, @roeludh1
May I like to know how the problem has been solved?
And can I please have your complete working code?
Let me plz know if it is possible!
Thanks!

1 Like
8

Sure, if you want you can leave your email. If that is easier.

9

Well, that is homework and we all try to resist the temptation to offer full code solutions…

And why email, why not publicly?

10

Im not offering the full code, just the solution.

1 Like
11

Hey roeludh,

I have similar problem with the cards.
How did you solved the issue?

12

I made the code inside a mouseClicked function.
I made an if statement inside a for loop inside an if statement like this:

If( game has started){
  for ( here the array for the cards){
    if( the coordinates of your mouse inside a card for the array[i]){
      function clickedOnCard();
    }
  }
}

I hope this helps you a little bit without giving the code solution

2 Likes
13

Awesome Thank you so much

1 Like
14

hi, could you share the source code of this with me?

15

Well, we all try to resist the temptation to offer full code solutions…

17

could you share it with me?

18

Memory card games are easy. Just write a Card class that remembers a card’s position and state, and add a render() function to the class that draws it and a is_mouse_over() function that determines if the mouse is over the card.

Then the main logic needs a single state variable to track which state you’re in when it comes to clicking on cards, and probably a couple of variables to record the values for the first flipped card. The card class itself can deal with some logic too.

class Card {
  int suit, value;
  float x, y;
  boolean face_down;
  Card(int _suit, int _value){
    // ...
  }
  void render(){
    // ...
  }
  void mouse_over(){
    // ...
  }
}

int state, saved_suit, saved_value;
Card[] cards;

void setup(){
  size(600,400);
  // ...  
}

void draw(){
  background(0,200,0);
  // ... draw cards...
}

void mousePressed(){
  // Loop over all cards.
  // If over a card, do stuff.
}
1 Like
19

The only thing is… we aren’t allowed to use classes yet.

20

Then don’t use classes. Your code will be a jumbled mess of arrays, but it can still work.

Instead of a class for the Card, which keeps track of that Card’s variables, you will need an array for each variable, where the i’th value in that array is the value for the i’th card.

int[] suits;
int[] values;
boolean[] is_face_up;
// etc...
1 Like