How to Simulate a Multiple Choice Test Question in JavaFX

Java


In this article, we show how to simulate a multiple choice test question in JavaFX.

Since this test in particular that we make has 4 choices to select from and only 1 answer is the correct choice, the best options for the answer choices is to use radio buttons. Radio buttons are the perfect choice because it gives several answer options and only 1 can be selected.

Later we will show how to create a Select All That Apply (SATA) test. This is a test in which 1 or several options may be the correct answer.

In this page, though, we simulate a multiple choice test question.

So there are several things that goes into this multiple choice test question.

When the window first loads, there is a question, the test question.

Then there are 4 radio buttons, representing 4 answer options.

Then there is a button, functioning as the submit button.

That's the basic layout. Now let's talk about the functionality.

So when the question first loads, none of the option are chosen. Therefore, we make the submit button disabled. This is because when none of the options are chosen, we don't want the user to be able to submit an answer when the user hasn't chosen any choice.

After the user clicks on an option, the submit button is enabled, meaning the user can now submit an answer.

After the user clicks on the submit button and submits the answer, we then disable the submit button. We don't want the users changing answers after it's submitted.

So this is the layout and functionality of this multiple choice test question.

The full Java code for this multiple choice test question is shown below.





So just like any JavaFX program, we import all the packages we need to run our code.

We create our public class that extends the Application class, so that we inherit all of the code (classes, methods, etc.) in the Application class.

We override the start() method, which is found in the Application class.

We set the title, create the question by making a label, and create another label that will be used to give output to the user on whether the correct answer was chosen or not.

We then create the button and name it button. We put the text "Submit" on the button.

We then create our radio buttons and link them all to the group question1.

We then disable the submit button by default initially because when the window first loads, none of the answer options are chosen. Therefore, we don't want the user to be able to submit an answer without any options chosen. We disable the button by the line, button.setDisable(true);

Next we add event handlers to all the radio buttons, so that if any of them are clicked and selected, the button will be enabled (or undisabled).

How we do this is through the line, radio1.setOnAction(e -> button.setDisable(false) );

And then we repeat it for all the other radio buttons.

What this code does is when a radio button is clicked, the button gets disabled (or enabled). It, therefore, now can be clicked and the answer can be submitted for the question.

Now we get to the event handler for the button. When the user clicks on the button, the e parameter is triggered, because the clicks represents an event. After this is done, this is where we want to put our code to disable the button.

So in the code that handles the event handler for the button, we disable the button. This is so that the user can't change answer after they have submitted the answer.

The correct answer to the question, "What is 10 + 20?" is 30, which is radio button 3. Therefore, if radio3 is selected, we output that this is the correct answer. We also then disable the button using the statement, button.setDisable(true);

Since all the other choices are wrong, we have an else statement that states that the answer is wrong. In the same manner, we disable the button using the statement, button.setDisable(true);

And this concludes the code needed to disable a button after it is clicked.

The rest of the code finishes building the window. We create the layout, add all elements to the layout, create the scene, add the scene to the stage, and show the stage.

We then launch the program through the main method.

Running the code above gives us the following shown at the link: JavaFX Multiple Choice Test Question.

And this is all that is necessary to simulate a test question in JavaFX.


Related Resources

How to Simulate a Select All That Apply (SATA) Test Question in JavaFX




HTML Comment Box is loading comments...