Merge pull request #33 from yuqisun/master

update theme selector

Author: tancheng

README.md

@@ -55,13 +55,9 @@ root@2cd33efd97b3 WORK_REPO# export DISPLAY=192.168.3.38:0.0 # change to your ow
 root@2cd33efd97b3 WORK_REPO# source venv/bin/activate
 (venv) root@2cd33efd97b3 WORK_REPO# cd /WORK_REPO/CGRA-Flow
 
+# Startup theme mode selector UI
+(venv) root@2cd33efd97b3 CGRA-Flow# python startup.py
 # Three themes are available: dark, light, and classic
-# Start with default theme (dark mode)
-(venv) root@2cd33efd97b3 build# ./launchUI.bash
-# Start with light theme
-(venv) root@2cd33efd97b3 build# ./launchUI.bash light
-# Start with classic theme
-(venv) root@2cd33efd97b3 build# ./launchUI.bash classic
 ```
 
 Otherwise, if you don't need the GUI, development can be performed in the container with the environment well set up:

launchUI.py

@@ -28,7 +28,7 @@
    if args.theme == 'light':
        customtkinter.set_appearance_mode("light")  # Modes: system (default), light, dark
        customtkinter.set_default_color_theme("dark-blue")  # Themes: blue (default), dark-blue, green
-       CANVAS_BG_COLOR = "#DBDBDB"
+       CANVAS_BG_COLOR = "#E5E5E5"
        CANVAS_LINE_COLOR = "black"
 
 from VectorCGRA.cgra.translate.CGRATemplateRTL_test import *

startup.py

@@ -0,0 +1,101 @@
+import os
+import tkinter
+
+import customtkinter
+from PIL import Image
+
+customtkinter.set_appearance_mode("Dark")
+customtkinter.set_default_color_theme("dark-blue")
+
+master = customtkinter.CTk()
+image_path = './theme/'
+theme_selector_dark_image = customtkinter.CTkImage(Image.open(os.path.join(image_path, "dark_theme.png")), size=(500, 410))
+theme_selector_light_image = customtkinter.CTkImage(Image.open(os.path.join(image_path, "light_theme.png")), size=(500, 410))
+theme_selector_classic_image = customtkinter.CTkImage(Image.open(os.path.join(image_path, "classic_theme.png")), size=(500, 410))
+
+def launchUI(theme_radio_var):
+    print(f'Get theme radio var: {theme_radio_var.get()}')
+    if theme_radio_var.get() == 1:
+        print('Activate light mode.')
+        os.system("./launchUI.bash light &")
+    elif theme_radio_var.get() == 2:
+        print('Activate classic mode.')
+        os.system("./launchUI.bash classic &")
+    else:
+        print('Activate dark mode.')
+        os.system("./launchUI.bash &")
+    master.destroy()
+
+
+def switchUI(theme_radio_var, radiobutton_frame, launch_button, theme_selector_image_label):
+    theme_selector_image_label.forget()
+    if theme_radio_var.get() == 1:
+        print('light mode.')
+        customtkinter.set_appearance_mode("light")
+        customtkinter.set_default_color_theme("dark-blue")
+        radiobutton_frame.configure(fg_color='#D9D9D9')
+        launch_button.configure(fg_color='#3A7EBF')
+        theme_selector_image_label = customtkinter.CTkLabel(main_frame, text="", image=theme_selector_light_image,
+                                                            compound="bottom", anchor="center")
+        theme_selector_image_label.grid(row=1, column=0)
+    elif theme_radio_var.get() == 2:
+        print('classic mode.')
+        customtkinter.set_appearance_mode("light")
+        # customtkinter.set_default_color_theme("green")
+        radiobutton_frame.configure(fg_color='#F0F0F0')
+        launch_button.configure(fg_color='#808080')
+        theme_selector_image_label = customtkinter.CTkLabel(main_frame, text="", image=theme_selector_classic_image,
+                                                            compound="bottom", anchor="center")
+        theme_selector_image_label.grid(row=1, column=0)
+    else:
+        print('dark mode.')
+        customtkinter.set_appearance_mode("dark")
+        customtkinter.set_default_color_theme("dark-blue")
+        radiobutton_frame.configure(fg_color='#292929')
+        launch_button.configure(fg_color='#1F538D')
+        theme_selector_image_label = customtkinter.CTkLabel(main_frame, text="", image=theme_selector_dark_image,
+                                                            compound="bottom", anchor="center")
+        theme_selector_image_label.grid(row=1, column=0)
+
+
+# configure window
+master.title("Startup theme selector")
+master.geometry(f"{500}x{500}")
+master.resizable(False, False)
+
+main_frame = customtkinter.CTkFrame(master)
+main_frame.grid(row=0, column=0, sticky="nsew")
+main_frame.grid_rowconfigure(0, weight=1)
+main_frame.grid_rowconfigure(1, weight=3)
+main_frame.grid_columnconfigure(0, weight=1)
+
+radiobutton_frame = customtkinter.CTkFrame(main_frame)
+radiobutton_frame.grid(row=0, column=0, sticky="nsew")
+
+radiobutton_frame.grid_rowconfigure(0, weight=1)
+radiobutton_frame.grid_rowconfigure(1, weight=2)
+radiobutton_frame.grid_columnconfigure(0, weight=1)
+radiobutton_frame.grid_columnconfigure(1, weight=1)
+radiobutton_frame.grid_columnconfigure(2, weight=1)
+
+theme_radio_var = tkinter.IntVar(value=0)
+
+main_frame_label = customtkinter.CTkLabel(radiobutton_frame, text='Please choose the theme mode: ', font=customtkinter.CTkFont(size=15, weight="bold"))
+main_frame_label.grid(row=0, column=0, columnspan=2, padx=(10, 5), pady=(10, 10), sticky="w")
+launch_button = customtkinter.CTkButton(master=radiobutton_frame, text='LaunchUI', command=lambda: launchUI(theme_radio_var))
+launch_button.grid(row=0, column=2, pady=(10, 10), sticky="w")
+
+theme_selector_image_label = customtkinter.CTkLabel(main_frame, text="", image=theme_selector_dark_image, compound="bottom", anchor="center")
+theme_selector_image_label.grid(row=1, column=0)
+
+# create radiobutton frame
+light_theme_button = customtkinter.CTkRadioButton(master=radiobutton_frame, text='Light', variable=theme_radio_var, value=1, command=lambda: switchUI(theme_radio_var, radiobutton_frame, launch_button, theme_selector_image_label))
+light_theme_button.grid(row=1, column=0, pady=(10, 10), padx=(10,0), sticky="w")
+dark_theme_button = customtkinter.CTkRadioButton(master=radiobutton_frame, text='Dark', variable=theme_radio_var, value=0, command=lambda: switchUI(theme_radio_var, radiobutton_frame, launch_button, theme_selector_image_label))
+dark_theme_button.grid(row=1, column=1, pady=(10, 10), padx=(10,0), sticky="w")
+classic_theme_button = customtkinter.CTkRadioButton(master=radiobutton_frame, text='Classic', variable=theme_radio_var, value=2, command=lambda: switchUI(theme_radio_var, radiobutton_frame, launch_button, theme_selector_image_label))
+classic_theme_button.grid(row=1, column=2, pady=(10, 10), padx=(10,0), sticky="w")
+
+master.mainloop()
+
+