Merge pull request #40 from Capstone-Projects-2024-Spring/BP-96-Abili…

…ty-to-select-and-run-game-from-list-of-game-library-in-Tkinter-GUI

Revised some changes to be identical to the concept GUI but barebones

home/homeScreenGui.py

@@ -9,36 +9,45 @@ def on_leave(e, widget):
     widget.config(highlightbackground='grey', highlightthickness=1)
 
 
-def display_game_info(root, game_name):
-    # Clear any existing game information container
-    for widget in root.winfo_children():
-        if hasattr(widget, "game_info_tag"):  # Check if the widget has the tag attribute
-            widget.destroy()
+def display_game_info(game_info_container, game_name):
+    # Clear any existing widgets in the game information container
+    for widget in game_info_container.winfo_children():
+        widget.destroy()
 
-    # Create a new game information container with a unique tag
-    game_info_container = tk.Frame(root, bd=2, relief='groove')
-    game_info_container.pack(side=tk.TOP, fill='x', padx=10, pady=10)
-    setattr(game_info_container, "game_info_tag", True)  # Mark this frame with a tag
+    # Create a frame for the text information
+    text_info_frame = tk.Frame(game_info_container)
+    text_info_frame.pack(side=tk.LEFT, fill=tk.X, expand=True)
 
-    # Create labels and buttons for the new game information
-    tk.Label(game_info_container, text=game_name, font=("Helvetica", 16)).pack()
-    tk.Label(game_info_container, text="Author: You").pack()
-    tk.Label(game_info_container, text="Last Updated: 2/13/2024").pack()
+    # Create labels inside the text information frame
+    tk.Label(text_info_frame, text=game_name, font=("Helvetica", 16), anchor='w').pack(fill='x')
+    tk.Label(text_info_frame, text="Author: You", anchor='w').pack(fill='x')
+    tk.Label(text_info_frame, text="Last Updated: 2/13/2024", anchor='w').pack(fill='x')
 
-    # Placeholder buttons for Play, Edit, and Upload actions
-    play_button = tk.Button(game_info_container, text="Play", bg="red", fg="white")
-    play_button.pack(side=tk.LEFT, padx=5, pady=5)
+    # Create a frame for the buttons
+    button_frame = tk.Frame(game_info_container)
+    button_frame.pack(side=tk.RIGHT)
 
-    edit_button = tk.Button(game_info_container, text="Edit", bg="blue", fg="white")
-    edit_button.pack(side=tk.LEFT, padx=5, pady=5)
+
+    # Create buttons inside the button frame with equal width and height
+    play_button = tk.Button(button_frame, text="Play", bg="red", fg="white")
+    play_button.pack(side=tk.LEFT, padx=5, pady=5, ipadx=20, ipady=20)  # ipadx and ipady add internal padding to make the button square
+    play_button.bind("<Enter>", lambda e, widget=play_button: on_enter(e, widget))
+    play_button.bind("<Leave>", lambda e, widget=play_button: on_leave(e, widget))
+
+    edit_button = tk.Button(button_frame, text="Edit", bg="blue", fg="white")
+    edit_button.pack(side=tk.LEFT, padx=5, pady=5, ipadx=20, ipady=20)  # Same internal padding for square shape
+    edit_button.bind("<Enter>", lambda e, widget=edit_button: on_enter(e, widget))
+    edit_button.bind("<Leave>", lambda e, widget=edit_button: on_leave(e, widget))
 
-    upload_button = tk.Button(game_info_container, text="Upload", bg="green", fg="white")
-    upload_button.pack(side=tk.LEFT, padx=5, pady=5)
+    upload_button = tk.Button(button_frame, text="Upload", bg="green", fg="white")
+    upload_button.pack(side=tk.LEFT, padx=5, pady=5, ipadx=20, ipady=20)  # Same internal padding for square shape
+    upload_button.bind("<Enter>", lambda e, widget=upload_button: on_enter(e, widget))
+    upload_button.bind("<Leave>", lambda e, widget=upload_button: on_leave(e, widget))
 
 
-def render_game_library(root):
+def render_game_library(main_container, game_info_container):
     # Create a container frame with a border
-    container = tk.Frame(root, bd=2, relief='groove')
+    container = tk.Frame(main_container, bd=2, relief='groove')
     container.pack(side=tk.TOP, fill='both', expand=True, padx=10, pady=10)
 
     canvas = tk.Canvas(container, highlightthickness=0)
@@ -71,14 +80,13 @@ def on_frame_configure(canvas):
     game_list_frame.bind('<Configure>', lambda event, canvas=canvas: on_frame_configure(canvas))
 
     # Example list of games to populate the frame
-    games = ["Game 1", "Game 2", "Game 3", "Game 4", "Game 5", "Game 6", "Game 7"]
+    games = ["T T T", "Game 2", "Game 3", "Game 4", "Game 5", "Game 6", "Game 7"]
 
 
     # Add games to the frame
     for game in games:
-        # Modify the size of each game box here if needed
-        box_width = 150  # or some dynamic value based on game
-        box_height = 150  # or some dynamic value based on game
+        box_width = 125 
+        box_height = 125  
 
         # Create a game frame with the specified size
         game_frame = tk.Frame(game_list_frame, width=box_width, height=box_height, bg='#51535B')
@@ -89,7 +97,7 @@ def on_frame_configure(canvas):
         game_label = tk.Label(game_frame, text=f"{game}\n",
                             fg='#FFFFFF', bg='#51535B', font=('Helvetica', 20))
         game_label.pack(expand=True)  # This will center the text in the frame
-        game_label.bind("<Button-1>", lambda event, name=game: display_game_info(root, name))
+        game_label.bind("<Button-1>", lambda event, name=game: display_game_info(game_info_container, name))
 
         # Set the highlightthickness for normal state so that the change is visible on hover
         game_frame.config(highlightbackground='grey', highlightthickness=1)
@@ -107,6 +115,7 @@ def on_mousewheel(event):
         canvas.xview_scroll(int(-1*(event.delta/120)), "units")
     canvas.bind_all("<MouseWheel>", on_mousewheel)
 
+
 # Methods to test if cliking widgets are responsive
 def home_button_clicked_event(event=None):
     print("Home button clicked!")
@@ -166,7 +175,16 @@ def render_top_frame(root):
 
 def initial_render(root):
     render_top_frame(root)
-    render_game_library(root)
+
+    # Main container frame for both the games list and game information
+    main_container = tk.Frame(root)
+    main_container.pack(side=tk.TOP, fill='both', expand=True)
+
+    # Create the game information container and pack it at the bottom of the main container
+    game_info_container = tk.Frame(main_container, bd=2, relief='groove')
+    game_info_container.pack(side=tk.BOTTOM, fill='x', padx=10, pady=10)
+
+    render_game_library(main_container, game_info_container)
 
 def display_home_screen():
     root = tk.Tk()