spacr 0.2.21__py3-none-any.whl → 0.2.31__py3-none-any.whl

spacr/gui_elements.py

@@ -3,7 +3,7 @@ import tkinter as tk
 from tkinter import ttk
 import tkinter.font as tkFont
 from queue import Queue
-from tkinter import Label
+from tkinter import Label, Frame, Button
 import numpy as np
 from PIL import Image, ImageOps, ImageTk
 from concurrent.futures import ThreadPoolExecutor
@@ -15,14 +15,20 @@ from skimage.draw import polygon, line
 from skimage.transform import resize
 from scipy.ndimage import binary_fill_holes, label
 from tkinter import ttk, scrolledtext
-import platform
 
+def set_default_font(root, font_name="Arial", size=12):
+    default_font = (font_name, size)
+    root.option_add("*Font", default_font)
+    root.option_add("*TButton.Font", default_font)
+    root.option_add("*TLabel.Font", default_font)
+    root.option_add("*TEntry.Font", default_font)
+    
 def set_dark_style(style, parent_frame=None, containers=None, widgets=None, font_family="Arial", font_size=12, bg_color='black', fg_color='white', active_color='blue', inactive_color='dark_gray'):
 
     if active_color == 'teal':
         active_color = '#008080'
     if inactive_color == 'dark_gray':
-        inactive_color = '#050505'
+        inactive_color = '#2B2B2B' # '#333333' #'#050505'
     if bg_color == 'black':
         bg_color = '#000000'
     if fg_color == 'white':
@@ -30,28 +36,39 @@ def set_dark_style(style, parent_frame=None, containers=None, widgets=None, font
     if active_color == 'blue':
         active_color = '#007BFF'
 
-    style.theme_use('clam')
+    padding = '5 5 5 5'
     font_style = tkFont.Font(family=font_family, size=font_size)
-    style.configure('TEntry', padding='5 5 5 5', borderwidth=1, relief='solid', fieldbackground=bg_color, foreground=fg_color, font=font_style)
-    style.configure('TCombobox', fieldbackground=bg_color, background=bg_color, foreground=fg_color, selectbackground=bg_color, selectforeground=fg_color, font=font_style)
-    style.map('TCombobox', fieldbackground=[('readonly', bg_color)], foreground=[('readonly', fg_color)], selectbackground=[('readonly', bg_color)], selectforeground=[('readonly', fg_color)])
-    style.configure('Custom.TButton', background=bg_color, foreground=fg_color, bordercolor=fg_color, focusthickness=3, focuscolor=fg_color, font=(font_family, font_size))
-    style.map('Custom.TButton', background=[('active', active_color), ('!active', bg_color)], foreground=[('active', fg_color), ('!active', fg_color)], bordercolor=[('active', fg_color), ('!active', fg_color)])
-    style.configure('Custom.TLabel', padding='5 5 5 5', borderwidth=1, relief='flat', background=bg_color, foreground=fg_color, font=font_style)
-    style.configure('Spacr.TCheckbutton', background=bg_color, foreground=fg_color, indicatoron=False, relief='flat', font="15")
-    style.map('Spacr.TCheckbutton', background=[('selected', bg_color), ('active', bg_color)], foreground=[('selected', fg_color), ('active', fg_color)])
-    style.configure('TLabel', background=bg_color, foreground=fg_color, font=font_style)
+
+    style.theme_use('clam')
+    
+    style.configure('TEntry', padding=padding)
+    style.configure('TCombobox', padding=padding)
+    style.configure('Spacr.TEntry', padding=padding)
+    style.configure('TEntry', padding=padding)
+    style.configure('Spacr.TEntry', padding=padding)
+    style.configure('Custom.TLabel', padding=padding)
+    #style.configure('Spacr.TCheckbutton', padding=padding)
+    style.configure('TButton', padding=padding)
+
     style.configure('TFrame', background=bg_color)
     style.configure('TPanedwindow', background=bg_color)
-    style.configure('TNotebook', background=bg_color, tabmargins=[2, 5, 2, 0])
-    style.configure('TNotebook.Tab', background=bg_color, foreground=fg_color, padding=[5, 5], font=font_style)
-    style.map('TNotebook.Tab', background=[('selected', active_color), ('active', active_color)], foreground=[('selected', fg_color), ('active', fg_color)])
-    style.configure('TButton', background=bg_color, foreground=fg_color, padding='5 5 5 5', font=font_style)
-    style.map('TButton', background=[('active', active_color), ('disabled', inactive_color)])
-    style.configure('Vertical.TScrollbar', background=bg_color, troughcolor=bg_color, bordercolor=bg_color)
-    style.configure('Horizontal.TScrollbar', background=bg_color, troughcolor=bg_color, bordercolor=bg_color)
-    style.configure('Custom.TLabelFrame', font=(font_family, font_size, 'bold'), background=bg_color, foreground='white', relief='solid', borderwidth=1)
-    style.configure('Custom.TLabelFrame.Label', background=bg_color, foreground='white', font=(font_family, font_size, 'bold'))
+    style.configure('TLabel', background=bg_color, foreground=fg_color, font=font_style)
+
+
+    #style.configure('Custom.TLabel', padding='5 5 5 5', borderwidth=1, relief='flat', background=bg_color, foreground=fg_color, font=font_style)
+    #style.configure('Spacr.TCheckbutton', background=bg_color, foreground=fg_color, indicatoron=False, relief='flat', font="15")
+    #style.map('Spacr.TCheckbutton', background=[('selected', bg_color), ('active', bg_color)], foreground=[('selected', fg_color), ('active', fg_color)])
+    
+
+    #style.configure('TNotebook', background=bg_color, tabmargins=[2, 5, 2, 0])
+    #style.configure('TNotebook.Tab', background=bg_color, foreground=fg_color, padding=[5, 5], font=font_style)
+    #style.map('TNotebook.Tab', background=[('selected', active_color), ('active', active_color)], foreground=[('selected', fg_color), ('active', fg_color)])
+    #style.configure('TButton', background=bg_color, foreground=fg_color, padding='5 5 5 5', font=font_style)
+    #style.map('TButton', background=[('active', active_color), ('disabled', inactive_color)])
+    #style.configure('Vertical.TScrollbar', background=bg_color, troughcolor=bg_color, bordercolor=bg_color)
+    #style.configure('Horizontal.TScrollbar', background=bg_color, troughcolor=bg_color, bordercolor=bg_color)
+    #style.configure('Custom.TLabelFrame', font=(font_family, font_size, 'bold'), background=bg_color, foreground='white', relief='solid', borderwidth=1)
+    #style.configure('Custom.TLabelFrame.Label', background=bg_color, foreground='white', font=(font_family, font_size, 'bold'))
 
     if parent_frame:
         parent_frame.configure(bg=bg_color)
@@ -82,20 +99,245 @@ def set_dark_style(style, parent_frame=None, containers=None, widgets=None, font
 
     return {'font_family': font_family, 'font_size': font_size, 'bg_color': bg_color, 'fg_color': fg_color, 'active_color': active_color, 'inactive_color': inactive_color}
 
-def set_default_font(root, font_name="Arial", size=12):
-    default_font = (font_name, size)
-    root.option_add("*Font", default_font)
-    root.option_add("*TButton.Font", default_font)
-    root.option_add("*TLabel.Font", default_font)
-    root.option_add("*TEntry.Font", default_font)
+class spacrEntry(tk.Frame):
+    def __init__(self, parent, textvariable=None, outline=False, *args, **kwargs):
+        super().__init__(parent, *args, **kwargs)
+        
+        # Set dark style
+        style_out = set_dark_style(ttk.Style())
+        self.bg_color = style_out['inactive_color']
+        self.active_color = style_out['active_color']
+        self.fg_color = style_out['fg_color']
+        self.outline = outline
+        self.font_family = style_out['font_family']
+        self.font_size = style_out['font_size']
+        
+        # Set the background color of the frame
+        self.configure(bg=style_out['bg_color'])
+
+        # Create a canvas for the rounded rectangle background
+        self.canvas_width = 220  # Adjusted for padding
+        self.canvas_height = 40   # Adjusted for padding
+        self.canvas = tk.Canvas(self, width=self.canvas_width, height=self.canvas_height, bd=0, highlightthickness=0, relief='ridge', bg=style_out['bg_color'])
+        self.canvas.pack()
+        
+        self.entry = tk.Entry(self, textvariable=textvariable, bd=0, highlightthickness=0, fg=self.fg_color, font=(self.font_family, self.font_size), bg=self.bg_color)
+        self.entry.place(relx=0.5, rely=0.5, anchor=tk.CENTER, width=190, height=20)  # Centered positioning
+        
+        # Bind events to change the background color on focus
+        self.entry.bind("<FocusIn>", self.on_focus_in)
+        self.entry.bind("<FocusOut>", self.on_focus_out)
+        
+        self.draw_rounded_rectangle(self.bg_color)
+
+    def draw_rounded_rectangle(self, color):
+        radius = 15  # Increased radius for more rounded corners
+        x0, y0 = 10, 5
+        x1, y1 = 210, 35
+        self.canvas.delete("all")
+        self.canvas.create_arc((x0, y0, x0 + radius, y0 + radius), start=90, extent=90, fill=color, outline=color)
+        self.canvas.create_arc((x1 - radius, y0, x1, y0 + radius), start=0, extent=90, fill=color, outline=color)
+        self.canvas.create_arc((x0, y1 - radius, x0 + radius, y1), start=180, extent=90, fill=color, outline=color)
+        self.canvas.create_arc((x1 - radius, y1 - radius, x1, y1), start=270, extent=90, fill=color, outline=color)
+        self.canvas.create_rectangle((x0 + radius / 2, y0, x1 - radius / 2, y1), fill=color, outline=color)
+        self.canvas.create_rectangle((x0, y0 + radius / 2, x1, y1 - radius / 2), fill=color, outline=color)
+    
+    def on_focus_in(self, event):
+        self.draw_rounded_rectangle(self.active_color)
+        self.entry.config(bg=self.active_color)
+    
+    def on_focus_out(self, event):
+        self.draw_rounded_rectangle(self.bg_color)
+        self.entry.config(bg=self.bg_color)
+
+class spacrCheck(tk.Frame):
+    def __init__(self, parent, text="", variable=None, *args, **kwargs):
+        super().__init__(parent, *args, **kwargs)
+        
+        style_out = set_dark_style(ttk.Style())
+        self.bg_color = style_out['bg_color']
+        self.active_color = style_out['active_color']
+        self.fg_color = style_out['fg_color']
+        self.inactive_color = style_out['inactive_color']
+        self.variable = variable
+
+        self.configure(bg=self.bg_color)
+
+        # Create a canvas for the rounded square background
+        self.canvas_width = 20
+        self.canvas_height = 20
+        self.canvas = tk.Canvas(self, width=self.canvas_width, height=self.canvas_height, bd=0, highlightthickness=0, relief='ridge', bg=self.bg_color)
+        self.canvas.pack()
+
+        # Draw the initial rounded square based on the variable's value
+        self.draw_rounded_square(self.active_color if self.variable.get() else self.inactive_color)
+
+        # Bind variable changes to update the checkbox
+        self.variable.trace_add('write', self.update_check)
+
+        # Bind click event to toggle the variable
+        self.canvas.bind("<Button-1>", self.toggle_variable)
+
+    def draw_rounded_square(self, color):
+        radius = 5  # Adjust the radius for more rounded corners
+        x0, y0 = 2, 2
+        x1, y1 = 18, 18
+        self.canvas.delete("all")
+        self.canvas.create_arc((x0, y0, x0 + radius, y0 + radius), start=90, extent=90, fill=color, outline=self.fg_color)
+        self.canvas.create_arc((x1 - radius, y0, x1, y0 + radius), start=0, extent=90, fill=color, outline=self.fg_color)
+        self.canvas.create_arc((x0, y1 - radius, x0 + radius, y1), start=180, extent=90, fill=color, outline=self.fg_color)
+        self.canvas.create_arc((x1 - radius, y1 - radius, x1, y1), start=270, extent=90, fill=color, outline=self.fg_color)
+        self.canvas.create_rectangle((x0 + radius / 2, y0, x1 - radius / 2, y1), fill=color, outline=color)
+        self.canvas.create_rectangle((x0, y0 + radius / 2, x1, y1 - radius / 2), fill=color, outline=color)
+        self.canvas.create_line(x0 + radius / 2, y0, x1 - radius / 2, y0, fill=self.fg_color)
+        self.canvas.create_line(x0 + radius / 2, y1, x1 - radius / 2, y1, fill=self.fg_color)
+        self.canvas.create_line(x0, y0 + radius / 2, x0, y1 - radius / 2, fill=self.fg_color)
+        self.canvas.create_line(x1, y0 + radius / 2, x1, y1 - radius / 2, fill=self.fg_color)
+
+    def update_check(self, *args):
+        self.draw_rounded_square(self.active_color if self.variable.get() else self.inactive_color)
+
+    def toggle_variable(self, event):
+        self.variable.set(not self.variable.get())
+
+class spacrCombo(tk.Frame):
+    def __init__(self, parent, textvariable=None, values=None, *args, **kwargs):
+        super().__init__(parent, *args, **kwargs)
+        
+        # Set dark style
+        style_out = set_dark_style(ttk.Style())
+        self.bg_color = style_out['bg_color']
+        self.active_color = style_out['active_color']
+        self.fg_color = style_out['fg_color']
+        self.inactive_color = style_out['inactive_color']
+        self.font_family = style_out['font_family']
+        self.font_size = style_out['font_size']
+
+        self.values = values or []
+
+        # Create a canvas for the rounded rectangle background
+        self.canvas_width = 220  # Adjusted for padding
+        self.canvas_height = 40   # Adjusted for padding
+        self.canvas = tk.Canvas(self, width=self.canvas_width, height=self.canvas_height, bd=0, highlightthickness=0, relief='ridge', bg=self.bg_color)
+        self.canvas.pack()
+        
+        self.var = textvariable if textvariable else tk.StringVar()
+        self.selected_value = self.var.get()
+        
+        # Create the label to display the selected value
+        self.label = tk.Label(self, text=self.selected_value, bg=self.inactive_color, fg=self.fg_color, font=(self.font_family, self.font_size))
+        self.label.place(relx=0.5, rely=0.5, anchor=tk.CENTER)
+        
+        # Bind events to open the dropdown menu
+        self.canvas.bind("<Button-1>", self.on_click)
+        self.label.bind("<Button-1>", self.on_click)
+        
+        self.draw_rounded_rectangle(self.inactive_color)
+
+        self.dropdown_menu = None
+
+    def draw_rounded_rectangle(self, color):
+        radius = 15  # Increased radius for more rounded corners
+        x0, y0 = 10, 5
+        x1, y1 = 210, 35
+        self.canvas.delete("all")
+        self.canvas.create_arc((x0, y0, x0 + radius, y0 + radius), start=90, extent=90, fill=color, outline=color)
+        self.canvas.create_arc((x1 - radius, y0, x1, y0 + radius), start=0, extent=90, fill=color, outline=color)
+        self.canvas.create_arc((x0, y1 - radius, x0 + radius, y1), start=180, extent=90, fill=color, outline=color)
+        self.canvas.create_arc((x1 - radius, y1 - radius, x1, y1), start=270, extent=90, fill=color, outline=color)
+        self.canvas.create_rectangle((x0 + radius / 2, y0, x1 - radius / 2, y1), fill=color, outline=color)
+        self.canvas.create_rectangle((x0, y0 + radius / 2, x1, y1 - radius / 2), fill=color, outline=color)
+        self.label.config(bg=color)  # Update label background to match rectangle color
+
+    def on_click(self, event):
+        if self.dropdown_menu is None:
+            self.open_dropdown()
+        else:
+            self.close_dropdown()
+
+    def open_dropdown(self):
+        self.draw_rounded_rectangle(self.active_color)
+        
+        self.dropdown_menu = tk.Toplevel(self)
+        self.dropdown_menu.wm_overrideredirect(True)
+        
+        x, y, width, height = self.winfo_rootx(), self.winfo_rooty(), self.winfo_width(), self.winfo_height()
+        self.dropdown_menu.geometry(f"{width}x{len(self.values) * 30}+{x}+{y + height}")
+        
+        for index, value in enumerate(self.values):
+            display_text = value if value is not None else 'None'
+            item = tk.Label(self.dropdown_menu, text=display_text, bg=self.inactive_color, fg=self.fg_color, font=(self.font_family, self.font_size), anchor='w')
+            item.pack(fill='both')
+            item.bind("<Button-1>", lambda e, v=value: self.on_select(v))
+            item.bind("<Enter>", lambda e, w=item: w.config(bg=self.active_color))
+            item.bind("<Leave>", lambda e, w=item: w.config(bg=self.inactive_color))
+
+    def close_dropdown(self):
+        self.draw_rounded_rectangle(self.inactive_color)
+        
+        if self.dropdown_menu:
+            self.dropdown_menu.destroy()
+            self.dropdown_menu = None
+
+    def on_select(self, value):
+        display_text = value if value is not None else 'None'
+        self.var.set(value)
+        self.label.config(text=display_text)
+        self.selected_value = value
+        self.close_dropdown()
+
+    def set(self, value):
+        display_text = value if value is not None else 'None'
+        self.var.set(value)
+        self.label.config(text=display_text)
+        self.selected_value = value
 
 class spacrDropdownMenu(tk.OptionMenu):
     def __init__(self, parent, variable, options, command=None, **kwargs):
         self.variable = variable
-        self.variable.set("Select Category")
+        self.variable.set("Settings Category")
         super().__init__(parent, self.variable, *options, command=command, **kwargs)
         self.update_styles()
 
+        # Hide the original button
+        self.configure(highlightthickness=0, relief='flat', bg='#2B2B2B', fg='#2B2B2B')
+
+        # Create custom button
+        self.create_custom_button()
+
+    def create_custom_button(self):
+        self.canvas_width = self.winfo_reqwidth()  # Use the required width of the widget
+        self.canvas_height = 40  # Adjust the height as needed
+        self.canvas = tk.Canvas(self, width=self.canvas_width, height=self.canvas_height, bd=0, highlightthickness=0, relief='ridge', bg='#2B2B2B')
+        self.canvas.pack()
+        self.label = tk.Label(self.canvas, text="Settings Category", bg='#2B2B2B', fg='#ffffff', font=('Arial', 12))
+        self.label.place(relx=0.5, rely=0.5, anchor=tk.CENTER)
+        self.draw_rounded_rectangle('#2B2B2B')
+
+        # Bind the click event to open the dropdown menu
+        self.canvas.bind("<Button-1>", self.on_click)
+        self.label.bind("<Button-1>", self.on_click)
+
+    def draw_rounded_rectangle(self, color):
+        radius = 15
+        x0, y0 = 10, 5
+        x1, y1 = self.canvas_width - 10, self.canvas_height - 5  # Adjust based on canvas size
+        self.canvas.delete("all")
+        self.canvas.create_arc((x0, y0, x0 + radius, y0 + radius), start=90, extent=90, fill=color, outline=color)
+        self.canvas.create_arc((x1 - radius, y0, x1, y0 + radius), start=0, extent=90, fill=color, outline=color)
+        self.canvas.create_arc((x0, y1 - radius, x0 + radius, y1), start=180, extent=90, fill=color, outline=color)
+        self.canvas.create_arc((x1 - radius, y1 - radius, x1, y1), start=270, extent=90, fill=color, outline=color)
+        self.canvas.create_rectangle((x0 + radius / 2, y0, x1 - radius / 2, y1), fill=color, outline=color)
+        self.canvas.create_rectangle((x0, y0 + radius / 2, x1, y1 - radius / 2), fill=color, outline=color)
+        self.label.config(bg=color)  # Update label background to match rectangle color
+
+    def on_click(self, event):
+        self.post_menu()
+
+    def post_menu(self):
+        x, y, width, height = self.winfo_rootx(), self.winfo_rooty(), self.winfo_width(), self.winfo_height()
+        self.menu.post(x, y + height)
+
     def update_styles(self, active_categories=None):
         style = ttk.Style()
         style_out = set_dark_style(style, widgets=[self])
@@ -120,6 +362,56 @@ class spacrCheckbutton(ttk.Checkbutton):
         style = ttk.Style()
         _ = set_dark_style(style, widgets=[self])
 
+class spacrProgressBar(ttk.Progressbar):
+    def __init__(self, parent, *args, **kwargs):
+        super().__init__(parent, *args, **kwargs)
+
+        # Get the style colors
+        style_out = set_dark_style(ttk.Style())
+       
+        self.fg_color = style_out['fg_color']
+        self.bg_color = style_out['bg_color']
+        self.active_color = style_out['active_color']
+        self.inactive_color = style_out['inactive_color']
+
+        # Configure the style for the progress bar
+        self.style = ttk.Style()
+        self.style.configure(
+            "spacr.Horizontal.TProgressbar",
+            troughcolor=self.bg_color,
+            background=self.active_color,
+            thickness=20,
+            troughrelief='flat',
+            borderwidth=0
+        )
+        self.configure(style="spacr.Horizontal.TProgressbar")
+
+        # Set initial value to 0
+        self['value'] = 0
+
+        # Create the progress label
+        self.progress_label = tk.Label(parent, text="Processing: 0/0", anchor='w', justify='left', bg=self.inactive_color, fg=self.fg_color)
+        self.progress_label.grid(row=1, column=0, columnspan=2, pady=5, padx=5, sticky='ew')
+
+        # Initialize attributes for time and operation
+        self.operation_type = None
+        self.time_image = None
+        self.time_batch = None
+        self.time_left = None
+
+    def update_label(self):
+        # Update the progress label with current progress and additional info
+        label_text = f"Processing: {self['value']}/{self['maximum']}"
+        if self.operation_type:
+            label_text += f", {self.operation_type}"
+        if self.time_image:
+            label_text += f", Time/image: {self.time_image:.3f} sec"
+        if self.time_batch:
+            label_text += f", Time/batch: {self.time_batch:.3f} sec"
+        if self.time_left:
+            label_text += f", Time_left: {self.time_left:.3f} min"
+        self.progress_label.config(text=label_text)
+
 class spacrFrame(ttk.Frame):
     def __init__(self, container, width=None, *args, bg='black', **kwargs):
         super().__init__(container, *args, **kwargs)
@@ -192,7 +484,7 @@ class spacrLabel(tk.Frame):
             self.canvas.itemconfig(self.label_text, text=text)
 
 class spacrButton(tk.Frame):
-    def __init__(self, parent, text="", command=None, font=None, icon_name=None, size=50, show_text=True, outline=True, *args, **kwargs):
+    def __init__(self, parent, text="", command=None, font=None, icon_name=None, size=50, show_text=True, outline=False, *args, **kwargs):
         super().__init__(parent, *args, **kwargs)
         
         self.text = text.capitalize()  # Capitalize only the first letter of the text
@@ -216,10 +508,12 @@ class spacrButton(tk.Frame):
         # Apply dark style and get color settings
         color_settings = set_dark_style(ttk.Style(), containers=[self], widgets=[self.canvas])
 
+        self.inactive_color = color_settings['inactive_color']
+
         if self.outline:
-            self.button_bg = self.create_rounded_rectangle(2, 2, self.button_width + 2, self.size + 2, radius=20, fill=color_settings['bg_color'], outline=color_settings['fg_color'])
+            self.button_bg = self.create_rounded_rectangle(2, 2, self.button_width + 2, self.size + 2, radius=20, fill=self.inactive_color, outline=color_settings['fg_color'])
         else:
-            self.button_bg = self.create_rounded_rectangle(2, 2, self.button_width + 2, self.size + 2, radius=20, fill=color_settings['bg_color'], outline=color_settings['bg_color'])
+            self.button_bg = self.create_rounded_rectangle(2, 2, self.button_width + 2, self.size + 2, radius=20, fill=self.inactive_color, outline=self.inactive_color)
         
         self.load_icon()
         self.font_style = font if font else ("Arial", 12)  # Default font if not provided
@@ -234,7 +528,7 @@ class spacrButton(tk.Frame):
         self.canvas.bind("<Leave>", self.on_leave)
         self.canvas.bind("<Button-1>", self.on_click)
 
-        self.bg_color = color_settings['bg_color']
+        self.bg_color = self.inactive_color
         self.active_color = color_settings['active_color']
         self.fg_color = color_settings['fg_color']
         self.is_zoomed_in = False  # Track zoom state for smooth transitions
@@ -251,7 +545,7 @@ class spacrButton(tk.Frame):
                 icon_image = Image.open(self.get_icon_path("default"))
                 print(f'Icon not found: {icon_path}. Using default icon instead.')
 
-        initial_size = int(self.size * 0.9)  # Make the initial size slightly smaller
+        initial_size = int(self.size * 0.65)  # 65% of button size initially
         self.original_icon_image = icon_image.resize((initial_size, initial_size), Image.Resampling.LANCZOS)
         self.icon_photo = ImageTk.PhotoImage(self.original_icon_image)
 
@@ -266,13 +560,13 @@ class spacrButton(tk.Frame):
         self.canvas.itemconfig(self.button_bg, fill=self.active_color)
         self.update_description(event)
         if not self.is_zoomed_in:
-            self.animate_zoom(1.1)  # Zoom in the icon by 10%
+            self.animate_zoom(0.85)  # Zoom in the icon to 85% of button size
 
     def on_leave(self, event=None):
-        self.canvas.itemconfig(self.button_bg, fill=self.bg_color)
+        self.canvas.itemconfig(self.button_bg, fill=self.inactive_color)
         self.clear_description(event)
         if self.is_zoomed_in:
-            self.animate_zoom(1.0)  # Reset the icon size
+            self.animate_zoom(0.65)  # Reset the icon size to 65% of button size
 
     def on_click(self, event=None):
         if self.command:
@@ -317,7 +611,7 @@ class spacrButton(tk.Frame):
             parent = parent.master
 
     def animate_zoom(self, target_scale, steps=10, delay=10):
-        current_scale = 1.1 if self.is_zoomed_in else 1.0
+        current_scale = 0.85 if self.is_zoomed_in else 0.65
         step_scale = (target_scale - current_scale) / steps
         self._animate_step(current_scale, step_scale, steps, delay)
 
@@ -331,13 +625,13 @@ class spacrButton(tk.Frame):
 
     def zoom_icon(self, scale_factor):
         # Resize the original icon image
-        new_size = int(self.size * 0.9 * scale_factor)
+        new_size = int(self.size * scale_factor)
         resized_icon = self.original_icon_image.resize((new_size, new_size), Image.Resampling.LANCZOS)
         self.icon_photo = ImageTk.PhotoImage(resized_icon)
 
         # Update the icon on the canvas
         self.canvas.itemconfig(self.button_icon, image=self.icon_photo)
-        self.canvas.image = self.icon_photo  # Keep a reference to avoid garbage collection
+        self.canvas.image = self.icon_photo
 
 class spacrSwitch(ttk.Frame):
     def __init__(self, parent, text="", variable=None, command=None, *args, **kwargs):
@@ -1292,14 +1586,19 @@ class ModifyMaskApp:
         self.update_display()
 
 class AnnotateApp:
-    def __init__(self, root, db_path, src, image_type=None, channels=None, grid_rows=None, grid_cols=None, image_size=(200, 200), annotation_column='annotate', normalize=False, percentiles=(1,99), measurement=None, threshold=None):
+    def __init__(self, root, db_path, src, image_type=None, channels=None, image_size=200, annotation_column='annotate', normalize=False, percentiles=(1, 99), measurement=None, threshold=None):
         self.root = root
         self.db_path = db_path
         self.src = src
         self.index = 0
-        self.grid_rows = grid_rows
-        self.grid_cols = grid_cols
-        self.image_size = image_size
+        
+        if isinstance(image_size, list):
+            self.image_size = (int(image_size[0]), int(image_size[0]))
+        elif isinstance(image_size, int):
+            self.image_size = (image_size, image_size)
+        else:
+            raise ValueError("Invalid image size")
+        
         self.annotation_column = annotation_column
         self.image_type = image_type
         self.channels = channels
@@ -1311,22 +1610,72 @@ class AnnotateApp:
         self.adjusted_to_original_paths = {}
         self.terminate = False
         self.update_queue = Queue()
-        self.status_label = Label(self.root, text="", font=("Arial", 12))
-        self.status_label.grid(row=self.grid_rows + 1, column=0, columnspan=self.grid_cols)
         self.measurement = measurement
         self.threshold = threshold
 
+        print('self.image_size', self.image_size)
+
+        style_out = set_dark_style(ttk.Style())
+        self.root.configure(bg=style_out['inactive_color'])
+
         self.filtered_paths_annotations = []
         self.prefilter_paths_annotations()
 
         self.db_update_thread = threading.Thread(target=self.update_database_worker)
         self.db_update_thread.start()
 
-        for i in range(grid_rows * grid_cols):
-            label = Label(root)
-            label.grid(row=i // grid_cols, column=i % grid_cols)
+        # Set the initial window size and make it fit the screen size
+        self.root.geometry(f"{self.root.winfo_screenwidth()}x{self.root.winfo_screenheight()}")
+        self.root.update_idletasks()
+
+        # Create the status label
+        self.status_label = Label(root, text="", font=("Arial", 12), bg=self.root.cget('bg'))
+        self.status_label.grid(row=2, column=0, padx=10, pady=10, sticky="w")
+
+        # Place the buttons at the bottom right
+        self.button_frame = Frame(root, bg=self.root.cget('bg'))
+        self.button_frame.grid(row=2, column=1, padx=10, pady=10, sticky="se")
+
+        self.next_button = Button(self.button_frame, text="Next", command=self.next_page, bg='black', fg='white', highlightbackground='white', highlightcolor='white', highlightthickness=1)
+        self.next_button.pack(side="right", padx=5)
+
+        self.previous_button = Button(self.button_frame, text="Back", command=self.previous_page, bg='black', fg='white', highlightbackground='white', highlightcolor='white', highlightthickness=1)
+        self.previous_button.pack(side="right", padx=5)
+
+        self.exit_button = Button(self.button_frame, text="Exit", command=self.shutdown, bg='black', fg='white', highlightbackground='white', highlightcolor='white', highlightthickness=1)
+        self.exit_button.pack(side="right", padx=5)
+
+        # Calculate grid rows and columns based on the root window size and image size
+        self.calculate_grid_dimensions()
+
+        # Create a frame to hold the image grid
+        self.grid_frame = Frame(root, bg=self.root.cget('bg'))
+        self.grid_frame.grid(row=0, column=0, columnspan=2, padx=0, pady=0, sticky="nsew")
+
+        for i in range(self.grid_rows * self.grid_cols):
+            label = Label(self.grid_frame, bg=self.root.cget('bg'))
+            label.grid(row=i // self.grid_cols, column=i % self.grid_cols, padx=2, pady=2, sticky="nsew")
             self.labels.append(label)
 
+        # Make the grid frame resize with the window
+        self.root.grid_rowconfigure(0, weight=1)
+        self.root.grid_columnconfigure(0, weight=1)
+        self.root.grid_columnconfigure(1, weight=1)
+
+        self.grid_frame.grid_rowconfigure(0, weight=1)
+        self.grid_frame.grid_columnconfigure(0, weight=1)
+
+    def calculate_grid_dimensions(self):
+        window_width = self.root.winfo_width()
+        window_height = self.root.winfo_height()
+
+        self.grid_cols = window_width // (self.image_size[0] + 4)
+        self.grid_rows = (window_height - self.button_frame.winfo_height() - 4) // (self.image_size[1] + 4)
+
+        # Update to make sure grid_rows and grid_cols are at least 1
+        self.grid_cols = max(1, self.grid_cols)
+        self.grid_rows = max(1, self.grid_rows)
+
     def prefilter_paths_annotations(self):
         from .io import _read_and_join_tables
         from .utils import is_list_of_lists
@@ -1580,6 +1929,7 @@ class AnnotateApp:
             self.update_queue.put(self.pending_updates.copy())
         self.pending_updates.clear()
         self.index += self.grid_rows * self.grid_cols
+        self.prefilter_paths_annotations()  # Re-fetch annotations from the database
         self.load_images()
 
     def previous_page(self):
@@ -1589,6 +1939,7 @@ class AnnotateApp:
         self.index -= self.grid_rows * self.grid_cols
         if self.index < 0:
             self.index = 0
+        self.prefilter_paths_annotations()  # Re-fetch annotations from the database
         self.load_images()
 
     def shutdown(self):
@@ -1603,20 +1954,20 @@ class AnnotateApp:
 def create_menu_bar(root):
     from .gui import initiate_root
     gui_apps = {
-        "Mask": (lambda frame: initiate_root(frame, 'mask'), "Generate cellpose masks for cells, nuclei and pathogen images."),
-        "Measure": (lambda frame: initiate_root(frame, 'measure'), "Measure single object intensity and morphological feature. Crop and save single object image"),
-        "Annotate": (lambda frame: initiate_root(frame, 'annotate'), "Annotation single object images on a grid. Annotations are saved to database."),
-        "Make Masks": (lambda frame: initiate_root(frame, 'make_masks'), "Adjust pre-existing Cellpose models to your specific dataset for improved performance"),
-        "Classify": (lambda frame: initiate_root(frame, 'classify'), "Train Torch Convolutional Neural Networks (CNNs) or Transformers to classify single object images."),
-        "Sequencing": (lambda frame: initiate_root(frame, 'sequencing'), "Analyze sequencing data."),
-        "Umap": (lambda frame: initiate_root(frame, 'umap'), "Generate UMAP embeddings with datapoints represented as images."),
-        "Train Cellpose": (lambda frame: initiate_root(frame, 'train_cellpose'), "Train custom Cellpose models."),
-        "ML Analyze": (lambda frame: initiate_root(frame, 'ml_analyze'), "Machine learning analysis of data."),
-        "Cellpose Masks": (lambda frame: initiate_root(frame, 'cellpose_masks'), "Generate Cellpose masks."),
-        "Cellpose All": (lambda frame: initiate_root(frame, 'cellpose_all'), "Run Cellpose on all images."),
-        "Map Barcodes": (lambda frame: initiate_root(frame, 'map_barcodes'), "Map barcodes to data."),
-        "Regression": (lambda frame: initiate_root(frame, 'regression'), "Perform regression analysis."),
-        "Recruitment": (lambda frame: initiate_root(frame, 'recruitment'), "Analyze recruitment data.")
+        "Mask": (lambda frame: initiate_root(frame, settings_type='mask'), "Generate cellpose masks for cells, nuclei and pathogen images."),
+        "Measure": (lambda frame: initiate_root(frame, settings_type='measure'), "Measure single object intensity and morphological feature. Crop and save single object image"),
+        "Annotate": (lambda frame: initiate_root(frame, settings_type='annotate'), "Annotation single object images on a grid. Annotations are saved to database."),
+        "Make Masks": (lambda frame: initiate_root(frame, settings_type='make_masks'), "Adjust pre-existing Cellpose models to your specific dataset for improved performance"),
+        "Classify": (lambda frame: initiate_root(frame, settings_type='classify'), "Train Torch Convolutional Neural Networks (CNNs) or Transformers to classify single object images."),
+        "Sequencing": (lambda frame: initiate_root(frame, settings_type='sequencing'), "Analyze sequencing data."),
+        "Umap": (lambda frame: initiate_root(frame, settings_type='umap'), "Generate UMAP embeddings with datapoints represented as images."),
+        "Train Cellpose": (lambda frame: initiate_root(frame, settings_type='train_cellpose'), "Train custom Cellpose models."),
+        "ML Analyze": (lambda frame: initiate_root(frame, settings_type='ml_analyze'), "Machine learning analysis of data."),
+        "Cellpose Masks": (lambda frame: initiate_root(frame, settings_type='cellpose_masks'), "Generate Cellpose masks."),
+        "Cellpose All": (lambda frame: initiate_root(frame, settings_type='cellpose_all'), "Run Cellpose on all images."),
+        "Map Barcodes": (lambda frame: initiate_root(frame, settings_type='map_barcodes'), "Map barcodes to data."),
+        "Regression": (lambda frame: initiate_root(frame, settings_type='regression'), "Perform regression analysis."),
+        "Recruitment": (lambda frame: initiate_root(frame, settings_type='recruitment'), "Analyze recruitment data.")
     }
 
     def load_app_wrapper(app_name, app_func):