Lab 1 (Year 3 Sem 2)

Lab 1 is the first lab in semester 2 of year 3, and the seventeenth lab in the total of year 3. It is a lab for abstraction, encapsulation and revision of OOP/JavaFX, and is considered to be moderately difficult.

Description
The objectives of this lab is to:  Recap on what you have learnt in CS3231 OOP1 on Classes and Objects, and JavaFX Get you started on how to create JavaFX UI using CODE (we focused on SceneBuilder in OOP1) Get you to explore Java Ensemble, and to discover the rich capabilities in JavaFX Get you started in brainstorming for your Project Idea in CS3233 OOP2  Note that you are REQUIRED to complete this lab before you return to school next week. If you did not complete this lab, or find the lab too challenging for you, you will be asked to reconsider if you should continue taking CS3233 OOP2.

Unlocked after completion

 * Star Employee (Score at least 50% for Lab 1: Recap on OOP)
 * OOP reloaded (Score at least 100% for Lab 1: Recap on OOP)

Files

 * CS3231-CS3233 How to Create Executable JAR.pdf
 * Chapter 2 - Inheritance &amp;amp; Polymorphism.pdf
 * Chapter 1 - Abstraction &amp;amp; Encapsulation [Self-Read].pdf
 * CS3231 Chapter 13 - JavaFX with Scene Builder.pdf
 * CS3231 Chapter 12 - Introduction to JavaFX.pdf
 * Ensemble8-all.jar
 * properties.txt

Side note
Rest of files are available [[Media:Y3S2L1.zip|here]].

Note that it might say the files are malicious. They are not, as the zip file contains only the pre-provided files from Coursemology.

Question
Read Chapter 1 of CS3233 on Abstraction and Encapsulation. Explain clearly the difference between abstraction, encapsulation and information hiding. Give relevant example to illustration.

Question
Augment the class Point with the following public methods and constructors. You may find the static methods provided by java.lang.Math useful.  Add a no argument constructor which will use the  keyword to call the constructor provided. The constructor will randomize the x and y value between MIN and MAX (inclusive of MIN and MAX).  Add a toString method which will return a String information of a point in the format "(x, y)" e.g. "(1.0, 2.0)".  Add a static method to construct mid point. Given two points p and q, create and return the midpoint of p and q.  </li> Add a method to find the distance between points. This method returns the Euclidean distance of this point to the point q.  </li> Add a method to find the angle between points. This method returns the angle between the current point and point q. In the figure below, it returns the angle  θ. You can compute this using the atan2 function. For instance, should return 0.7853981633974483 which is <span style=" color: rgba(0, 0, 0, 0.87); font-family: Roboto, &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif;">   <span style="  font-family: MJXc-TeX-math-I, MJXc-TeX-math-Ix, MJXc-TeX-math-Iw;    ">π     <span style="  font-family: MJXc-TeX-main-R, MJXc-TeX-main-Rw;   ">/     <span style="  font-family: MJXc-TeX-main-R, MJXc-TeX-main-Rw;   ">4     π/4   <span style="color: rgba(0, 0, 0, 0.87); font-family: Roboto, &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif;">. should return 0.0. atan2 takes in two double as arguments for coordinate x and y. It returns theta, the angle in radian, counted in anti-clockwise direction with respect to origin. One mathematical trick here is if you subtract the coordinates of Point p from Point q, you basically reduce Point p to be an origin to Point q. For more detail, please refer to the Java API for atan2 for more details. </li> Add a method to move the point by a given distance at direction theta (in radian). See Figure: The new point should have the coordinate  (<span style=" color: rgba(0, 0, 0, 0.87); font-family: &quot;gentium book basic&quot;;">   <span style="  font-family: MJXc-TeX-math-I, MJXc-TeX-math-Ix, MJXc-TeX-math-Iw;   ">x  <span style="  font-family: MJXc-TeX-main-R, MJXc-TeX-main-Rw;   ">+  <span style="  font-family: MJXc-TeX-math-I, MJXc-TeX-math-Ix, MJXc-TeX-math-Iw;    ">d  <span style="  font-family: MJXc-TeX-main-R, MJXc-TeX-main-Rw;   ">cos      <span style="  font-family: MJXc-TeX-math-I, MJXc-TeX-math-Ix, MJXc-TeX-math-Iw;   ">θ   <span style="  font-family: MJXc-TeX-main-R, MJXc-TeX-main-Rw; margin-top: -0.181em;  ">,  <span style="  font-family: MJXc-TeX-math-I, MJXc-TeX-math-Ix, MJXc-TeX-math-Iw;    ">y  <span style="  font-family: MJXc-TeX-main-R, MJXc-TeX-main-Rw;   ">+  <span style="  font-family: MJXc-TeX-math-I, MJXc-TeX-math-Ix, MJXc-TeX-math-Iw;    ">d  <span style="  font-family: MJXc-TeX-main-R, MJXc-TeX-main-Rw;   ">sin      <span style="  font-family: MJXc-TeX-math-I, MJXc-TeX-math-Ix, MJXc-TeX-math-Iw;   ">θ     x+dcos⁡θ,y+dsin⁡θ   <span style="color: rgba(0, 0, 0, 0.87); font-family: &quot;gentium book basic&quot;;">). Note in this method, you are given the angle (theta) and want to find length. Hence you need to use cosine and sine. After p should coincide with q.</li> </ol> Write your own tester class to test all the relevant methods before submission.

Solution
If your test cases are failing, check your toString method, it should not use format but use the representation of double.toString (ie. use + to concatenate to make toString function)

The new point (from moveTo) should have coordinates (x+dcosθ,y+dsinθ).

Question
Review the notes Chapter 13 and 14 from CS3231 as attached to refresh your memory on JavaFX and SceneBuilder. Please ENSURE that you have your laptop configured properly to run JavaFX projects in IntelliJ and SceneBuilder using JDK 13. This is CRITICAL for the module as you will need to work on at FINAL PROJECT for this module (which will REQUIRE you to code your UI with JavaFX).

Options
◻ Mark as Completed

Question
Complete the following E-Learning lesson on JavaFX. View the following video for a basic crash course for coding simple JavaFX UIs (pure code style) from YouTube. (Video is about 12 mins)

Note that the tutorial is for an outdated version of IntelliJ / JDK. Note that you need to have your module-info.java in your project AS WELL AS go to the File &gt; Project Structure &gt; Libraries to add the JavaFX 13 lib folder into so that the JavaFX libraries can be utilised in your code.

Options
◻ Mark as Completed

Question
Review the document on "How to Create Executable JAR". This document will cover how to create an executable JAR (can be opened by a simple double-click) when you create a JavaFX program As there is lack of JavaFX support from Oracle after JDK8, you will need to build the executable JAR with rather unconventional means. This will be useful for you, especially in the module project where you are expected to build your own executable JAR: '''Please follow the document and upload your Hello World executable JAR (able to run by just a simple double-click) with file I/O capabilities (the red text "Read from a FILE" is from "properties.txt"). '''You may download properties.txt for your usage. You may also want to refer to the following Youtube tutorial on how to do it (the tutorial uses JavaFX 11 but it can work for JavaFX versions beyond that): Also, ensure that your Java Runtime Environment (JRE) is updated to the latest version to run executable JAR files properly:  https://www.java.com/en/download/ It will also be good if you are able to create your own executable JAR from CS3231 OOPI PA3 as a result of this too.

Question
Download the Ensemble8 JAR executable and launch the Java Ensemble application: Ensure that your Java Runtime Environment (JRE) is updated to the latest version: https://www.java.com/en/download/ <span style="background-color: rgb(255, 255, 0);">NOTE (Update as of 25 Jun 11am):  <span style="background-color: rgb(255, 255, 0);">The Ensemble8-all.jar SHOULD work for the more popular computer OS (Windows, Mac, Linux) You will see an application as shown below: Ensemble provides a gallery of over 100 sample applications that use a wide range of JavaFX features. Explore Ensemble to see the various UIs that can be created with JavaFX.

Options
◻ Mark as Completed

Question
We will customize the ‘Digital Clock’ application found in Java Ensemble (found under Graphics 2D section). Save all the source code for the Digital Clock example and create a JavaFX Project in IntelliJ. Complete the following: <ol> Edit the code to show the following title "CS3233 OOPII Lab 1: Digital Clock" for the app. </li> Add a ColorPicker (refer to the ColorPicker sample code found under Controls). Copy and edit relevant code from ColorPickerApp.java to DigitalClockApp.java such that you will get the UI below:  Note that the date should show the date when the app is run. When the user use the color picker to select another color, the color of the text "My Digital Java Clock" and the color of Date will be updated accordingly. You may reference the following site on how to retrieve date in java https://www.javatpoint.com/java-get-current-date. </li> </ol> '''Zip up the src folder (from IntelliJ) and upload the zip file.   Ensure you include the image files and module-info.java. '''

Question
Now that you know how to edit and adapt codes from Java Ensemble, you should try to get some ideas on what you can do with JavaFX, and start to brainstorm for ideas for your project. You may also refer to some sample Projects your seniors did (show-cased on AppVenture Website) https://appventure.nushigh.edu.sg/

Options
◻ Mark as Completed