Modern GUI with Python - Tkinter Modern Desktop App [For Beginners]

Modern GUI / desktop app with Python and Tkinter. Use the custom Tkinter library to create a modern GUI.
Learn Tkinter and Tkinter for GUI design. Learn how to launch and create your first GUI for Python programs and desktop applications.
In this tutorial, you will:
- Learn about Tkinter and Customtkinter
- Install Customtkinter
- Use labels, buttons, entries in Tkinter
- Make a responsive interface with Tkinter
Source code: github.com/codefirstio/modern...
Timestamps:
00:00 Introduction and demo
01:20 Installing customtkinter
02:35 Creating the interface
05:30 Creating the title label
09:28 Creating the scrollable frame
10:47 Creating the button
11:56 Adding the insert functionality
Socials:
My email: [e-mail]
Tiktok: / hala.codes
*************
*Tags*
Modern Tkinter
Modern Python GUI
Modern GUI Python
Customtkinter
Tkinter tutorial
Tkinter Data Entry
Data Entry form Tkinter
Tkinter install
Tkinter Setup
Tkinter GUI tutorial
GUI tutorial Python
GUI Project Python
Graphical User Interface Python
Python tutorial
Tkinter widgets

[@gnfielies]

Thank you for a brilliant tutorial, love your work. However mine did not turn to dark mode. Interested in deleting todo task or tick boxing it. 😀

[@codefirstwithhala]

Should've mentioned that the theme will look like your system by default! i.e. mine has dark mode so it was dark mode by default. To change it, here's what you can do: ctk.set_appearance_mode("system") -> this is the default value; it will match your system ctk.set_appearance_mode("dark") -> for dark mode always ctk.set_appearance_mode("light") -> for light mode always Will pin this :)

[@gnfielies]

@@codefirstwithhala thank you very much, you just amazing. Applied the code and I got dark mode. ❤️

[@codefirstwithhala]

Perfect =D

[@josh9917]

The last time I commented on your channel, I was in the process of building an Airline Ticket System using Python tkinter. Fast forward and I have been able to complete the project. Now I am making use of Java to build another program which I will complete in a few months. Thank you for your help during that period.

[@JavaMike71]

Awesome tutorial. You are one of the very few who really explains what is going on in great detail and I appreciate that. Keep doing the amazing work 🙂

[@Native_love]

3:10 I have watched 4 or 5 videos on tkinter and you are the first one to say this! EXCELLENT Explanations! ❤❤❤

[@voblizz999]

This video really impressed me. The way that you're able to demonstrate tkinter while also clearly explaining what each line of code does is so valuable!! Keep it up

[@user-ub3vy8rj4d]

Tack så mycket. Tydligt och mycket användbart. Lycka till. Thanks so much. Clear and very useful. Good luck.

[@OriginalRed5]

You are a very good instructor... This was easy to understand!

[@RohitSingh-b2l]

I love your videos, literally no one can explain it as better as you could. thanks for all of your tutorials....💖💖❤❤💖💖

[@marcobachini3130]

Your explanations always extremely clear and to the point 👏👏

[@tua7582]

As always, a nice tutorial! Albeit a somewhat strange design choice: Most desktop developers would have chosen a CTkTextbox instead of the CTkScrollableFrame and placed the CTkEntry above it. That is way more resource-friendly, and also solves the issue your solution has with scrolling, as your entry can scroll out of view (as shown in your video).

[@pingmetal]

That's another good way of doing it. One main difference would be that a CTkTextbox is editable. If you want to be able to freely edit any text in the box then that'd be a better choice, however if you fear accidentally selecting and deleting text, the CTkScrollableFrame seems better.

[@RohitSingh-b2l]

thanks for all your videos and tutorials...i literally love your videos, you explain the best ❤❤💖💖

[@ee-shan5125]

thanks for the detailed video . hoping for more of these in upcoming time

[@PogoDigitalism]

extremely good and well explained tutorial. thank you so much helped me a lot with understanding how to lay out elements

[@autarroy]

I like the way you are explain everything step by step love your explanation

[@SiTheMon777]

That was so useful. Thankyou Hala

[@iamliam1241]

It's always a pleasure to watch your videos.

[@codefirstwithhala]

Thank you for watching!

[@maxfrischdev]

thank you Hala :-)

[@EmmanuelRojasAngeles-tg7ss]

Your awesome, the clarity when it comes to explanation is on point.

[@5krus]

Great tutorial lady

[@kabirasif9567]

Lethal, brain with beauty 😍 Wish, we would talk, go outside, do adventures, hv coffee ☕ 📲

[@alhassanmusah7242]

Awesome

[@nuruljanah9621]

Thanks so much for this wonderful lecture, how can I select and delete from the list in the scrollable frame. Thanks once again.

[@JorgeGomez-bw3zy]

Thanks, very good tutorial. Do you have more videos using 'customtkinter'?

[@_renzy_]

I appreciate the quality of your tutorials and the way you teach (just awesome)... I have one question -> If I want to store that todo list items somewhere eg. local storage, So it will be there, when we relaunch the application... How to add this functionality in todo app

[@ddabrahim]

It was a really nice and simple tutorial. One question, can you make it so the entry widget always stay on top and doesn't scroll? I like the design to overlap the scroll view but I don't want the entry to scroll. Thanks.

[@papito-qf2jj]

thank you Hala it is a great work , if you don't mind how can I make add work with the enter button from keyboard

[@natervaternone2020]

Great tutorial! Can you tell me what theme you are using for VSCode? That is really clean and I love the color scheme

[@jorgeleon9442]

Please create a series of CustomTkinter videos for the most common widgets 🙏

[@jorgeleon9442]

Hello Hana, thanks for such a nice video. I want to create a button that cleans the scrollable_frame. Could you help us with that? Thanks a lot.

[@kevinmakumbe]

Good job Hala, how do you center the window when you run coz it seems not to work in customtkinter?

[@blazexiytb]

alternative for frame class from basic tkinter? I'd like to update a script that used tkinter

[@3DPrintedEngineer]

nice

[@kabirasif9567]

I would be a programming dragon if u was here earlier.

[@mayorc]

If you import tkinter as tk and ctk, can you convert a tk app to ctk just by searching for tk and replacing it with ctk, and CTk prefix for widgets?

[@MuhammadAhmed-nc9pb]

Brilliant as usual , I have an issue It is Light not dark even when I imported sv_ttk library .. is there any solution for that??

[@user-pj6fh7co7s]

thanks

[@TheCrazyblader]

Can u please tell me how i can delete this label form the scrollbar again? would be nice to know! i tried so many things and dont get it...

[@ritwikgiri7972]

@codefirstwithhala Thank you very much for this excellent tutorial. Its been really helpful! While following the process i got stuck in a problem- CTkScrollableFrame, how can i make the scrollbar to stick to the end of input/printed lable automatically? so that i can see the latest entry log/output/print as soon as i hit the button. I have tried 'scrollable_frame._parent_canvas.yview_moveto(1)' -but it didn't work for me . Can you please help with this?

[@atheri0_n]

Hey Hala, thats amazing and easy tutorial. But i am having trouble with error; " AttributeError: partially initialized module 'customtkinter' has no attribute 'CTk' (most likely due to a circular import). Did you mean: 'ctk'? " I installed customtkinter right and imported as ctk too but i still get the error message. Will be great if you would help. Thank you

[@abmastergaming]

Bro did you find the solution? Because in my device it shows the same error message

[@novicetech1]

Hi Hala (or anyone). Great tutorial. I am new to this. I've been struggling trying to figure out how to clear or reset the screen (scrollable frame). Any suggestions? Thanks. Figured this out. I moved the entry field above the scrollable frame and then destroyed the widgets on the scrollable frame from a command in a 'clear entries' button I placed at the bottom of the screen. If there is a better way to do this, please let me know. Thanks.

[@TheCrazyblader]

Thanks! i needed this

[@contraplano3157]

it is possible to change the theme like in pysimplegui? example: sg.theme('Dark Amber 5')

[@codefirstwithhala]

The themes available are dark-blue, blue, and green. You can change it using this line of code: ctk.set_default_color_theme("dark-blue")

[@SkuliX1337]

Hi I am building the same app from scratch but i'm stuck on delete future how i can implement this

[@arshdeepsingh6570]

Cn you share the name of your VSCode Theme. I liked it

[@richard_jacqueline]

need to update for python 3.12. customtkinter seems to be missing things on the newer python

[@marcobachini3130]

I installed customtkinter and everything worked fine but as soon as I try to use the directory "import customtkinter" I receive an error message by VS Code like "module doesn't exist". Do you have any clues on how to solve the problem? Thanks

[@crunckNATIon]

same here was having an issue...i had to install packaging...i used google-fu so hopefully it helps you pip install packaging

[@itzdampsandwich6383]

how do you change the background color with customtkinter. I tried using .config but this isnt supported. though it would work the same as in tkinter, cna you please help?

[@chrisandersen5292]

customtkinter.set_appearance_mode("Dark")

[@user-hz1jw3sb8k]

Hi, it's impossible CTk is not knowldged . . . i uninstalled custom// tkinter better :c, thanks watching video.

[@liamcain18]

i am getting module 'customtkinter' has no attribute 'CTkScrollableFrame', everthing else is fine until this point. I am running 3.11.0 in vs code.

[@codefirstwithhala]

Hi Liam. This is the documentation for the CTkScrollableFrame github.com/TomSchimansky/CustomTkinter/wiki/CTkScrollableFrame It should not be affected by your version. Please make sure there's no typos or things like that. Let me know if you're still getting the error

[@liamcain18]

Thank you Hala. I had not made any typos, I copied the full class from the git hub you supplied but still received the same error. I uninstalled my customtkinter: 'uninstalled customtkinter-5.0.3'. I then reinstalled: 'Successfully installed customtkinter-5.1.2.' So i was using an older version. It now works, so i can get back with the tutorial. Thanks again.

[@kabirasif9567]

How to change background color of window here ?

[@chrisandersen5292]

customtkinter.set_appearance_mode("Dark")

[@georgecarlinismytribe]

Hi - I keep getting: AttributeError: module 'customtkinter' has no attribute 'CTk' Any ideas?

[@tua7582]

Most likely a typo - Python is case-sensitive. Typing something like 'root = ctk.Ctk()' will cause the error you describe. Usually, when Python displays this, it also adds a suggestion on how to correct it. Did you ignore that?

[@georgecarlinismytribe]

@@tua7582 Hi - thanks for the suggestion. I'm using the exact code supplied in the github link. I can't see any typos. Visual Studio Code doesn't suggest any corrections or fixes. ###### import customtkinter as ctk def add_todo(): todo = entry.get() label = ctk.CTkLabel(scrollable_frame, text=todo) label.pack() entry.delete(0, ctk.END) root = ctk.CTk() root.geometry("750x450") root.title("Todo App") title_label = ctk.CTkLabel(root, text="Daily Tasks", font=ctk.CTkFont(size=30, weight="bold")) title_label.pack(padx=10, pady=(40, 20)) scrollable_frame = ctk.CTkScrollableFrame(root, width=500, height=200) scrollable_frame.pack() entry = ctk.CTkEntry(scrollable_frame, placeholder_text="Add todo") entry.pack(fill="x") add_button = ctk.CTkButton(root, text="Add", width=500, command=add_todo) add_button.pack(pady=20) root.mainloop() ###### Visual Studio Code response: AttributeError: module 'customtkinter' has no attribute 'CTk' .

[@georgecarlinismytribe]

Ok - I had to use 'pip3 install customtkinter --upgrade' via command Prompt to update my current installation. Everything works fine now.

[@dombomb4147]

my dark mode doesn't work :(

[@dombomb4147]

does now!

[@user-se9ej9ww6f]

Why does it say name ctk not defined

[@pingmetal]

You forgot to add the line "import customtkinter as ctk".

[@forex_zone]

do people still use tkinter ?

[@pingmetal]

Yes

[@ellis2156]

'Promosm'

[@TomasSchertel]

In my opinion, the problem is that these apps with tkinter are still very ugly when run on Linux. They look good just on Windows. Sadly.