2021-03-04 20:27:46 +03:00
|
|
|
# CustomTkinter
|
2021-03-04 21:10:12 +03:00
|
|
|
![](documentation_images/customtkinter_comparison.png)
|
2021-03-04 20:27:46 +03:00
|
|
|
|
2021-03-04 21:10:12 +03:00
|
|
|
With CustomTkinter you can create modern looking user
|
|
|
|
interfaces in python with tkinter. CustomTkinter is a
|
2021-03-05 01:39:09 +03:00
|
|
|
tkinter extension which provides extra ui-elements like
|
2021-03-04 21:10:12 +03:00
|
|
|
the CTkButton, which can be used like a normal tkinter.Button,
|
2021-03-05 02:44:00 +03:00
|
|
|
but can be customized with a border and round edges.
|
2021-03-04 21:10:12 +03:00
|
|
|
|
|
|
|
CustomTkinter also supports a light and dark theme,
|
2021-03-04 21:54:01 +03:00
|
|
|
which can either be set manually or get controlled by
|
2021-03-04 21:10:12 +03:00
|
|
|
the system appearance mode (only macOS).
|
|
|
|
|
2021-03-05 02:05:34 +03:00
|
|
|
### Example program (simple button):
|
2021-03-05 18:21:25 +03:00
|
|
|
To use CustomTkinter, just place the /customtkinter folder from this repository
|
|
|
|
next to your program, and then you can do `import customtkinter`.
|
2021-03-05 02:05:34 +03:00
|
|
|
```python
|
|
|
|
import tkinter
|
2021-03-05 02:32:17 +03:00
|
|
|
import customtkinter # <- import the CustomTkinter module
|
|
|
|
|
|
|
|
root_tk = tkinter.Tk() # create the Tk window like you normally do
|
2021-03-05 02:05:34 +03:00
|
|
|
root_tk.geometry("400x240")
|
|
|
|
root_tk.title("CustomTkinter Test")
|
|
|
|
|
|
|
|
def button_function():
|
|
|
|
print("button pressed")
|
|
|
|
|
2021-03-05 02:32:17 +03:00
|
|
|
# Use CTkButton instead of tkinter Button
|
2021-03-05 02:05:34 +03:00
|
|
|
button = customtkinter.CTkButton(master=root_tk, corner_radius=10, command=button_function)
|
|
|
|
button.place(relx=0.5, rely=0.5, anchor=tkinter.CENTER)
|
|
|
|
|
|
|
|
root_tk.mainloop()
|
|
|
|
```
|
|
|
|
which gives the following:
|
2021-03-05 02:32:17 +03:00
|
|
|
|
2021-03-05 02:05:34 +03:00
|
|
|
![](documentation_images/simple_button_test.png)
|
|
|
|
|
2021-03-05 02:32:17 +03:00
|
|
|
### Use custom colors and shapes:
|
|
|
|
If you dont specify any colors, customtkinter uses the standard blue color in the light theme.
|
|
|
|
You can change the color theme to dark by calling
|
|
|
|
```customtkinter.set_appearance_mode("Dark")```.
|
|
|
|
If you specify custom colors for CustomTkinter elements, the 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 theme.
|
2021-03-05 02:36:39 +03:00
|
|
|
```python
|
2021-03-05 18:21:25 +03:00
|
|
|
customtkinter.set_appearance_mode("Dark") # Other: "Light", "System" (only macOS)
|
|
|
|
|
2021-03-05 02:36:39 +03:00
|
|
|
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)
|
|
|
|
```
|
2021-03-05 02:32:17 +03:00
|
|
|
|
2021-03-05 02:05:34 +03:00
|
|
|
### How to use macOS dark mode?
|
|
|
|
If you have a python version with Tcl/Tk >= 8.6.9, then you can enable the macOS
|
|
|
|
darkmode. Currently only the anaconda python versions have Tcl/Tk >= 8.6.9.
|
|
|
|
```python
|
|
|
|
import tkinter
|
|
|
|
import customtkinter
|
|
|
|
|
|
|
|
customtkinter.enable_macos_darkmode()
|
|
|
|
customtkinter.set_appearance_mode("System")
|
|
|
|
|
|
|
|
... the program ...
|
|
|
|
|
|
|
|
customtkinter.disable_macos_darkmode()
|
|
|
|
```
|
2021-03-05 02:32:17 +03:00
|
|
|
which gives the following with the above simple button program:
|
|
|
|
|
|
|
|
![](documentation_images/simple_macOS_darkmode_test.png)
|
|
|
|
|
2021-03-05 01:39:09 +03:00
|
|
|
## Ui-Elements
|
|
|
|
|
|
|
|
### CTkButton
|
|
|
|
Examle Code:
|
|
|
|
```python
|
|
|
|
def button_event():
|
|
|
|
print("button pressed")
|
|
|
|
|
|
|
|
button = customtkinter.CTkButton(master=root_tk,
|
|
|
|
text="CTkButton",
|
|
|
|
command=button_event,
|
|
|
|
width=120,
|
|
|
|
height=32,
|
|
|
|
border_width=0,
|
|
|
|
corner_radius=8)
|
|
|
|
button.place(relx=0.5, rely=0.5, anchor=tkinter.CENTER)
|
|
|
|
```
|
|
|
|
<details>
|
|
|
|
<summary>Show all arguments:</summary>
|
|
|
|
|
|
|
|
argument | value
|
|
|
|
--- | ---
|
|
|
|
master | root, tkinter.Frame or CTkFrame
|
|
|
|
text | string
|
|
|
|
command | callback function
|
|
|
|
width | button width in px
|
|
|
|
height | button height in px
|
|
|
|
corner_radius | corner radius in px
|
|
|
|
border_width | button border width in px
|
|
|
|
fg_color | forground color, tuple: (light_color, dark_color) or single color
|
|
|
|
bg_color | background color, tuple: (light_color, dark_color) or single color
|
|
|
|
border_color | border color, tuple: (light_color, dark_color) or single color
|
|
|
|
hover_color | hover color, tuple: (light_color, dark_color) or single color
|
|
|
|
text_color | text color, tuple: (light_color, dark_color) or single color
|
|
|
|
text_font | button text font, tuple: (font_name, size)
|
|
|
|
hover | enable/disable hover effect: True, False
|
|
|
|
</details>
|
|
|
|
|
|
|
|
### CTkLabel
|
|
|
|
Example Code:
|
|
|
|
```python
|
2021-03-05 02:44:00 +03:00
|
|
|
label = customtkinter.CTkButton(master=root_tk,
|
2021-03-05 01:39:09 +03:00
|
|
|
text="CTkLabel",
|
|
|
|
width=120,
|
|
|
|
height=25,
|
|
|
|
corner_radius=8)
|
2021-03-05 02:44:00 +03:00
|
|
|
label.place(relx=0.5, rely=0.5, anchor=tkinter.CENTER)
|
2021-03-05 01:39:09 +03:00
|
|
|
```
|
|
|
|
<details>
|
|
|
|
<summary>Show all arguments:</summary>
|
|
|
|
|
|
|
|
argument | value
|
|
|
|
--- | ---
|
|
|
|
master | root, tkinter.Frame or CTkFrame
|
|
|
|
text | string
|
|
|
|
width | label width in px
|
|
|
|
height | label height in px
|
|
|
|
corner_radius | corner radius in px
|
|
|
|
fg_color | forground color, tuple: (light_color, dark_color) or single color
|
|
|
|
bg_color | background color, tuple: (light_color, dark_color) or single color
|
|
|
|
text_color | label text color, tuple: (light_color, dark_color) or single color
|
|
|
|
text_font | label text font, tuple: (font_name, size)
|
|
|
|
</details>
|
|
|
|
|
|
|
|
### CTkEntry
|
|
|
|
Example Code:
|
|
|
|
```python
|
|
|
|
entry = customtkinter.CTkEntry(master=root_tk,
|
|
|
|
width=120,
|
|
|
|
height=25,
|
|
|
|
corner_radius=10)
|
|
|
|
entry.place(relx=0.5, rely=0.5, anchor=tkinter.CENTER)
|
|
|
|
|
|
|
|
text = entry.get()
|
|
|
|
```
|
|
|
|
<details>
|
|
|
|
<summary>Show all arguments:</summary>
|
|
|
|
|
|
|
|
argument | value
|
|
|
|
--- | ---
|
|
|
|
master | root, tkinter.Frame or CTkFrame
|
|
|
|
width | entry width in px
|
|
|
|
height | entry height in px
|
|
|
|
corner_radius | corner radius in px
|
|
|
|
fg_color | forground color, tuple: (light_color, dark_color) or single color
|
|
|
|
bg_color | background color, tuple: (light_color, dark_color) or single color
|
|
|
|
text_color | entry text color, tuple: (light_color, dark_color) or single color
|
|
|
|
text_font | entry text font, tuple: (font_name, size)
|
|
|
|
</details>
|
|
|
|
|
|
|
|
### CTkSlider
|
|
|
|
Example Code:
|
|
|
|
```python
|
|
|
|
def slider_event(value):
|
|
|
|
print(value)
|
|
|
|
|
|
|
|
slider = customtkinter.CTkSlider(master=root_tk,
|
|
|
|
width=160,
|
|
|
|
height=16,
|
|
|
|
border_width=5.5,
|
|
|
|
command=slider_event)
|
|
|
|
slider.place(relx=0.5, rely=0.5, anchor=tkinter.CENTER)
|
|
|
|
```
|
|
|
|
<details>
|
|
|
|
<summary>Show all arguments:</summary>
|
|
|
|
|
|
|
|
argument | value
|
|
|
|
--- | ---
|
|
|
|
master | root, tkinter.Frame or CTkFrame
|
|
|
|
command | callback function, gest called when slider gets changed
|
|
|
|
width | slider width in px
|
|
|
|
height | slider height in px
|
|
|
|
border_width | space around the slider rail in px
|
|
|
|
fg_color | forground color, tuple: (light_color, dark_color) or single color
|
|
|
|
bg_color | background color, tuple: (light_color, dark_color) or single color
|
|
|
|
border_color | slider border color, normally transparent (None)
|
|
|
|
button_color | color of the slider button, tuple: (light_color, dark_color) or single color
|
|
|
|
button_hover_color | hover color, tuple: (light_color, dark_color) or single color
|
|
|
|
</details>
|
|
|
|
|
|
|
|
### CTkProgressBar
|
|
|
|
Example Code:
|
|
|
|
```python
|
|
|
|
progressbar = customtkinter.CTkSlider(master=root_tk,
|
|
|
|
width=160,
|
|
|
|
height=20,
|
|
|
|
border_width=5)
|
|
|
|
progressbar.place(relx=0.5, rely=0.5, anchor=tkinter.CENTER)
|
|
|
|
|
|
|
|
progressbar.set(value)
|
|
|
|
```
|
|
|
|
<details>
|
|
|
|
<summary>Show all arguments:</summary>
|
|
|
|
|
|
|
|
argument | value
|
|
|
|
--- | ---
|
|
|
|
master | root, tkinter.Frame or CTkFrame
|
|
|
|
width | slider width in px
|
|
|
|
height | slider height in px
|
|
|
|
border_width | border width in px
|
|
|
|
fg_color | forground color, tuple: (light_color, dark_color) or single color
|
|
|
|
bg_color | background color, tuple: (light_color, dark_color) or single color
|
|
|
|
border_color | slider border color, tuple: (light_color, dark_color) or single color
|
|
|
|
progress_color | progress color, tuple: (light_color, dark_color) or single color
|
|
|
|
</details>
|
|
|
|
|
|
|
|
### CTkFrame
|
|
|
|
Example Code:
|
|
|
|
```python
|
|
|
|
frame = customtkinter.CTkSlider(master=root_tk,
|
|
|
|
width=200,
|
|
|
|
height=200,
|
2021-03-05 02:05:34 +03:00
|
|
|
corner_radius=10)
|
2021-03-05 01:39:09 +03:00
|
|
|
frame.place(relx=0.5, rely=0.5, anchor=tkinter.CENTER)
|
|
|
|
```
|
|
|
|
<details>
|
|
|
|
<summary>Show all arguments:</summary>
|
|
|
|
|
|
|
|
argument | value
|
|
|
|
--- | ---
|
|
|
|
master | root, tkinter.Frame or CTkFrame
|
|
|
|
width | slider width in px
|
|
|
|
height | slider height in px
|
|
|
|
fg_color | forground color, tuple: (light_color, dark_color) or single color
|
|
|
|
bg_color | background color, tuple: (light_color, dark_color) or single color
|
|
|
|
</details>
|
|
|
|
|
|
|
|
#
|