S21 Challenge: GPA Calculator Solved

Description: Create a Java 8 SE application in NetBeans using JavaFX that contains four buttons, five labels, four text fields, and one text area. JavaFX code is to be used to create the buttons, labels, text fields, text area, and the user interface (UI). The UI objects are to be laid out using a GridPane, based on the design specified in the requirements.

Purpose: This challenge introduces the use of JavaFX to create Java user interfaces.

Requirements:

Project Name: <Pawprint>GPACalculatorS21

For the Project Name, follow the same naming scheme used in the previous challenges. The Project Name is to be comprised of your pawprint with the first letter capitalized followed by GradeCalculatorS21. For example, if the pawprint is abcxyz9 the project is to be named Abcxyz9GPACalculatorS21.

In NetBeans create a JavaFX Application project for this challenge. The project that is created will contain sample code that displays a button that when clicked prints “HelloWorld!” to standard output. You will need to replace the sample code in the start() method with the code you write to meet the requirements of this challenge.

Write the code necessary to do the following inside the start() method of the application’s Main Class which will be a subclass of Application.

The user interface (UI) is to contain four buttons, five labels, one text area, and four text fields. The five labels are set to text “Course 1 :”, “Course 2 :”, “Course 3 :”, “Course 4:”, and “Information:”. The four text fields can be named as score1, score2, score3, and score4. The last text area can be named infoArea. The text on the first button is to be “Calculate Average Score”, the second button “Calculate GPA”, the third button “Alert”, and the fourth button " Clear All".

    • Make sure you use proper naming conventions when naming your fields, methods, constructors, the objects created for the JavaFX components, and other members.

    • When the “Calculate Average Score” button is clicked, the infoArea text area will be set to “Your average score is: ((<SCORE1> + <SCORE2> + <SCORE3> + <SCORE4>) / NUMOFSCORES) = <Average Score>” in which the SCORE1, SCORE2, SCORE3, and

1
S21 Challenge: GPA Calculator


SCORE4 are actual values in the text fields of score1, score2, score3, score4, and the Average Score is the average of the four scores.

    • When the Calculate GPA button is clicked, the infoArea text area will be set to “Your GPA is: <GPA Value>” in which GPA Value is a string generated based on the average score of the four courses.

o  NOTE 1: Scale for calculate the GPA Value:

        ◦ A: [87, 100]

        ◦ B: [77, 87)

        ◦ C: [67, 77)

        ◦ D: [60, 67)

        ◦ F: [0, 60)

    o NOTE 2: In order to read in the values from the text fields, you will need to research about conversions from String to int.

        o NOTE 3: Make sure you have proper error checking for any input fields or elements. If the user enters characters, an error should be alerted to the user. If the user enters a score outside of the range, then there should be an error alerted to the user. Not having proper error checking for user input will result in a loss of points.

    • When the Clear button is clicked then all four text fields are cleared, and the text area is cleared.

    • When the Alert button is clicked the information in the text area infoArea should be displayed in a JavaFX alert box. If the text area is empty, the message will be: "There is nothing to display."

A GridPane is to be used to position the UI elements. A value of 10 is to be used for the horizontal and vertical gaps of the GridPane. The alignment is to be set centered (Pos.BASELINE_CENTER) on the GridPane for the positioning of UI elements. The GridPane should have padding set to 15, 15, 15, 15 for each of the four corresponding edges, respectively.

The labels and text fields should be put on the GridPane in the following order: label1, textfield1, label2, textfield2, label3, textfield3, label4, textfield4, label5, and textarea. You may also view the example screenshots below. The following table shows the row and column index of each JavaFX element:

2
S21 Challenge: GPA Calculator





Element
Column
Row
Col Span
Row Span
Label1
0
0
1
1
Textfield1
1
0
1
1
Label2
0
1
1
1
Textfield2
1
1
1
1
Label3
0
2
1
1
Textfield3
1
2
1
1
Label4
0
3
1
1
Textfield4
1
3
1
1
Label5
0
4
2
1
TextArea
1
5
2
1
VBox
0
6
2
1



    • All text fields should have a preferred width of 350 pixels.

    • The text area’s preferred row count should be set to 3 (i.e., “setPrefRowCount” property to 3), set the property “setWrapText” to true, and set the “setEditable” property to false.

    • The Emulate GPA, Calculate GPA, Clear All, and Alert Buttons are to be added to a VBox and the VBox should be added to the GridPane at row 5 and column 0, with a column span of 2 and row span of 1.

    • The VBox should have spacing set to 10 and the alignment is to be set centered (Pos.CENTER)

    • To make all the buttons the same width, set the max width of the button to “Double.MAX_VALUE” and let the VBox handle everything else.
o  Note: DO NOT specify the width of each button individually! You should not go through the trouble of determining the width of each button and then setting the preferred size of each. An easier option is to let the layout panes do the work.

    • The Scene for the JavaFX application is to be 500 pixels of width by 425 pixels of height. The title for the Stage is to be “GPA Calculator”.

Note: Going above and beyond the rest of the class is usually rewarded. The requirements in this document are the minimum requirements and serve as a baseline. Additional

3
S21 Challenge: GPA Calculator


functionality and UI design can be added. If additional items are added, they should function correctly and the UI should be aesthetically pleasing and look like it was intended. If random functionality or random UI elements are added, they will not be rewarded. Make sure you notify the TAs of your extra work by adding a comment on Canvas and/or sending an email.

Note: Some bonus ideas include having more courses to input grades for the GPA calculation or having the user select as many classes as they want (could have a plus button and each time the user presses the plus button a new course appears). You could include additional functionality or have a unique user interface. These are some ideas but should not limit you in what you could do, if you have questions about an idea you want to implement, stop by Professor Wergeles’ office hours or send an email and ask.

Things to submit on Canvas:

    1. The zip file created after you export your project from NetBeans.

    2. Submit screenshots of your application running for proof with the system clock and pawprint. The system clock must have the date and time.

o Take screenshots of your application running, the outputs, the alert working, the prompt working, and screenshots of your code.

o  Similar to the example screenshots below

o Make sure you take screenshots of ALL of your code!!! o The more screenshots the better

o Note: Submit the screenshots as an additional file when uploading files for the canvas assignment submission
        ◦ You may submit several screenshot files (png, jpeg, etc.) and then the ZIP file from the code (all in one submission)














4
S21 Challenge: GPA Calculator









Example Screenshots:

The following are screen captures of how the user interface is to look. If there are differences between the examples and the documentation then follow the requirements in the documentation:

When the app first starts:














































5
S21 Challenge: GPA Calculator










When the “Calculate Average Score” button is clicked:































When the “Calculate GPA” button is clicked:






















6
S21 Challenge: GPA Calculator































When the “Alert” button is clicked:































When the “Clear All” button is clicked:

7
S21 Challenge: GPA Calculator































If the user inputs the wrong value, the program should check the input, and display a message like this:
































8