feat: add black background

main.py

@@ -1,56 +1,62 @@
 
 """
-Here’s a detailed prompt you can use to generate the same GUI code anew using a language model:
+Create a Python program to build a Tkinter-based GUI named "Yiking" for controlling OpenCV parameters. The GUI must meet the following requirements:
 
----
+1. **General Layout**:
+   - **Root Window**:
+     - Background color: Black.
+     - Window title: "Yiking".
+   - **Widgets Layout**:
+     - **Row 0**:
+       - A dropdown (`ttk.Combobox`) to select the camera, with the background and field background set to black and text in gray.
+     - **Row 1**:
+       - Left column: A group of sliders controlling OpenCV parameters, each with a black background, black borders, and gray text.
+       - Right column: A canvas to display images, with a black background and no border.
+     - **Row 2**:
+       - Left column: A "Run" button styled with a black background, gray text, no border, and no highlights.
+       - Right column: A text box for displaying results or error messages, with a black background, gray text, no border, and gray insertion point color.
 
-**Prompt:**
+2. **Widgets Behavior**:
+   - **Camera Dropdown**:
+     - Detects up to 5 connected cameras using OpenCV.
+     - Lists detected cameras as "Camera 0", "Camera 1", etc.
+     - Default selection is the first detected camera.
+   - **Sliders**:
+     - Sliders for the following OpenCV parameters:
+       - `minDist`: Range (0, 500), default 100.
+       - `param1`: Range (0, 500), default 30.
+       - `param2`: Range (0, 400), default 25.
+       - `minRadius`: Range (0, 100), default 5.
+       - `maxRadius`: Range (0, 1000), default 1000.
+       - `color1_R_min`, `color1_R_max`, `color1_V_min`, `color1_V_max`, `color1_B_min`, `color1_B_max`: Range (0, 64), default 5.
+     - Each slider synchronizes with a text input field for precise value entry.
+     - Sliders must use a black background, black trough color, no border, and gray text.
+   - **Run Button**:
+     - Triggers a `run_process` function.
+     - Styled with a black background, gray text, no border, and no highlights.
+   - **Image Display Canvas**:
+     - Displays an image returned by the `process_frame` function.
+     - Rescales images to fit within 1024x768 pixels, preserving the aspect ratio.
+   - **Result Text Box**:
+     - Displays the results or error messages.
+     - Styled with a black background, gray text, no border, and gray insertion point color.
 
-"I need a Python program to create a Tkinter-based GUI named 'Yiking'. The GUI will control parameters for an OpenCV image processing program. The program must be split into two files:
+3. **Implementation Details**:
+   - **Functionality**:
+     - The `run_process` function:
+       - Collects current slider values.
+       - Retrieves the selected camera ID.
+       - Passes the values to a `process_frame` function (assume this function exists in a separate `process.py` file).
+       - Handles exceptions and displays error messages in the result text box.
+     - The `process_frame` function is expected to return an OpenCV image (NumPy array) and a result string.
+   - **Styling**:
+     - Use `ttk.Style` for consistent dropdown styling.
+     - Replace `ttk` widgets with `tk` widgets where custom styling is required (e.g., sliders, buttons, text input).
 
-1. **`process.py`**: Contains a `process_frame` function that takes parameters as input, performs OpenCV operations (not implemented in this request), and returns an image as a NumPy array and a result string.
+4. **Output**:
-
+   - Provide a complete Python script, including imports, the `OpenCVInterface` class, and the `__main__` block to run the GUI.
-2. **`gui.py`**: Implements the GUI and integrates with `process.py`. Here are the detailed requirements:
-
-### GUI Details:
-- **Window Title**: 'Yiking'
-- **Layout**:
-  - **Row 1**: Two columns
-    - Left column: Group of sliders for controlling parameters.
-    - Right column: A canvas for displaying a processed image (1024x768 pixels).
-  - **Row 2**: Two columns
-    - Left column: A "Run" button.
-    - Right column: A text box for displaying results or error messages.
-- **Widgets**:
-  - Sliders with corresponding min, max, and default values:
-    - `minDist` = (0, 500, 100)
-    - `param1` = (0, 500, 30)
-    - `param2` = (0, 400, 25)
-    - `minRadius` = (0, 100, 5)
-    - `maxRadius` = (0, 1000, 1000)
-    - `color1_R_min` = (0, 64, 5)
-    - `color1_V_min` = (0, 64, 5)
-    - `color1_B_min` = (0, 64, 5)
-    - `color1_R_min` = (0, 64, 5)
-    - `color1_V_min` = (0, 64, 5)
-    - `color1_B_min` = (0, 64, 5)
-  - Sliders must snap to increments of 5 and synchronize with a text entry box.
-  - The image canvas must resize input images to fit within 1024x768 while maintaining aspect ratio.
-  - A "Run" button executes the `process_frame` function with the current slider values.
-  - If an exception occurs in `process_frame`, it should display the error in the result text box and clear the canvas.
-
-### Key Features:
-- Use the `Pillow` library (`PIL`) to handle image conversion and resizing.
-- Catch exceptions in `run_process` to display error messages.
-- Keep the GUI responsive and visually clean.
-
-### Output:
-Please provide a fully functional `gui.py` implementation meeting these requirements. Include imports, class structure, and the `__main__` block. Do not implement the OpenCV functionality within `process.py`—assume it exists for integration purposes."
-
----
-
-This prompt is designed to give the LLM everything it needs to generate the desired `gui.py` code. Let me know if you'd like to adjust it further!
 """
+
 import tkinter as tk
 from tkinter import ttk
 from process import process_frame
@@ -62,6 +68,9 @@ class OpenCVInterface:
         self.root = root
         self.root.title("Yiking")
 
+        # Set black background color
+        self.root.configure(bg="black")
+
         # Variables for sliders with min, max, and default values
         self.variables_config = {
             "minDist": (0, 500, 100),
@@ -91,15 +100,17 @@ class OpenCVInterface:
         self.root.columnconfigure(1, weight=1)
 
         # Dropdown for camera selection
-        camera_frame = ttk.Frame(self.root)
+        camera_frame = tk.Frame(self.root, bg="black")
         camera_frame.grid(row=0, column=0, sticky="nsew")
         self.camera_selection = tk.StringVar()
         self.camera_dropdown = ttk.Combobox(camera_frame, textvariable=self.camera_selection)
+        style = ttk.Style()
+        style.configure("TCombobox", fieldbackground="black", background="black", foreground="gray")
         self.camera_dropdown.grid(row=0, column=0, padx=5, pady=5)
         self.populate_camera_dropdown()
 
         # Left Column: Sliders
-        left_frame = ttk.Frame(self.root)
+        left_frame = tk.Frame(self.root, bg="black")
         left_frame.grid(row=1, column=0, sticky="nswe")
 
         for var_name, var in self.variables.items():
@@ -107,14 +118,14 @@ class OpenCVInterface:
             self.create_slider(left_frame, var_name, var, min_val, max_val)
 
         # Right Column: Image Placeholder
-        self.image_canvas = tk.Canvas(self.root, bg="gray", width=1024, height=768)
+        self.image_canvas = tk.Canvas(self.root, bg="black", width=1024, height=768, highlightthickness=0)
         self.image_canvas.grid(row=0, column=1, rowspan=2, sticky="nswe")
 
         # Bottom Row: Run Button and Result
-        run_button = ttk.Button(self.root, text="Run", command=self.run_process)
+        run_button = tk.Button(self.root, text="Run", command=self.run_process, bg="black", fg="gray", activebackground="gray", activeforeground="gray", bd=0, highlightthickness=0)
         run_button.grid(row=2, column=0, sticky="we")
 
-        self.result_text = tk.Text(self.root, height=5, width=40)
+        self.result_text = tk.Text(self.root, height=5, width=40, bg="black", fg="gray", bd=0, highlightthickness=0, insertbackground="gray")
         self.result_text.grid(row=2, column=1, sticky="nswe")
 
     def populate_camera_dropdown(self):
@@ -130,11 +141,11 @@ class OpenCVInterface:
             self.camera_dropdown.current(0)
 
     def create_slider(self, parent, name, variable, min_val, max_val):
-        frame = ttk.Frame(parent)
+        frame = tk.Frame(parent, bg="black")
         frame.pack(fill="x", padx=5, pady=2)
 
         # Label
-        label = ttk.Label(frame, text=name)
+        label = tk.Label(frame, text=name, bg="black", fg="gray")
         label.pack(side="left")
 
         def on_slide(value):
@@ -143,14 +154,13 @@ class OpenCVInterface:
             variable.set(int(rounded_value))  # Update the variable with the rounded value
 
         # Slider
-        slider = ttk.Scale(
+        slider = tk.Scale(
             frame, from_=min_val, to=max_val,
-            variable=variable, orient="horizontal", command=on_slide
+            variable=variable, orient="horizontal", bg="black", fg="gray", troughcolor="black", highlightthickness=0, bd=0)
-        )
         slider.pack(side="left", fill="x", expand=True, padx=5)
 
         # Entry box
-        entry = ttk.Entry(frame, textvariable=variable, width=5)
+        entry = tk.Entry(frame, textvariable=variable, width=5, bg="black", fg="gray", insertbackground="gray", bd=0, highlightthickness=0)
         entry.pack(side="left")
 
     def run_process(self):