new Readme.md
152
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
|
||||
|
@ -1,4 +1,4 @@
|
||||
__version__ = "3.5"
|
||||
__version__ = "3.6"
|
||||
|
||||
from .customtkinter_input_dialog import CTkInputDialog
|
||||
from .customtkinter_button import CTkButton
|
||||
|
Before Width: | Height: | Size: 286 KiB |
Before Width: | Height: | Size: 276 KiB |
Before Width: | Height: | Size: 274 KiB |
Before Width: | Height: | Size: 282 KiB |
Before Width: | Height: | Size: 197 KiB |
BIN
documentation_images/Windows_dark.png
Normal file
After Width: | Height: | Size: 337 KiB |
BIN
documentation_images/Windows_manual_mode_change.gif
Normal file
After Width: | Height: | Size: 12 MiB |
BIN
documentation_images/Windows_system_mode_change.gif
Normal file
After Width: | Height: | Size: 17 MiB |
BIN
documentation_images/Winodws_light.png
Normal file
After Width: | Height: | Size: 334 KiB |
Before Width: | Height: | Size: 25 KiB |
Before Width: | Height: | Size: 659 KiB |
Before Width: | Height: | Size: 673 KiB |
Before Width: | Height: | Size: 644 KiB |
BIN
documentation_images/macOS_dark.png
Normal file
After Width: | Height: | Size: 2.9 MiB |
BIN
documentation_images/macOS_light.png
Normal file
After Width: | Height: | Size: 3.0 MiB |
Before Width: | Height: | Size: 260 KiB |
BIN
documentation_images/macOS_system_mode_change.gif
Normal file
After Width: | Height: | Size: 8.2 MiB |
Before Width: | Height: | Size: 1.4 MiB |
@ -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)
|
||||
|