Custom tkinter is a better version of tkinter, it is quite similar to tkinter but you already get a more modern look without doing anything.
So to set it up we start with installing the library in the terminal with:
pip install customtkinter
then import the library into your code with:
import customtkinter
after that you need to initialise the screen with the following:
root = customtkinter.CTk()
in custom tkinter there are some easy features to make it look better imediately. For example you could set the theme to dark or light mode and you can have some different color themes.
customtkinter.set_appearance_mode("dark") #or light
customtkinter.set_default_color_theme("green") #or blue / dark blue
next you should give the screen a size. You can choose to make the screen a fixed size with geometry or make it full screen in which the size depends on the resolution of the screen.
root.attributes("-fullscreen", True)
root.geometry('1920x1080')
now we can start messing with the layout of the screen. In custom tkinter there are a lot of options for dropdown menu’s to progress bars, but for this how to I will keep it to the basics. You start with making a frame in which you can put your buttons and labels.
Frame1 = customtkinter.CTkFrame(master=root)
you can also place buttons immediately into the root, but for organising your buttons it is easier to make different frames. That is the next thing we want to look at, how to organise your layout. You can do that with different methods. You can do it with pack which let you place your frames and labels easily if you have a small interface. When your interface gets bigger it will get harder to keep track of where to put things and when your resolution of the screen changes the chance is high that it will totally screw up your interface. The other way is working with grid. This is a layout system where you create a grid and place the frames somewhere in that grid. In the frames you can again create a grid in which you can put your labels and buttons. The width and height of the frames depends on the weights of the rows and columns in the root. You can set this weight so that when you create your interface on your own screen it will be dynamic for other screen resolutions. It is also possible to set the width and height of frames but you will lose the modularity for other screen resolutions.
root.grid_rowconfigure(0, weight=1)
root.grid_columnconfigure(0, weight=1)
root.grid_columnconfigure(1, weight=1)
root.grid_columnconfigure(2, weight=2)
root.grid_columnconfigure(3, weight=1)
frame1.grid(row=0, column=2)
now you can put your buttons in there
Button = customtkinter.CTkButton(
master=frame1,
corner_radius=0,
text="hoisting mode",
font=(font, fontsize),
fg_color=button_color,
command=button_function
)
Button.grid(row=0, column=0, pady=(20, 0), padx=0)
To make a functionality with the button you can make a function that is called button_function and put your actions there.
This is mainly what it is to make an interface with custom tkinter. There is just one thing left that I was struggling with and that is putting a picture in the interface.
To do this you should do:
From PIL import image
Then you can get and place the image with the following code
light_image = Image.open("your_image.jpg")
my_image = customtkinter.CTkImage(light_image=light_image, size=(200,200))
image_label = customtkinter.CTkLabel(frame1, image=my_image, text="")
image_label.image = my_image
image_label.grid(row=0, column=0, padx=(20, 0), sticky="")
the problem I was looking at the most is that the terminal said “ipython1 image not found” and after a lot of time I concluded that you should just restart the terminal and the problem got solved.
So those are the basics of making an interface with custom tkinter