Share your iP GUI here

[damithc]

If you have managed to implement the iP GUI (i.e., Level-10) already, you are encouraged to share a screenshot of your GUI here.

• If your GUI is close to the one given in the JavaFX tutorial, it will provide a good reference point for those encountering problems while doing Level-10 (i.e., they can compare their code with your code to find what they are doing differently) -- it's good to have a few (about 5) in this category here.
• If your GUI goes beyond the JavaFX tutorial, it will inspire others to learn from yours how to do more things with the GUI -- we can have any number in this category as each might have something new to offer.

[woojiahao]

My GUI looks a little like this:

It is functionally very similar to the original but I just reduced the image/text size of the user and made the emphasis on the text displayed. I also resolved a minor issue with the display container not showing all the content

Hope this helps!

[jason-raiin]

It's basically the same as what the tutorial provided, just with minor customisations to the images and the text.

Tip for VSCode users: sometimes classpaths are wonky and you should try Java: Clean Java Language Workspace Server from the Command Palette (⇧⌘P) if your Class::getResourceAsStream() is throwing IO errors.

[lunaflight]

My GUI looks like this and is basically equivalent to the one in the JavaFX tutorial, just with a different image. I hope this provides a good reference point for anybody!

[keaganpzh]

Mine looks like this:

I wrapped the input and response in text bubbles to simulate the look and feel of a messaging app. I also added timestamps for each message. :-)

[RoeReRe]

My GUI looks similar to the JavaFX tutorial but I played around with the colors and fonts.

The scrollpane essentially contains a VBox of HBoxes. If anyone has trouble with the texts truncating to "..." in your scrollpane, do take a look at your Fit to height and Pref Height settings.

[inezkok]

My GUI looks pretty much like the one in the JavaFX tutorial except that I chaged the images for Duke and the User. For anyone who had troubles with their text becoming an ellipsis in the dialog box, you can remove the prefHeight in the VBox in the MainWindow.fxml

<ScrollPane fx:id="scrollPane" hbarPolicy="NEVER" hvalue="1.0" prefHeight="557.0" prefWidth="400.0" vvalue="1.0">
        <content>
            <VBox fx:id="dialogContainer" prefWidth="388.0" />
        </content>
</ScrollPane>

[shishirbychapur]

My GUI is pretty different from the tutorial. I just linked a CSS file, and touched up a few components to make them look better.

[mingyuanc]

Mine is the same except that I used a text bubble and a circular image for the display picture

[Vanessamae23]

[TeeRenJing]

[Bombbird2001]

Similar to original, added delay between user sending command and bot replying to simulate thinking

[lsyurea]

Similar to the original

[yucongkoo]

For my GUI, it is very similar to the original, just made the picture circular, added some spacing between the picture and text and making the text able to display wholely.

[iyioon]

Here is my GUI with circular image, and some padding to make it nicer 👍

[joeng03]

Here is my GUI with circular images and a send icon

[leezhanpeng]

This is my GUI

As referred from the tutorial.

[lipwei1808]

Here is mine!

[RiyaMehta2211]

here is mine!

[proto-aiken-13]

(Images hand-drawn by me :) )

[damithc]

(Images hand-drawn by me :) )

Nice touch @proto-aiken-13 !

[li-rongzhi]

This is mine!

[A1WAYSD]

Here's mine! Inspired by the animation EVA.

[eyelessrhyme7]

I've added a cool dark theme and randomized motivational quotes from beloved Video-Game character, Capt. Price.

[WangCheng0116]

[mamayuan]

/

[suryanshkushwaha]