I’m doing a Quiz game, so I want to put the questions in a different order automatically. I would have to number each question and use random (), but I do not know how it is numbered. I have not done anything yet.
Hi Pedro,
Your question is not really clear since it lacks of context.
From what I understood, you would need to have a text file with all your question and the associated answers. Then you can load those questions/answers into an array file and every time you need a question, you draw one randomly and delete it from the array to not pick it up again.
To get started, you can make a sketch that load the questions from the text file. After you have done that, you can think of a mechanism to interact you the user: asking the question, get the user input, find if he is correct or not. And only after you have done all of that you can think about the random part. Start small and build up on top of it 
" Then you can load those questions/answers into an array file and every time you need a question, you draw one randomly and delete it from the array to not pick it up again." Could you help me with this?
Missatge de jb4x processingfoundation1@discoursemail.com del dia ds., 1 de set. 2018 a les 10:40:
String[] questions;
boolean[] picked;
int picked_count = 0;
void setup(){
size(600,400);
questions = loadStrings("file.txt");
// Other steps to process questions here maybe.
picked = new boolean[questions.length];
}
int newQuestion(){
if( picked_count == questions.length ){
return( -1 );
}
int r = int(random(questions.length));
if( !picked[r] ){
picked_count++;
picked[r] = true;
return r;
}
return( newQuestion() );
}
See how this works? You’ve got your array of questions, however you store/load it, and then you have an array that records if a question has been picked, and a count to know how many questions have been picked so far.
When you try to pick a new question, it first checks there is still a question that can be picked. Then it picks an index at random. If that one hasn’t been picked yet, great. It has now, and the number of picked ones goes up, and here’s that index. Or maybe it has been picked before, in which case we can just try again.
Some people will say you should do this with a do-while loop. Those people are absolutely right. But setting that up for you might be more confusing.
Wow! The truth is that very interesting, but I do not know if I will be able to serve for what I am doing, look now I’m trying to do everything with images, I mean, I want to put an image where the text of the question comes out, and below it shows other images that are the options you can give. Then I wonder if you can make “packages” of each thing. Let me explain, an example, [First] 1 + 1? and that a response appears in 2 or 3, [Second] 3 + 2? and that appears as a response 3 or 5, [Third] 5 + 5? …
And if the player wants to play again and you do not know the order of the answers, I wonder if you can randomly put the third as the first, second as the third, etc … But with images.
Missatge de Thomas Fifield processingfoundation1@discoursemail.com del dia ds., 1 de set. 2018 a les 19:59:
Once again, yes, that is totally possible. But if you try to get it all working at once the following will happen, in this order:
- You won’t get it to work all at once.
- You will go insane trying to get it to work all at once.
- You will ask us for help trying to get it to work all at once.
- We will go insane trying to help you getting it to work all at once.
The point I am trying to make is FOR THE LOVE OF YOUR DEITIES BOTH HOLY AND UNHOLY, DO NOT TRY TO GET THIS WHOLE THING WORKING AT ONCE.
Here’s the sketch that we would LOVE for you to write:
- At the top it prints the text “Click on the rectangle!”.
- At the bottom it draws two shapes.
- The first shape is a rectangle.
- The second shape is a circle.
- It detects which shape the user clicks.
- If the rectangle was clicked, it goes to a screen that says “Correct!”
- If the ellipse was clicked, it goes to a screen that says “Wrong!”
THAT’S IT.
It doesn’t do multiple questions.
It doesn’t do random questions.
It doesn’t do images at all.
It doesn’t have to do these things right from the start - we can add them later.
But if you try to add them from the start without a working, basic quiz system -> INSANITY.
That’s all we want to see you do. Can you PLEASE TRY to write some code that does that? Just that?
Software development is a process.
PImage sis;
PImage cinc;
PImage quatre;
PImage tres;
void setup() {
size(400, 600);
background(255);
sis = loadImage("hexagon.png");
cinc = loadImage("pentagon.png");
quatre = loadImage("rectangle.png");
tres = loadImage("triangle.png");
image(tres, 20, 220);
image(cinc, 200, 220);
}
void draw() {
}
void mousePressed() {
if ( (mouseX > 20 && mouseX < 190) && (mouseY > 150 && mouseY < 220) ) {
image(quatre, 20, 220);
image(sis, 200, 220);
} else if ( (mouseX > 20 && mouseX < 190) && (mouseY > 150 && mouseY < 220) ) {
image(sis, 20, 220);
image(tres, 200, 220);
}
}
Hello, well, of course I’m programming, every day I try to find what I need in all the processing forums to be able to come out, but sometimes there are things that I do not have and there is no other option to ask. This is what I have. At first it starts with two figures, then I click on one of them and I see two others that I have chosen myself. But then I click again and the other two do not appear.
In short, I do not know why I do not appear figures constantly and second, I would like it to be random. Thanks for the help.
Okay! Now we’re getting somewhere. You have tried to post some code.
Look at it. See how it’s not formatted like code at all? That’s because you need to hit the “format this like code” button.
Edit your post, select you code, and hit the format button, which looks like this: </>
Please format your code by selecting your code and clicking the following icon: </>.
You can edit your post to format your code by clicking on the small pen icon in the bottom right of your post.
Thank you for posting what you have. That’s a good start for us to help you out.
However, we can’t run your project since we don’t have your pictures. You can upload your project on GitHub for that.
Now for your problem, that’s normal that you are not seeing anything happening because you have nothing in the draw() function.
Setup() is run only once at the beginning of your program. Draw() is run 60 times per second and that’s where you want to put your code to change what is on the screen.
You need to have the idea of a state to be able to draw something else depending on the input. Try the following:
int state;
void setup() {
size(400, 400);
state = 0;
}
void draw() {
background(20);
if (state == 0) {
rect(100, 100, 200, 200);
}
if (state == 1) {
ellipse(200, 200, 200, 200);
}
}
void mousePressed() {
state++;
if (state == 2) {
state = 0;
}
}
If you are in state 0, it will draw a rectangle.
If you are in state 1, it will draw a circle.
Now try to apply that principle to the code you already made.
PImage sis;
PImage cinc;
PImage quatre;
PImage tres;
void setup() {
size(400, 600);
background(255);
sis = loadImage("hexagon.png");
cinc = loadImage("pentagon.png");
quatre = loadImage("rectangle.png");
tres = loadImage("triangle.png");
image(tres, 20, 220);
image(cinc,200,220);
}
void draw(){
}
void mousePressed() {
if( (mouseX > 20 && mouseX < 190) && (mouseY > 150 && mouseY < 220) ) {
image(quatre,20,220);
image(sis, 200, 220);
} else if( (mouseX > 20 && mouseX < 190) && (mouseY > 150 && mouseY < 220) ){
image(sis,20,220);
image(tres,200,220);
}
}
PImage sis;
PImage cinc;
PImage quatre;
PImage tres;
int state;
void setup() {
size(400, 600);
background(255);
sis = loadImage("HEXAAGON0.png");
cinc = loadImage("PENTAAGON0.png");
quatre = loadImage("RECTAANGULO.png");
tres = loadImage("TRIAANGULO.png");
}
void draw(){
if (state == 0) {
image(tres,100,100);
}
if (state == 1) {
image(quatre,100,100);
}
}
void mousePressed() {
state++;
if(state == 2) {
state = 0;
}
}
It works!!
1 Like
PImage sis;
PImage cinc;
PImage quatre;
PImage tres;
PImage rectangle;
int state;
void setup() {
size(400, 600);
background(255);
sis = loadImage("HEXAAGON0.png");
cinc = loadImage("PENTAAGON0.png");
quatre = loadImage("RECTAANGULO.png");
tres = loadImage("TRIAANGULO.png");
rectangle = loadImage("RECTANGLE.png");
}
void draw(){
if (state == 0) {
image(tres,200,220);
image(quatre,0,220);
}
if (state == 1) {
image(quatre, 200, 220);
image(tres,0,220);
}
}
void mousePressed() {
state++;
if(state == 2){
state = 0;
}
}
Now I have made 2 figures appear and if you click on the next one, but now how do you know what figure the player has clicked on?
Guys, I have very little left to finish the game, I have done the punctuation, the questions, etc. Now I have to make the questions all random. How can i do it please?
PImage pentagon;
PImage triangle;
PImage sis;
PImage cinc;
PImage quatre;
PImage tres;
PImage rectangle;
int state;
int points;
void setup() {
size(400, 600);
background(255);
quatre = loadImage("RECTAANGULO.png");
tres = loadImage("TRIAANGULO.png");
rectangle = loadImage("RECTANGLE.png");
sis = loadImage("HEXAAGONO.png");
cinc = loadImage("PENTAAGONO.png");
triangle = loadImage("TRIÀNGLE.png");
pentagon = loadImage("PENTÀGON.png");
}
void draw(){
background(255);
fill(0);
textSize(20);
text("score:" + points , 20, 550);
if (state == 0) {
image(rectangle,30,100);
image(tres,200,220);
image(quatre,0,220);
}
if (state == 1) {
image(pentagon,50,100);
image(cinc,200,220);
image(sis, 0, 220);
}
if (state == 2) {
image(triangle,30,100);
image(tres,200,220);
image(cinc,0,220);
}
if (state == 3) {
image(rectangle,30,100);
image(sis,200,220);
image(quatre,0,220);
}
{
}
}
void mousePressed() {
state++;
if(state == 4){
state = 0;
}
{
if (state == 0) {
if((mouseX > 20 && mouseX < 190) && (mouseY > 150 && mouseY < 300)){
points++;
}
}
if (state == 1) {
if((mouseX > 20 && mouseX < 190) && (mouseY > 150 && mouseY < 300)){
points++;
}
}
if (state == 2) {
if((mouseX > 20 && mouseX < 190) && (mouseY > 150 && mouseY < 300)){
points++;
}
}
if (state == 3) {
if((mouseX > 20 && mouseX < 190) && (mouseY > 150 && mouseY < 300)){
points++;
}
}
}
}
For that, you will need to change the structure of your code a bit and put all your image in an array.
That way you will be able to pick a random integer and get the image at that position in the array.
I can’t help you more for now but if I found some time, I’ll try to developp a bit more and give you an example.
Good!
Now the next step would be to change the structure of your code a bit more.
Right now, you have a concept of state but all of your state are predetermined. You want to change that a bit to be able to draw your question randomly. In fact you just have 2 states:
- Pick a random question
- Wait for an answer
You can handle both those state with only one boolean variable.
Here I made an example and called my boolean variable pickNewColor (yours can be named pickNewQuestion for example).
boolean pickNewColor;
color backgroundColor;
void setup() {
size(500, 500);
pickNewColor = true;
}
void draw() {
if (pickNewColor) {
backgroundColor = pickRandomColor();
pickNewColor = false;
}
background(backgroundColor);
}
color pickRandomColor() {
return color(random(255), random(255), random(255));
}
void mousePressed() {
pickNewColor = true;
}
Basically what I’m doing is checking every time in draw() if I need to pick a new color. If so I pick a new one and tell the program it does not need to pick a new one. Then since I changed my color variable, the background is updated accordingly.
Now I need an event to tell me to pick a new color. It happens in the mousePressed() function where all I do is tell to computer I want to pick a new color the next time I go through draw(). Of course I can do something else (like increase a score for example 
)
Now your goal is to understand the mechanics of that piece of code and try to convert it into your problem. As you probably guessed:
-
pickNewColorwould bepickNewQuestion -
backgroundColorwould bequestionNumber -
pickRandomColor()would bepickRandomQuestion()
For now don’t think about randomness, we’ll see that just after and make the pickRandomQuestion really simple like giving you the same questionevery time or giving you the questions in the order of the array.
2 Likes
First, thank you very much for helping me and especially great code. Now I’m starting to understand the code a lot, but when it comes to translating it to my problem it’s difficult for me. Because when you say “color backgroundColor;” I do not know what to change the “color” for something else, and also, when you put “color pickRandomColor ()” I do not know what to change for that “color”.
I understand that now I have to change the “state” of the mouse to boolean, and put the questions in “pickRandomColor ()”.
Hi Pedro,
I can’t help you more than the following code I wrote below without giving you the answer.
I kept the same logic, changed the variables name and commented the important lines.
With that you should be able to have the same behavior of what you currently have but with a new structure.
After that, we’ll be able to get a random question. And even after that, we’ll be able to design a “question” class that will make you life a lot more easier if you want to update the game
There you go:
boolean pickNewQuestion;
int questionNb;
PImage[] myImageArray = new PImage [7];
int points;
void setup() {
size(400, 600);
background(255);
myImageArray[0] = loadImage("RECTAANGULO.png");
myImageArray[1] = loadImage("TRIAANGULO.png");
myImageArray[2] = loadImage("RECTANGLE.png");
myImageArray[3] = loadImage("HEXAAGONO.png");
myImageArray[4] = loadImage("PENTAAGONO.png");
myImageArray[5] = loadImage("TRIÀNGLE.png");
myImageArray[6] = loadImage("PENTÀGON.png");
questionNb = 0;
pickNewQuestion = false;
}
void draw() {
if (pickNewQuestion) { // If we need to pick a new question,
pickRandomQuestion(); // We pick a new one
pickNewQuestion = false; // And we tell the programm that we don't need to pick a new one anymore
}
background(255);
fill(0);
textSize(20);
text("score:" + points, 20, 550);
if (questionNb == 0) {
image(myImageArray[2], 30, 100);
image(myImageArray[1], 200, 220);
image(myImageArray[0], 0, 220);
}
else... // Do that for all you question
}
// This is where you can randomly select your question
// Right now it just give them in an increasing order
void pickRandomQuestion() {
questionNb++;
if (questionNb >= 3) { // 3 is the number of questions you have. Change accordingly
questionNb = 0;
}
}
void mousePressed() {
if (answerClicked(mouseX, mouseY)) { // We first checked if an image has been clicked. If so, we ask for a new question
pickNewQuestion = true;
}
}
// This function is used to check if the user clicked an image.
// If he clicked on one of the three images, it checks if this is the correct one.
// It returns true if one of the image has been clicked.
// It returns false if the users clicked on the background
boolean answerClicked(int x, int y) {
if (questionNb == 0) { // The checks for the first question
if (x > .. && x < .. & ...) { // Check if the user clicked one of the 3 images
if (x > .. && x < .. & ...) { // Check if the image is the correct one
points++;
}
return true;
}
}
if (questionNb == 1) { // Do that for all you questions
...
return false; // If no image has been clicked, it returns false
}
For that, you just need to change that function:
void pickRandomQuestion() {
questionNb++;
if (questionNb >= 9) {
questionNb = 0;
}
}
Instead of giving you the next question it should give you a random one.
Check the reference of processing for that : https://processing.org/reference/random_.html
Also, if you feel like it, your code would really benefit of the use of classes. I advise you to read about it and try to modify your code to implement those concepts.
Hi Pedro,
The answer is still the same: state.
Tight now, you have one state per question:
- state 1: question 1
- state 2: question 2
- …
So just add another condition in the draw() function that is true only where you have answered all the questions.