A Simple Paint Application

This project is a simple application that uses the Model View Controller design pattern. I designed it using the Eclipse IDE and instead of creating a JavaFX application, I chose a JavaFXML project in the project wizard.

Figure 1: Selecting a color using the color picker. 

 Figure 2: Writing text on the canvas by dragging the mouse.

The main container for the application is a BorderPane. At the top, there is a menu bar with one menu named File with two menu items: Save (which saves the drawing on the canvas to a png file) and Exit (which closes the application). Below the menu bar, there is a toolbar that contains a TextField.

Figure 3: The design as it appears in Scene Builder.

The program consists of a TextField, which the you can use to choose the font size of your brush. It also has a ColorPicker that enables you to select the color of your brush, which in this case is your mouse. Finally, there is a CheckBox labeled Eraser, and when it is selected, it deletes the content within its bounds. You can choose a large font size on the text field when you have selected the eraser to delete a large area. There is a Canvas at the center on which you can draw using your mouse.

The function that is called when you click the Save menu item is public void onSave() and the function that is called when the Exit menu item is public void onExit(). The function that is called when one draws on the canvas uses the lambda notation, which helps reduce the amount of code. The lambda notation uses the e -> (); syntax.

Figure 4: The onExit(), onSave() and initialize() methods.

For the people using NetBeans: NetBeans creates a set of default lines of code when you first create the project and these could give you errors when you try to run your program. If you’ve written everything correctly, your project may fail to work because of the initialize function. You need to delete the implements Initializable from the file, and then, delete the public void initialize function at the bottom of the file. For those using other IDEs such as IntelliJ and Eclipse, no need to worry about this, since you have to type out everything from scratch.

For NetBeans users, remove the implements Initializable declaration.

I designed everything in NetBeans IDE. I have already installed the JavaFX Scene Builder 2.0, which one can use to design the program’s user interface using a GUI program. Scene Builder helps you to drag and drop your containers and controls to where you’d like them to be. When you save the Scene Builder file, the changes are automatically updated in the NetBeans XML file. However, I think that learning to design the XML file in code is much better than using the Scene Builder because it helps you learn the XML controls. You can use the Scene Builder when you are working on projects that have a short deadline.

Find attached the code for the project in the compressed file (.zip). I have also added screenshots of the various sections of the project that I feel are important for you to understand. Please play around with the project and let me know what you think. Can you improve it further and make it do other amazing stuff?

Here is the code for the project: