Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[+] Basic view of our GUI #20

Merged
merged 11 commits into from
Nov 14, 2022
Merged

[+] Basic view of our GUI #20

merged 11 commits into from
Nov 14, 2022

Conversation

CharlotteChenyy
Copy link
Contributor

@CharlotteChenyy CharlotteChenyy commented Nov 2, 2022

New feature

  • Basic view of the GUI (static scene)
  • Some listeners and events

@CharlotteChenyy CharlotteChenyy changed the title Basic view of out GUI (Still in progress) Basic view of our GUI (Still in progress) Nov 2, 2022
@Lei-Tin
Copy link
Collaborator

Lei-Tin commented Nov 2, 2022

ʕ•̫͡•ʕ•̫͡•ʔ•̫͡•ʔ•̫͡•ʕ•̫͡•ʔ•̫͡•ʕ•̫͡•ʕ•̫͡•ʔ•̫͡•ʔ•̫͡•ʕ•̫͡•ʔ•̫͡•ʔ
Charlotte姐姐也开始发力辣

@CharlotteChenyy
Copy link
Contributor Author

ʕ•̫͡•ʕ•̫͡•ʔ•̫͡•ʔ•̫͡•ʕ•̫͡•ʔ•̫͡•ʕ•̫͡•ʕ•̫͡•ʔ•̫͡•ʔ•̫͡•ʕ•̫͡•ʔ•̫͡•ʔ Charlotte姐姐也开始发力辣

Lab要迟到啦QAQ

@CharlotteChenyy CharlotteChenyy self-assigned this Nov 2, 2022
@CharlotteChenyy CharlotteChenyy linked an issue Nov 2, 2022 that may be closed by this pull request
@CharlotteChenyy CharlotteChenyy added the enhancement New feature or request label Nov 2, 2022
@ScottCTD ScottCTD changed the title Basic view of our GUI (Still in progress) [+] Basic view of our GUI (Still in progress) Nov 6, 2022
@ScottCTD ScottCTD added the help wanted Extra attention is needed label Nov 6, 2022
Copy link
Collaborator

@ScottCTD ScottCTD left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The GUI looks good but there are things to reconsider.

I believe we can make the GUI simpler.

Buttons like setting and import can be moved to the menu bar.

I guess this is a more appealing (and more importantly, simpler) choice:
image

Also, in order to adhere the rubric, the code should be cleaner.

src/main/java/billgates/view/gui/Frame.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/Frame.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/Frame.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/Frame.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/Frame.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/GuiMain.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/RegisterDialog.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/RegisterDialog.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/SignInDialog.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/SignInDialog.java Outdated Show resolved Hide resolved
@ScottCTD
Copy link
Collaborator

Also, to simplify our work, I suggest we can combine login and register.

We only need a user name and a password to login and register.

If the user does not exist in our database, then we automatically register this user.

@ScottCTD
Copy link
Collaborator

In addition, this is a bill demo.

image

@Lei-Tin
Copy link
Collaborator

Lei-Tin commented Nov 11, 2022

The GUI looks good but there are things to reconsider.

I believe we can make the GUI simpler.

Buttons like setting and import can be moved to the menu bar.

I guess this is a more appealing (and more importantly, simpler) choice: image

Also, in order to adhere the rubric, the code should be cleaner.

In other words, the new GUI you are suggesting doesn't have another separate window to control the logging in and register? That would make the GUI much simpler to implement :3

Also, since we can right click to remove an entry, what is the purpose of the button on the left that does "remove entry"?

Copy link
Collaborator

@Lei-Tin Lei-Tin left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't have too much technical comments on the specific implementations of the GUI, but some minor problems are spotted, and most are mentioned by Scott's review.

But overall, the GUI is looking pretty good! However, we might need to consider to switch to Scott's proposal as I believe that works better for our purposes (And maybe easier to implement?)

src/main/java/billgates/view/gui/Frame.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/Frame.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/Frame.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/Frame.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/GeneralButton.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/RegisterDialog.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/RegisterDialog.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/RegisterDialog.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/SignInDialog.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/SignInDialog.java Outdated Show resolved Hide resolved
@ScottCTD
Copy link
Collaborator

The GUI looks good but there are things to reconsider.
I believe we can make the GUI simpler.
Buttons like setting and import can be moved to the menu bar.
I guess this is a more appealing (and more importantly, simpler) choice: image
Also, in order to adhere the rubric, the code should be cleaner.

In other words, the new GUI you are suggesting doesn't have another separate window to control the logging in and register? That would make the GUI much simpler to implement :3

Also, since we can right click to remove an entry, what is the purpose of the button on the left that does "remove entry"?

  • Even in the newly suggested GUI implementation, we still need a dialog to input the username and password. But it is possible to remove the dialog by adding some input fields in the main frame.
  • The buttons like "remove" serve as alternative ways of interacting with entries in case someone doesn't know how to right-click.

@CharlotteChenyy
Copy link
Contributor Author

Also, to simplify our work, I suggest we can combine login and register.

We only need a user name and a password to login and register.

If the user does not exist in our database, then we automatically register this user.

So, we don't need the user to confirm their password when he/she tries to register?

ScottCTD and others added 3 commits November 11, 2022 18:36
Add a resource image for the back button
Redraw the image for backIcon to make it consistent with the GUI
Copy link
Collaborator

@ScottCTD ScottCTD left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Overall great!

There are some style/convention issues that need to be fixed.

The current look of the GUI:
image

TODOs:

  • Add username and password checks.
  • Actions that should be performed after signing out.
  • Fix convention issues.
  • Make the text area not editable.
  • Change the look and feel of the text area like its font.
  • Add menu bar.
  • After adding the menu bar: @eevadai : Incorperate your work done into the new GUI.

src/main/java/billgates/view/gui/ActionPanel.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/ActionPanel.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/ActionPanel.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/ActionPanel.java Outdated Show resolved Hide resolved
Copy link
Collaborator

@Lei-Tin Lei-Tin left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Overall, I think the new GUI looks pretty good! (From Scott's picture)

I still can't get it looking like normal on my Mac XD
The disabled buttons looks completely White, the "Back" button icon is gray for some reasons.
image


Just something to consider:
Do we want to consider the "resizability" of the Window / Frame? (E.g. getting a 1000 * 618 Window on a 4k screen would be pretty sad)

If yes, then maybe we have to remove some of the "Magic number" code smell I have identified earlier. For example, the sizes of the headers and menu bar.


Anyways, good job! The GUI Wise implementation is pretty good looking already!

src/main/java/billgates/view/gui/ActionLabel.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/ActionPanel.java Outdated Show resolved Hide resolved
src/main/java/billgates/view/gui/ActionTextArea.java Outdated Show resolved Hide resolved
Copy link
Collaborator

@Lei-Tin Lei-Tin left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Problems mentioned resolved
GOOD JOB!

@ScottCTD ScottCTD merged commit 688140c into main Nov 14, 2022
@ScottCTD ScottCTD deleted the Charlotte branch November 22, 2022 00:43
@CharlotteChenyy CharlotteChenyy changed the title [+] Basic view of our GUI (Still in progress) [+] Basic view of our GUI Dec 7, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request help wanted Extra attention is needed
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Feature 6] Implement UI using Java Swing.
3 participants