VB.NET: Create a multiple choice quiz using Visual studio 2012
I have been playing around with creating a multiple choice quiz for some time. When I first started I was given help by a couple of people who showed me the basics of getting one working just using code. This was great, what I really wanted was a beginner to be able to follow my example using the Visual studio. I wanted this because I think it is a great learning tool. This way people do not have to be overwhelmed by code to start off.
I am using Visual Studio Ultimate 2012 for this tutorial so let's open it up and get cracking.
First,you need to click on File then left click on New Project you will then see a pop-up window like the one below. If you look in the screen print below there are 3 input boxes labeled
Name
Location
Solution name
These 3 items are fairly self-explanatory, where it says name choose a name for your project and type it in ( make sure you delete the wording that is already there.) IE WindowsApplication4
So I want you to call your quiz MultipleChoiceQuiz like I have done below. You will notice when you change the Name the Solution name will also change
The Location box is where you want to save your files to. Visual studio will automatically save your files to a default location. I think this is best left alone for people just starting to learn there away around Visual Studio.
Now you have changed the name of your project you will now click on Windows Forms Application, You can either double left click on it to open it up or you can left click once to highlight it then click on OK
Your project will now open like mine has in the screen print below. You have actually just created your first form :) but don't get too excited yet :)
You can see where it says Form1 in that little window ( that's the little window your users will see when they open your quiz) we are going to change that to say something a little more interesting. How about My first quiz So put your mouse cursor in the center of that little window and right click on it, then left click on Properties
After left clicking on properties, a new window will open you have not seen before like it has in my screen print below. And what do you know it has highlighted by default the line we want to change. So you can see where it says Form1, I want you to double left click with your mouse and it will become highlighted. You can then change that text to say Multiple Choice Quiz
You can see the screen print below that I changed my text like you just did.
Now let's go back to design view and see what we have achieved. To get back to design view all you need to do is look at the top of your Visual Studio application and left click on the Form that says Form1.vb [Design] just look at my screen print below we all have it :) at the moment you should have the properties tab highlighted so just click on Form1.vb [Design]
Now you have clicked on the design tab your window should have changed to the one below. Now it looks like we are getting somewhere. You have just changed the text to give your quiz a nice little title.
We will add color to our background to make it more attractive and look more professional. So you should be in design view now. If you are not you need to click on the Form1.vb [Design] tab.
Look at my screen print below and you will see our form. You need to place your cursor in the middle of the form and right click, then left click on Properties or you can just click on the Properties tab.
Once the Properties window opens you will see from my screen print you need to left click on BackColor like I have done. Just to the right of BackColor, you will notice a drop down arrow. You need to click on this which will show you a list of colors.
For this lesson I have chosen the color green, you can choose any color you want. But this lesson will work best if you follow me and choose green also. Look at the screen print below and you will see I have chosen green.
You now need to go to design view once again. You can do this by clicking on the design tab which looks like Form1.vb [Design]
You can look at my screen print below to see the changes this has made. Yours should also look like this.
Now before we add buttons to this form and code we shall save and run our little program and check it for errors. So I want you to click on File tab located at the top left corner of Visual Studio and scroll down and click on Save All Your work is now saved. Next, I want you to click on the DEBUG tab which you can see from my screen print below. It is just to the right of the File tab then scroll down and click on Start Debugging
After a second or so you will see your program being run a new window will open and we will see what we have done so far. Just look below at mine.
Adding buttons and control to our form so it serves a purpose If you missed the start of this tutorial click here
Our form at the moment looks like this
Now what we are going to do is add a button. This will give our user something to click on, remember we are going to base this tutorial on a 2 times table quiz. The first thing we need to do is use our Toolbox our toolbox is full of useful little gadgets which make our form useful.
So click on View and scroll down to Toolbox and left click on it like I have done in the screen print below.
The toolbox in Visual Studio can be very useful it almost is the visual studio. Look below you can see that when I clicked on Toolbox it placed it near the bottom of my page. There is a scroll bar on my toolbox which allows me to scroll through all the different things it can do.
I want you to double left click on Button this will place a button on our form like you can see in my screen print below-called screenprint button
screenprint button
The first thing we are going to do is rename our button. So right click on your button and left click Properties, this will take you to the Properties page. Look at my properties page below. I have cut it short a bit just showing the more useful options and of course what we need.
You can see where it says Text just above to the right of that it says Button1 you need to remove that text and change it to 2 times table like I have done in the screen print below. Then switch back to design view by clicking the Form1.vb [Design] tab.
Look at my design view below, see how the text has changed.
With Buttons, you can drag the to where ever you want them on your form have a little go now. Left click on your button and hold the left button down while dragging your mouse. When you have finished dragging your button to where ever it needs to be left click somewhere on the green. This will just remove the pointer arrows around the button so you can not accidentally delete the button.
This is a screen print of what we have so far.
OK, what I want you to do is this create a new form, wait!! I mean add a new form to our project. To do that you need to click on Project at the top which is just to the right of File look below in my screen print and you will see it.
So like I said left click on Project and scroll down to Add Windows Form a new window will open like the one below.
Now highlight Windows Form and click on Add for this tutorial we will not bother changing the name of any forms we are just accepting the default name.
You will notice the default name of mine is Form13.vb yours will most definitely say Form2.vb so do not be concerned about that :) just leave it alone.
OK, now your new form will be open in front of you and it will look like mine below.
Look at the tabs on my form there are 4 open they are Form2.vb Design Properties Form1.vb Form1.vb Design
Now make sure Form2.vb Design is open I want you to place your cursor in the middle of the forms window and double left click on it. This will open a new window and a new tab. The new window will look like mine below. I want you to delete all of the writing in this windows so that it is blank.
You should now have a blank window open in front of you like mine below.
Now for some code, I want you to copy the code below that is in bold and paste it into your window above.
Option Strict On
Public Class Form2
Dim TestAboutMe As New Quiz3x
Friend WithEvents QuizStart, AnswerSubmit As New System.Windows.Forms.Button
Friend WithEvents RadioButton1, RadioButton2, RadioButton3, RadioButton4 As New System.Windows.Forms.RadioButton
Friend WithEvents Label1 As New System.Windows.Forms.Label
Private Sub Form2_FormClosing(sender As Object, e As System.Windows.Forms.FormClosingEventArgs) Handles Me.FormClosing
Me.Dispose()
End Sub
Private Sub Form1_Load(sender As System.Object, e As System.EventArgs) Handles MyBase.Load
Me.Width = 297 : Me.Height = 389 : Label1.Top = 0
Label1.Text = "Click 'Start Quiz' to begin the quiz."
Label1.Width = Me.Width
RadioButton1.Top = Label1.Top + Label1.Height
RadioButton2.Top = RadioButton1.Top + RadioButton1.Height
RadioButton3.Top = RadioButton2.Top + RadioButton2.Height
RadioButton4.Top = RadioButton3.Top + RadioButton3.Height
RadioButton1.Width = Me.Width : RadioButton2.Width = Me.Width
RadioButton3.Width = Me.Width : RadioButton4.Width = Me.Width
RadioButton1.Checked = False : RadioButton2.Checked = False
RadioButton3.Checked = False : RadioButton4.Checked = False
RadioButton1.Visible = False : RadioButton2.Visible = False
RadioButton3.Visible = False : RadioButton4.Visible = False
AnswerSubmit.Visible = False
AnswerSubmit.Top = Me.ClientRectangle.Height - AnswerSubmit.ClientRectangle.Height
QuizStart.Top = Me.ClientRectangle.Height - QuizStart.ClientRectangle.Height
QuizStart.Text = "Start Quiz" : AnswerSubmit.Text = "Submit Answer"
Me.Controls.Add(AnswerSubmit) : Me.Controls.Add(QuizStart)
Me.Controls.Add(RadioButton1) : Me.Controls.Add(RadioButton2)
Me.Controls.Add(RadioButton3) : Me.Controls.Add(RadioButton4)
Me.Controls.Add(Label1) : AnswerSubmit.Visible = False
AddHandler QuizStart.Click, AddressOf QuizStart_Click
AddHandler AnswerSubmit.Click, AddressOf AnswerSubmit_Click
End Sub
Private Sub QuizStart_Click(sender As System.Object, e As System.EventArgs)
ResetQuiz() : UpdateQuestion() : QuizStart.Visible = False : AnswerSubmit.Visible = True
End Sub
Private Sub AnswerSubmit_Click(sender As System.Object, e As System.EventArgs)
Dim Answer As Integer = 0
If RadioButton1.Checked = True Then Answer = 1
If RadioButton2.Checked = True Then Answer = 2
If RadioButton3.Checked = True Then Answer = 3
If RadioButton4.Checked = True Then Answer = 4
Select Case Answer
Case 1 : TestAboutMe.GradeQuestion(RadioButton1.Text)
UpdateQuestion()
Case 2 : TestAboutMe.GradeQuestion(RadioButton2.Text)
UpdateQuestion()
Case 3 : TestAboutMe.GradeQuestion(RadioButton3.Text)
UpdateQuestion()
Case 4 : TestAboutMe.GradeQuestion(RadioButton4.Text)
UpdateQuestion()
Case Else : MsgBox("You must check an answer!")
End Select
Select Case TestAboutMe.TestComplete
Case True
RadioButton1.Text = "" : RadioButton2.Text = ""
RadioButton3.Text = "" : RadioButton4.Text = ""
Label1.Text = Math.Round((TestAboutMe.CorrectAnswers / TestAboutMe.TotalQuestions) * 100, 2) & "% You got " & TestAboutMe.CorrectAnswers & " question(s) out of " & TestAboutMe.TotalQuestions & " right."
RadioButton1.Checked = False : RadioButton2.Checked = False
RadioButton3.Checked = False : RadioButton4.Checked = False
RadioButton1.Visible = False : RadioButton2.Visible = False
RadioButton3.Visible = False : RadioButton4.Visible = False
AnswerSubmit.Visible = False : QuizStart.Visible = True
Case Else
RadioButton1.Checked = False : RadioButton2.Checked = False
RadioButton3.Checked = False : RadioButton4.Checked = False
End Select
End Sub
Sub ResetQuiz()
TestAboutMe.Clear()
TestAboutMe.AddQuestion( Quiz.Question("What is 2 x 1 ?", {"2", "3", "5", "7"}.ToList, "2"))
TestAboutMe.AddQuestion( Quiz.Question("What is 2 x 2 ?", {"3", "5", "4", "7"}.ToList, "4"))
TestAboutMe.AddQuestion( Quiz.Question("What is 2 x 3 ?", {"6", "99", "7", "1"}.ToList, "6"))
TestAboutMe.AddQuestion( Quiz.Question("What is 2 x 4 ?", {"8", "0", "9", "2"}.ToList, "8"))
TestAboutMe.AddQuestion( Quiz.Question("What is 2 x 5 ?", {"12", "10", "5", "7"}.ToList, "10"))
TestAboutMe.AddQuestion( Quiz.Question("What is 2 x 6 ?", {"6", "66", "666", "12"}.ToList, "12"))
TestAboutMe.AddQuestion( Quiz.Question("What is 2 x 7 ?", {"13", "15", "14", "55"}.ToList, "14"))
TestAboutMe.AddQuestion( Quiz.Question("What is 2 x 8 ?", {"15", "14", "17", "16"}.ToList, "16"))
TestAboutMe.AddQuestion( Quiz.Question("What is 2 x 9 ?", {"17", "18", "12", "33"}.ToList, "18"))
TestAboutMe.AddQuestion( Quiz.Question("What is 2 x 10 ?", {"20", "18", "19", "22"}.ToList, "20"))
TestAboutMe.AddQuestion( Quiz.Question("What is 2 x 11 ?", {"23", "24", "22", "32"}.ToList, "22"))
TestAboutMe.AddQuestion( Quiz.Question("What is 2 x 12 ?", {"23", "24", "25", "12"}.ToList, "24"))
RadioButton1.Checked = False : RadioButton2.Checked = False
RadioButton3.Checked = False : RadioButton4.Checked = False
RadioButton1.Visible = True : RadioButton2.Visible = True
RadioButton3.Visible = True : RadioButton4.Visible = True
End Sub
Sub UpdateQuestion()
TestAboutMe.NextQuestion()
Label1.Text = TestAboutMe.CurrentQuestion.Question
RadioButton1.Text = TestAboutMe.CurrentQuestion.Choices(0)
RadioButton2.Text = TestAboutMe.CurrentQuestion.Choices(1)
RadioButton3.Text = TestAboutMe.CurrentQuestion.Choices(2)
RadioButton4.Text = TestAboutMe.CurrentQuestion.Choices(3)
End Sub
End Class
Public Class Quiz3x
Private Property _Questions As New List(Of Question)
Private Index As Integer = 0
Private _CurrentQuestion As Question
Private Property _CorrectAnswers As Integer = 0
Private Property _TestComplete As Boolean = False
Public ReadOnly Property TestComplete As Boolean
Get
Return _TestComplete
End Get
End Property
Public ReadOnly Property CurrentQuestion As Question
Get
Return _CurrentQuestion
End Get
End Property
Public ReadOnly Property TotalQuestions As Integer
Get
Return _Questions.Count
End Get
End Property
Public ReadOnly Property CorrectAnswers As Integer
Get
Return _CorrectAnswers
End Get
End Property
Public ReadOnly Property Questions As List(Of Question)
Get
Return _Questions
End Get
End Property
Public Sub NextQuestion()
Dim TmpIndex As Integer = Index
Index = Index + 1
If TmpIndex > Questions.Count - 1 Then
_TestComplete = True
Exit Sub
End If
_CurrentQuestion = Questions(TmpIndex)
End Sub
Public Sub AddQuestion(ByVal Question As Question)
_Questions.Add(Question)
End Sub
Public Sub GradeQuestion(ChosenAnswer As String)
If ChosenAnswer = CurrentQuestion.CorrectAnswer Then
_CorrectAnswers = _CorrectAnswers + 1
End If
End Sub
Public Sub Clear()
_Questions.Clear()
Index = 0
_CorrectAnswers = 0
_TestComplete = False
End Sub
Class Question
Private _Question As String
Private _Choices As New List(Of String)
Private _CorrectAnswer As String
Public ReadOnly Property Question As String
Get
Return _Question
End Get
End Property
Public ReadOnly Property Choices As List(Of String)
Get
Return _Choices
End Get
End Property
Public ReadOnly Property CorrectAnswer As String
Get
Return _CorrectAnswer
End Get
End Property
Sub New(Question As String, Choices As List(Of String), CorrectAnswer As String)
_Question = Question
_Choices = Choices
_CorrectAnswer = CorrectAnswer
End Sub
End Class
End Class
Now click on the tab which says Form1.vb you will see the code in that window looks like mine below.
Public Class Form1
Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click
End Sub
End Class
You need to add a line of code so it looks like mine below.
Public Class Form1
Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click
Form2.ShowDialog()
End Sub
End Class
You now need to click on File Save All
You can now test your little program by clicking on DEBUG then scroll down to Start Debugging
It should if you followed my steps exactly open up and look like so
There are lots of modifications we can make to the code above, for instance, we could alter that dull gray back-color on Form2 and so forth. The idea of this tutorial was to give you a working multiple choice quiz. And I have. :)
Now your quiz should work if you want to add a timer to the quiz carry on.
So make sure you have form 2 designer open
so make sure our project is still open like mine below. Now look on the right-hand side and you will see I have got my Toolbox showing. You need to find "Timer" double left click on it and it will place a Timer on our project. You will see the Timer just below our project
Now we need to add a textbox, the textbox will display our timer (our timer will start at 0 and count up)
So add a text box to our form, look in your toolbox and double left click on "TextBox" Look at my screen print below to see the added text box. Remember you can left-click and hold to drag the textbox where ever you want it to be on the form. We now need to tell the text box what number we are going to start our timer with.
So now I want you to right click on the textbox and left click properties. You should now see a window like mine below. If you look at my image below you will see there is a highlighted blue line. This is the line we will give our text box a value.
Now I want you to left click on the same line but to the right of it. Your cursor should start flashing there. Put the number 0 there like I have done below. Once you have done that I want you to click on the Form1.vb(Design tab) to take yourself back to where we were.
Now we need to add a button to our form (this will stop the timer) so look in your "Toolbox" for "Button" and double left click on it to add it to your form. Remember you can drag the button to where ever you want it once it is there. (Look at mine below)
Now rename your button to "stop timer" like I have done below. To rename your button you need to right click on it, left click on properties, and when the window changes and you see the blue line change the text to "stop timer" like nine below.
Now switch back to design view like you did before.
Now let's add a little bit of code to our timer to make it do something. Do you remember that little clock face called a timer, You know the one that was placed just below your form
Looks like this
I need you to double left click on it and it will take us to code view for the timer like my screen print below. When in screen view your cursor should allready be flashing in the spot we will enter our code. Look below.
http://www.mastersworldofcomputing.com/images/visual-studio/visual-studio-multiple-choice-quiz-img39
We are going to put our code below the line that looks like
Private Sub Timer1_Tick_1(sender As Object, e As EventArgs) Handles Timer1.Tick
So the code I want you to enter is
TextBox1.Text = CStr(CDbl(TextBox1.Text) + 1)
So your code in all should now be
Private Sub Timer1_Tick_1(sender As Object, e As EventArgs) Handles Timer1.Tick<br>TextBox1.Text = CStr(CDbl(TextBox1.Text) + 1)<br>End Sub<br>End Class
What this code does is tell the timer to count up in 1 so it will go like,
0, 1, 2, 3, 4, 5, 6, 7, 8, and so on and on.
Look at my screen print below I have shown the code for the full Sub below.
Now you need to go back to design view
Now we need to implement one more thing for our code to work. We need to tell the timer when to start, we want the timer to start when the quiz does so here goes.
So go to Form2.vb which is the code view looks like mine below.
http://www.mastersworldofcomputing.com/images/visual-studio/visual-studio-multiple-choice-quiz-img43
You can see in the screen print above I have added 1 simple line of code which looks like:
Timer1.Start()
It is important that you put it in the right place which is why I have shown you a screen print above. Below I have shown what the whole sub looks like with the added code.
Now click on File Save All
Then click on Debug, start Debugging
Then your project should open up and look like mine below. You now need to click on the "2 times table button"
After you have clicked on the 2 times table button another window will open showing your quiz. Just click Start Quiz the 1st question will appear and the timer will start. You can stop the timer you want.
This is the end of this little tutorial I hope it helps people. But my quiz making days are just beginning take a look at the image below
I offer you another type of quiz software with code. If you click on this link it will take you to my QuizMakerv2 page. I have spent longer tan I had anticipated making this quiz. It has may different features just to list a few
admin login
user login
admin writes questions
admin sets a timer
The user takes quiz against the timer
user given the option to submit score to the database
admin can add users
admin can delete users
and much more if you are interested ten go to the link below and read some more. It was actually someone on this site called Kevinnstructor who created the login they just allowed me to implement it into this software.
Anyway here is the link for the other multiple-choice quiz I created
http://mastersworldofcomputing.mathswhizz.org/QuizMakingSoftware/multiplechoice-quiz.php
This is a quick image of what it looks like
http://www.mastersworldofcomputing.com/QuizMakingSoftware/Capture.JPG
Thanks to
http://social.msdn.microsoft.com/profile/kevininstructor/?ws=usercard-mini