将基于文本的 UI 传输到 JavaFX GUI

Question

I'm a beginner programmer learning Java and I am making a simpler, university-themed version of Monopoly. I currently have a fully functional text-based version of the game, and I now want to implement a JavaFX GUI while still being able to use the text-based version.

The repository of the text-based version can be found here: https://github.com/desobob11/TeamP-Project/tree/Arnuv

A quick rundown of how the code works: there is a Tile class that represents a tile on the board, which is inherited by all of the specific types of tiles: Chance, Community, Go, Parking, Probation (sort of like jail), and Course (equivalent of property in regular monopoly). Then there is a Student class, which is the equivalent of a player, and a CourseList class, which acts as a container for all of the tiles. The Application acts as the "brain" of the program and incorporates all of these classes, and finally there is the UI aspect, which is what I need help with:

I made a UI interface that contains all of the methods that the back-end code needs for I/O, that way the back-end doesn't care if the UI is text-based or graphical. Then, my TextVisualizer class implements this. I wanted it so that when I make my GUI, I would simply implement UI again and rewrite all of these UI methods in terms of JavaFX functions. I would ideally want it to be so that I ask the user if they want a text-based or graphical UI, then pass the appropriate object to my Application and let it run from there. For the graphics, I wanted to have a window for the board, and separate windows for each student's stats (money, courses owned, etc.). I have the graphics set up for the board and the courses, which are simply PNGs. I am very lost on how to even start constructing this, as my knowledge of how JavaFX works is quite limited. If someone could point me in the direction of the classes and code necessary to set this up, I would be very grateful. Thanks!

Answer 1

The question is pretty broad but I can give you an overview of some basic concepts of JavaFX.

• First of all, make sure all your functions are working properly in the text-based version.
• Each screen of your application will have a separate FXML file.
• Now you may use a tool like Gluon Scene Builder to design the layout of each of the screens. This part is pretty easy as you just need to drag & drop the required elements.
• To link the GUI elements to your original code, you will have to make a controller class for each FXML file. Here you can write your JavaFX functions which would merely call your original functions.
• In the scene builder, on the right menu pane, you can find a section for code. Here you can simply insert name of your JavaFX function next to the desired action event.

I suggest you start by designing the FXML files first and implementing screen transitions and then moving to the individual elements of the screen. Do refer online tutorials to get a better grasp.