diff --git a/Readme.md b/Readme.md index ac34727..61001ad 100644 --- a/Readme.md +++ b/Readme.md @@ -3,155 +3,87 @@ ![PyPI - License](https://img.shields.io/pypi/l/customtkinter) ![Total lines](https://img.shields.io/tokei/lines/github.com/tomschimansky/customtkinter?color=green&label=total%20lines) -# CustomTkinter library +# CustomTkinter UI-Library -![](documentation_images/tkinter_customtkinter_comparison.jpg) +![](documentation_images/Windows_dark.png) +| _`complex_example.py` on Windows 11 with dark mode and 'dark-blue' theme_ -With CustomTkinter you can create modern looking user -interfaces in python with tkinter. CustomTkinter is a -tkinter extension which provides extra ui-elements like -the CTkButton, which can be used like a normal tkinter.Button, -but can be customized with a border and round edges. +![](documentation_images/macOS_light.png) +| _`complex_example.py` on macOS in light mode and standard 'blue' theme_ +### -CustomTkinter also supports a light and dark theme, -which can either be set manually or get controlled by -the system appearance mode. +CustomTkinter is a python UI-library based on Tkinter, which provides new, modern and +fully customizable widgets. They are created and used like normal Tkinter widgets and +can also be used in combination with normal Tkinter elements. The widgets +and the window colors either adapt to the system appearance or the manually set mode +('light', 'dark'). With CustomTkinter you'll get a consistent and modern look across all +desktop platforms (Windows, macOS, Linux). -### Installation - -To use CustomTkinter, just place the /customtkinter folder from this repository -next to your program, or **install the module with pip**: +## Installation +Install the module with pip: ``` pip3 install customtkinter ``` **Update existing installation:** ```pip3 install customtkinter --upgrade```\ -(from time to time bugs are getting fixed and new features are added) +(update as often as possible because this library is under active development) -### Documentation +## Documentation -A **detailed documentation** can be found **[here](https://github.com/TomSchimansky/CustomTkinter/wiki)**. +A detailed documentation can be found in the Wiki Tab here: **[Documentation](https://github.com/TomSchimansky/CustomTkinter/wiki)**. -### Example program (simple button): +## Example Program To test customtkinter you can try this simple example with only a single button: ```python import tkinter -import customtkinter # <- import the CustomTkinter module +import customtkinter + +customtkinter.set_appearance_mode("System") # Modes: system (default), light, dark +customtkinter.set_default_color_theme("blue") # Themes: blue (default), dark-blue, green root_tk = customtkinter.CTk() # create CTk window like you do with the Tk window root_tk.geometry("400x240") -root_tk.title("CustomTkinter Test") def button_function(): print("button pressed") # Use CTkButton instead of tkinter Button -button = customtkinter.CTkButton(master=root_tk, corner_radius=10, command=button_function) +button = customtkinter.CTkButton(master=root_tk, text="CTkButton", command=button_function) button.place(relx=0.5, rely=0.5, anchor=tkinter.CENTER) root_tk.mainloop() ``` -which gives the following: +which gives the following (macOS dark mode on): -![](documentation_images/macOS_button_light.png) +![](documentation_images/macOS_button_dark.png) -### Use custom colors and shapes: -If you don't specify any colors, customtkinter uses the standard blue color theme in the light mode. -You can change the appearance mode to dark by calling -```customtkinter.set_appearance_mode("Dark")```. -If you specify custom colors for CustomTkinter elements, then you can either use a -tuple in the form: (light_color, dark_color). Or you can set a single color -which will be used in light and dark appearance mode. -```python -customtkinter.set_appearance_mode("Dark") # Other: "Light", "System" +In the [examples folder](https://github.com/TomSchimansky/CustomTkinter/tree/master/examples), you +can find more example programs and in the [Documentation](https://github.com/TomSchimansky/CustomTkinter/wiki) +you can find further information on the appearance mode, the themes and all widgets. -button = customtkinter.CTkButton(master=root_tk, - fg_color=("black", "lightgray"), # <- tuple color for light and dark theme - text="CTkButton", - command=button_event) -button.place(relx=0.5, rely=0.5, anchor=tkinter.CENTER) -``` +## More Examples and Showcase -### Dark mode and dark title-bar on macOS -If you have a python version with Tcl/Tk >= 8.6.9, then you automatically get -a dark title bar with macOS dark-mode on, if you use the `customtkinter.Ctk` class to create -the window instead of the normal `tkinterTk` class. Currently, only the anaconda python versions have Tcl/Tk >= 8.6.9. -So if you want a dark window title-bar, you have to install anaconda python version -or miniconda. -```python -import tkinter -import customtkinter +### Appearance mode change -customtkinter.set_appearance_mode("System") -root_tk = customtkinter.CTk() +On Windows 10/11 you get a dark window header, which changes with set +appearance mode or the system, when you use `customtkinter.CTk()` +to create the window, and it works with all python versions. +On macOS however you either need python3.10 or higher or the anaconda python +version to get a dark window header at all (Tcl/Tk >= 8.6.9 required). -... the program ... +![](documentation_images/macOS_system_mode_change.gif) +| _`complex_example.py` on macOS with system mode change and standard 'blue' theme_ -root_tk.mainloop() -``` -If you set the appearance mode to "System", it should change with -the System mode: - -![](documentation_images/appearance_mode_switch.gif) - -### Advanced example with multiple CTkFrames - -Here I used the ``customtkinter.CTk()`` class to create the main window with two CTkFrame's and -set the appearance mode to `System`. It has some -kind of a menu on the left side, and I used all CustomTkinter elements -there are at the moment. Maybe this is a good reference if you want to -create your own application with this library. -(Code: `examples/complex_example.py`) - -With the green theme or the blue theme it looks like this: - -![](documentation_images/macOS_light_dark_comparison.jpg) - -### Default color themes - -If you don't set any colors at all you will get the standard blue -color theme. But you can also change the standard color theme to -green or dark-blue with the following command before you create -the main window: -```python -customtkinter.set_appearance_mode("System") -customtkinter.set_default_color_theme("dark-blue") # Themes: "blue" (standard), "green", "dark-blue" -``` -The color themes look like the following in light and dark mode: - -![](documentation_images/theme_comparison.jpg) - -### CustomTkinter on Windows/Linux - -All elements of Customtkinter are drawn on the ```tkinter.Canvas```. -But the Tkinter canvas supports antialiasing only on macOS (provided by the system), so on Windows -and Linux the elements are rendered in a much worse quality. So you have -to experiment with the ```corner_radius``` and decide when the rounded corners -look best. I tried to design the too complex example programs so that they -also look acceptable on Windows too. Maybe you can use the parameters for -```corner_radius``` and ```width``` for your program as well. - -Example 1: ```examples/complex_example.py``` (light and dark mode) - -![](documentation_images/Windows_complex_bg.jpg) - -In the following example I customized the elements with new colors, chnaged the corner_radius -and added a border to the button. - -Example 2: ```examples/complex_example_custom_colors.py``` (dark mode) - -![](documentation_images/Windows_complex_other_style_bg.jpg) - -### CTkButton with images -It's also possible to put an image on a CTkButton. You just have to +### Button with images +It's possible to put an image on a CTkButton. You just have to pass a PhotoImage object to the CTkButton with the argument ``image``. If you want no text at all you have to set ``text=""`` or with the ``compound`` -option you can specify how to position both the text and image at once. -You can find an example program ( /simple_test_images.py ), where I -created two buttons with a bell and a settings image on them: +option you can specify how to position both the text and image at once: ![](documentation_images/macOS_button_images.png) +| _`example_button_images.py` on macOS_ + ### Integration of TkinterMapView widget In the following example I used a TkinterMapView which integrates diff --git a/customtkinter/__init__.py b/customtkinter/__init__.py index 9179cfe..fb13f79 100644 --- a/customtkinter/__init__.py +++ b/customtkinter/__init__.py @@ -1,4 +1,4 @@ -__version__ = "3.5" +__version__ = "3.6" from .customtkinter_input_dialog import CTkInputDialog from .customtkinter_button import CTkButton diff --git a/documentation_images/Windows_complex_bg.jpg b/documentation_images/Windows_complex_bg.jpg deleted file mode 100644 index c4315cf..0000000 Binary files a/documentation_images/Windows_complex_bg.jpg and /dev/null differ diff --git a/documentation_images/Windows_complex_dark.png b/documentation_images/Windows_complex_dark.png deleted file mode 100644 index 17a4d12..0000000 Binary files a/documentation_images/Windows_complex_dark.png and /dev/null differ diff --git a/documentation_images/Windows_complex_light.png b/documentation_images/Windows_complex_light.png deleted file mode 100644 index e703eed..0000000 Binary files a/documentation_images/Windows_complex_light.png and /dev/null differ diff --git a/documentation_images/Windows_complex_other_style.png b/documentation_images/Windows_complex_other_style.png deleted file mode 100644 index 5199065..0000000 Binary files a/documentation_images/Windows_complex_other_style.png and /dev/null differ diff --git a/documentation_images/Windows_complex_other_style_bg.jpg b/documentation_images/Windows_complex_other_style_bg.jpg deleted file mode 100644 index 92a7f02..0000000 Binary files a/documentation_images/Windows_complex_other_style_bg.jpg and /dev/null differ diff --git a/documentation_images/Windows_dark.png b/documentation_images/Windows_dark.png new file mode 100644 index 0000000..9d284ad Binary files /dev/null and b/documentation_images/Windows_dark.png differ diff --git a/documentation_images/Windows_manual_mode_change.gif b/documentation_images/Windows_manual_mode_change.gif new file mode 100644 index 0000000..86aa5ab Binary files /dev/null and b/documentation_images/Windows_manual_mode_change.gif differ diff --git a/documentation_images/Windows_system_mode_change.gif b/documentation_images/Windows_system_mode_change.gif new file mode 100644 index 0000000..9a355bb Binary files /dev/null and b/documentation_images/Windows_system_mode_change.gif differ diff --git a/documentation_images/Winodws_light.png b/documentation_images/Winodws_light.png new file mode 100644 index 0000000..fbeeab5 Binary files /dev/null and b/documentation_images/Winodws_light.png differ diff --git a/documentation_images/macOS_button_light.png b/documentation_images/macOS_button_light.png deleted file mode 100644 index 87e9c3c..0000000 Binary files a/documentation_images/macOS_button_light.png and /dev/null differ diff --git a/documentation_images/macOS_complex_dark.png b/documentation_images/macOS_complex_dark.png deleted file mode 100644 index 515ff78..0000000 Binary files a/documentation_images/macOS_complex_dark.png and /dev/null differ diff --git a/documentation_images/macOS_complex_light.png b/documentation_images/macOS_complex_light.png deleted file mode 100644 index 961b13d..0000000 Binary files a/documentation_images/macOS_complex_light.png and /dev/null differ diff --git a/documentation_images/macOS_complex_other_style.png b/documentation_images/macOS_complex_other_style.png deleted file mode 100644 index 3f1afb4..0000000 Binary files a/documentation_images/macOS_complex_other_style.png and /dev/null differ diff --git a/documentation_images/macOS_dark.png b/documentation_images/macOS_dark.png new file mode 100644 index 0000000..767f849 Binary files /dev/null and b/documentation_images/macOS_dark.png differ diff --git a/documentation_images/macOS_light.png b/documentation_images/macOS_light.png new file mode 100644 index 0000000..45f23e4 Binary files /dev/null and b/documentation_images/macOS_light.png differ diff --git a/documentation_images/macOS_light_dark_comparison.jpg b/documentation_images/macOS_light_dark_comparison.jpg deleted file mode 100644 index d05dd46..0000000 Binary files a/documentation_images/macOS_light_dark_comparison.jpg and /dev/null differ diff --git a/documentation_images/macOS_system_mode_change.gif b/documentation_images/macOS_system_mode_change.gif new file mode 100644 index 0000000..416838a Binary files /dev/null and b/documentation_images/macOS_system_mode_change.gif differ diff --git a/documentation_images/theme_comparison.jpg b/documentation_images/theme_comparison.jpg deleted file mode 100644 index ef42071..0000000 Binary files a/documentation_images/theme_comparison.jpg and /dev/null differ diff --git a/examples/complex_example.py b/examples/complex_example.py index e122c15..91ec09d 100644 --- a/examples/complex_example.py +++ b/examples/complex_example.py @@ -181,7 +181,7 @@ class App(customtkinter.CTk): # set default values self.radio_button_1.select() - self.switch_2.select() + #self.switch_2.select() self.slider_1.set(0.2) self.slider_2.set(0.7) self.progressbar.set(0.5) diff --git a/setup.py b/setup.py index e4ff471..6e3ff04 100644 --- a/setup.py +++ b/setup.py @@ -19,7 +19,7 @@ def read(filename): setup(name="customtkinter", - version="3.5", + version="3.6", author="Tom Schimansky", license="Creative Commons Zero v1.0 Universal", url="https://github.com/TomSchimansky/CustomTkinter",