changed Readme

This commit is contained in:
Tom Schimansky 2022-01-22 20:28:59 +01:00
parent 43a1c28947
commit 3d5ae07288
13 changed files with 64 additions and 61 deletions

View File

@ -101,19 +101,14 @@ the System mode:
Here I used the ``customtkinter.CTk()`` class to create the main window with two CTkFrame's and 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 set the appearance mode to `System`. It has some
kind of a menu on the left side, and I used all CustomTkinter elements 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 there are at the moment. Maybe this is a good reference if you want to
create your own application with this library. create your own application with this library.
(Code: /complex_example.py) (Code: `examples/complex_example.py`)
With macOS dark-mode turned on, it looks like this: With macOS dark-mode turned on, it looks like this:
![](documentation_images/macOS_complex_dark.png) ![](documentation_images/macOS_complex_dark.png)
But you can also customize it by yourself. Here I changed the main
colors and removed the round corners, and added a border to the buttons:
![](documentation_images/macOS_complex_other_style.png)
### Default color themes ### Default color themes
If you don't set any colors at all you will get the standard blue If you don't set any colors at all you will get the standard blue
@ -142,6 +137,9 @@ Example 1: ```examples/complex_example.py``` (light and dark mode)
![](documentation_images/Windows_complex_bg.jpg) ![](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) Example 2: ```examples/complex_example_custom_colors.py``` (dark mode)
![](documentation_images/Windows_complex_other_style_bg.jpg) ![](documentation_images/Windows_complex_other_style_bg.jpg)

Binary file not shown.

Before

Width:  |  Height:  |  Size: 169 KiB

After

Width:  |  Height:  |  Size: 1.4 MiB

View File

@ -3,7 +3,7 @@ import tkinter.messagebox
import customtkinter import customtkinter
import sys import sys
customtkinter.set_appearance_mode("System") # Other: "Light", "Dark" customtkinter.set_appearance_mode("System") # Modes: "System" (standard), "Dark", "Light"
customtkinter.set_default_color_theme("green") # Themes: "blue" (standard), "green", "dark-blue" customtkinter.set_default_color_theme("green") # Themes: "blue" (standard), "green", "dark-blue"

View File

@ -4,7 +4,7 @@ import customtkinter
import sys import sys
# Set dark appearance mode: # Set dark appearance mode:
customtkinter.set_appearance_mode("Dark") # Other: "Light", "System" customtkinter.set_appearance_mode("Dark") # Modes: "System" (standard), "Dark", "Light"
class App(customtkinter.CTk): class App(customtkinter.CTk):

View File

@ -4,7 +4,7 @@ import customtkinter
from PIL import Image, ImageTk from PIL import Image, ImageTk
import os import os
customtkinter.set_appearance_mode("Dark") # Other: "Light", "System" customtkinter.set_appearance_mode("Dark") # Modes: "System" (standard), "Dark", "Light"
customtkinter.set_default_color_theme("blue") # Themes: "blue" (standard), "green", "dark-blue" customtkinter.set_default_color_theme("blue") # Themes: "blue" (standard), "green", "dark-blue"
PATH = os.path.dirname(os.path.realpath(__file__)) PATH = os.path.dirname(os.path.realpath(__file__))

View File

@ -0,0 +1,55 @@
import tkinter
import customtkinter # <- import the CustomTkinter module
from PIL import Image, ImageTk # <- import PIL for the images
import os
PATH = os.path.dirname(os.path.realpath(__file__))
customtkinter.set_appearance_mode("System") # Modes: "System" (standard), "Dark", "Light"
customtkinter.set_default_color_theme("blue") # Themes: "blue" (standard), "green", "dark-blue"
root_tk = customtkinter.CTk() # create CTk window like you do with the Tk window (you can also use normal tkinter.Tk window)
root_tk.geometry("450x260")
root_tk.title("CustomTkinter button images")
def button_function():
print("button pressed")
# load images as PhotoImage
settings_image = ImageTk.PhotoImage(Image.open(PATH + "/test_images/settings.png").resize((30, 30)))
bell_image = ImageTk.PhotoImage(Image.open(PATH + "/test_images/bell.png").resize((30, 30)))
add_folder_image = ImageTk.PhotoImage(Image.open(PATH + "/test_images/add-folder.png").resize((30, 30), Image.ANTIALIAS))
add_list_image = ImageTk.PhotoImage(Image.open(PATH + "/test_images/add-list.png").resize((30, 30), Image.ANTIALIAS))
add_user_image = ImageTk.PhotoImage(Image.open(PATH + "/test_images/add-user.png").resize((30, 30), Image.ANTIALIAS))
chat_image = ImageTk.PhotoImage(Image.open(PATH + "/test_images/chat.png").resize((30, 30), Image.ANTIALIAS))
home_image = ImageTk.PhotoImage(Image.open(PATH + "/test_images/home.png").resize((30, 30), Image.ANTIALIAS))
frame_1 = customtkinter.CTkFrame(master=root_tk, width=250, height=240, corner_radius=15)
frame_1.pack(padx=20, pady=20, side="left")
button_1 = customtkinter.CTkButton(master=frame_1, image=add_folder_image, text="Add Folder", width=190, height=50,
corner_radius=10, compound="right", command=button_function)
button_1.place(relx=0.5, rely=0.2, anchor=tkinter.CENTER)
button_2 = customtkinter.CTkButton(master=frame_1, image=add_list_image, text="Add Item", width=190, height=50,
corner_radius=10, compound="right", fg_color="#D35B58", hover_color="#C77C78",
command=button_function)
button_2.place(relx=0.5, rely=0.5, anchor=tkinter.CENTER)
button_3 = customtkinter.CTkButton(master=frame_1, image=chat_image, text="", width=50, height=50,
corner_radius=10, fg_color="gray40", hover_color="gray35", command=button_function)
button_3.place(relx=0.35, rely=0.8, anchor=tkinter.CENTER)
button_4 = customtkinter.CTkButton(master=frame_1, image=home_image, text="", width=50, height=50,
corner_radius=10, fg_color="gray40", hover_color="gray35", command=button_function)
button_4.place(relx=0.65, rely=0.8, anchor=tkinter.CENTER)
button_5 = customtkinter.CTkButton(master=root_tk, image=add_user_image, text="Add User", width=130, height=90, border_width=4,
corner_radius=10, compound="bottom", border_color="#D35B58", fg_color=("gray80", "gray25"), hover_color="#C77C78",
command=button_function)
button_5.pack(padx=20, pady=20, side="right")
root_tk.mainloop()

View File

@ -1,8 +1,7 @@
import time
import tkinter import tkinter
import customtkinter # <- import the CustomTkinter module import customtkinter # <- import the CustomTkinter module
customtkinter.set_appearance_mode("System") # Other: "Dark", "Light" customtkinter.set_appearance_mode("System") # Modes: "System" (standard), "Dark", "Light"
customtkinter.set_default_color_theme("blue") # Themes: "blue" (standard), "green", "dark-blue" customtkinter.set_default_color_theme("blue") # Themes: "blue" (standard), "green", "dark-blue"
root_tk = customtkinter.CTk() # create CTk window like you do with the Tk window (you can also use normal tkinter.Tk window) root_tk = customtkinter.CTk() # create CTk window like you do with the Tk window (you can also use normal tkinter.Tk window)

View File

@ -1,49 +0,0 @@
import tkinter
import customtkinter # <- import the CustomTkinter module
from PIL import Image, ImageTk # <- import PIL for the images
import os
PATH = os.path.dirname(os.path.realpath(__file__))
customtkinter.set_appearance_mode("System") # Other: "Dark", "Light"
customtkinter.set_default_color_theme("blue") # Themes: "blue" (standard), "green", "dark-blue"
root_tk = customtkinter.CTk() # create CTk window like you do with the Tk window (you can also use normal tkinter.Tk window)
root_tk.geometry("400x400")
root_tk.title("CustomTkinter Test")
def button_function():
print("button pressed")
# load images as PhotoImage
settings_image = ImageTk.PhotoImage(Image.open(PATH + "/test_images/settings.png").resize((40, 40)))
bell_image = ImageTk.PhotoImage(Image.open(PATH + "/test_images/bell.png").resize((40, 40)))
frame_1 = customtkinter.CTkFrame(master=root_tk, width=300, height=350, corner_radius=15)
frame_1.place(relx=0.5, rely=0.5, anchor=tkinter.CENTER)
# button with settings-image and no text
button_1 = customtkinter.CTkButton(master=frame_1, image=bell_image, text="", width=60, height=60,
corner_radius=10, command=button_function)
button_1.place(relx=0.1, rely=0.2, anchor=tkinter.W)
# button with bell-image and standard compound ("left")
button_2 = customtkinter.CTkButton(master=frame_1, image=bell_image, width=60, height=60,
corner_radius=10, command=button_function)
button_2.place(relx=0.9, rely=0.2, anchor=tkinter.E)
# button with bell-image and compound="bottom"
button_3 = customtkinter.CTkButton(master=frame_1, image=bell_image, text="bell_image", compound="bottom",
command=button_function, height=100)
button_3.place(relx=0.5, rely=0.55, relwidth=0.5, anchor=tkinter.CENTER)
# button with settings-image and compound="right"
button_4 = customtkinter.CTkButton(master=frame_1, image=settings_image, text="bell_image", compound="right",
command=button_function, height=60)
button_4.place(relx=0.5, rely=0.85, relwidth=0.5, anchor=tkinter.CENTER)
button_4.configure(text=None)
root_tk.mainloop()

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.4 KiB