Need help with creating a quiz

Processing Coding Questions
1

Hey guys, I’m new here to the forums and processing.

For school I’m trying to create a quiz that makes a shape based on your answers.
I want to have around 4 questions with just two answers.

Now what I can’t seem to figure out is how to have the questions change.

Here is what I have so far.


int q=1;
int l=0; 
PFont font;




void setup() {
  size (1600, 800);
  font = loadFont ("Futura.vlw");
  textFont(font); 
  rect(800, 0, 1600, 1600);
}

void draw() { 


  fill(255); 
  rect(0, 0, 800, 400); // question panel
  rect(0, height/2, 400, 400);//left box
  rect(400, height/2, 400, 400);//right box
  rect(800, 800, 1600, 1600); //Drawscape

  fill(0);
  textSize(32);


  //QUESTION1 

  if (q==1) text("Ik zie mijzelf als sociaal", 200, 200);
  if (q==1) text("ja", 200, 600); 
  if (q==1) text("nee", 600, 600); 
  if (q==1) strokeWeight(5);
  if (q==1) fill(255); 

  //QUESTION2

  if (q==2) text("Ik wil graag op vakantie", 200, 200);
  if (q==2) text("ja", 200, 600); 
  if (q==2) text("nee", 600, 600); 
  if (q==2) strokeWeight(5);
}

void mousePressed() {

  if (mousePressed && mouseX > 0 && mouseX < (0 + 400) && mouseY > 400 && mouseY < (400 + 400))
    line (1100, 200, 1200, 100);
  if (mousePressed && mouseX > 0 && mouseX < (0 + 400) && mouseY > 400 && mouseY < (400 + 400))
    q++; 

  if (mousePressed && mouseX > 400 && mouseX < (400 + 400) && mouseY > 400 && mouseY < (400 + 400))
    line (1300, 200, 1200, 100); 
  if (mousePressed && mouseX > 400 && mouseX < (400 + 400) && mouseY > 400 && mouseY < (400 + 400))
    q++;
}

Help would be appreciated guys!

Cheers,

juriaan

2

++ nice screen layout,
++ your code is in </> code tag

  • but could be cleaned up in Processing IDE using [ctrl][t] prior to post it here.

with having 4 questions you could do 4 parts
OR
just make it the good way by creating a array of the 4 questions.

as you say you only have 2 answers ( yes / now )
that part is easy, but still there is something missing, like
for each question:

  • on yes do this
  • on no do that

( or correct or wrong answer )
and so there is also a array … needed.
a step for this i miss in your current program.

but over all, you need a program flow
like a “step counter”
and must design how to operate it
? by a 3rd button “next question”
? by a timer on the graphic show ( like 5 sec show the graphic )
and then go to next question…

also there is not much graphic ( a line go left or right )
that part also need more work.

hope i could give you some ideas???

3

Hello friend thanks for the quick reply! I continued working on the quiz and looks like this so far. I was able to identify some problems. I do have arrays set-up now that switch between the questions.

the quiz is set up so that there are no “right” or “wrong” questions, more of a personality test that creates a shape based on your answers. For this I have one more problem I need to fix. The lines that the mouse press create are being stacked.

how do I make it that question 1 creates a line that stays in place and question 2 creates a separate line? I hope the explanation is a bit clear haha!

I will create a better graphic once I understand the mechanisms of mousepressed ofcourse, Here is my code so far


int q=1;
int l=0; 
PFont font;




void setup() {
  size (1600, 800);
  font = loadFont ("Futura.vlw");
  textFont(font); 
  rect(800, 0, 1600, 1600);
}

void draw() { 


  fill(255); 
  rect(0, 0, 800, 400); // question panel
  rect(0, height/2, 400, 400);//left box
  rect(400, height/2, 400, 400);//right box
  rect(800, 800, 1600, 1600); //Drawscape

  fill(0);
  textSize(32);


  //QUESTION1 

  if (q==1) text("Ik zie mijzelf als sociaal", 200, 200);
  if (q==1) text("ja", 200, 600); 
  if (q==1) text("nee", 600, 600); 
  if (q==1) strokeWeight(5);
  if (q==1) fill(255); 

  //QUESTION2

  if (q==2) text("Ik wil graag op vakantie", 200, 200);
  if (q==2) text("ja", 200, 600); 
  if (q==2) text("nee", 600, 600); 
  if (q==2) strokeWeight(5);
}

void mousePressed() {

  if (mousePressed && mouseX > 0 && mouseX < (0 + 400) && mouseY > 400 && mouseY < (400 + 400))
    line (1100, 200, 1200, 100);
  if (mousePressed && mouseX > 0 && mouseX < (0 + 400) && mouseY > 400 && mouseY < (400 + 400))
    q++; 

  if (mousePressed && mouseX > 400 && mouseX < (400 + 400) && mouseY > 400 && mouseY < (400 + 400))
    line (1300, 200, 1200, 100); 
  if (mousePressed && mouseX > 400 && mouseX < (400 + 400) && mouseY > 400 && mouseY < (400 + 400))
    q++;
}
4

the goal is of course that everybody who answers the quiz gets a unique shape.
but for now I want to figure out how I can get the lines to stay in place. ( I think the void draw keeps replacing them but not sure)

5

you should not draw from inside

mousePressed

need a memory variable:
int answer=0; // open, 1 no, 2 yes

if q == 1 and answer == 1 draw object11
if q == 1 and answer == 2 draw object12
if q == 2 and answer == 1 draw object21
if q == 2 and answer == 2 draw object22

in mousepressed use like

void mousePressed() {

  if (mousePressed && mouseX > 0 && mouseX < (0 + 400) && mouseY > 400 && mouseY < (400 + 400))
answer = 1;

  if (mousePressed && mouseX > 400 && mouseX < (400 + 400) && mouseY > 400 && mouseY < (400 + 400))
answer = 2;

if ( mouseover NEXT button )
q++;
answer = 0;
2 Likes
6

Thank you for all the help! I got it to work!
Now onto the designing of the shapes!

7

You could store the given answers in an array of int.

Yes 2
No 1

Now you can use background at start of draw and do a drawing by looping over the answer array