I use Drag and Drop to build modern Python Apps
Вставка
- Опубліковано 15 чер 2024
- Discover the power of Tkinter Designer and Figma in this tutorial video! Learn how to effortlessly create stunning GUI applications without writing a single line of code. Follow along as we explore the seamless integration of design and functionality, turning your design dreams into reality. From downloading Tkinter Designer to customizing elements in Figma, and finally, generating Python code, this video covers it all. Join us on this journey to unlock the full potential of GUI application development. Watch now and revolutionize your workflow!
Useful Links
🔷 Tkinter Designer: github.com/ParthJadhav/Tkinte...
🔷 PyPi: pypi.org/project/tkdesigner/
🔷 Element Formatting Docs: github.com/ParthJadhav/Tkinte...
00:00 Introduction to Tkinter Designer
01:00 Downloading and setting up Tkinter Designer
02:24 Installing Tkinter Designer Dependencies
04:00 Designing GUI App with Tkinter Designer
11:15 Convert Figma Design to Python Code using Tkinter Designer
13:30 Conclusion
Follow Me on:
📹 UA-cam: / softlinks
📝 LinkedIn: / hassan-shoayb
📱 Twitter: / hassan_shoayb
📸 Instagram: / hassan_shoayb
✨ HashTags ✨
#python #tkinter #tkinterDesigner #gui
I really appreciated this video, it will help me a lot in my work, because I used tkinter from python a lot.. thank you!!!!!!!!!!!!!
Glad it helped!…Thanks for watching
lovely tutorials thanks
Thanks for watching!
You're an excellent teacher.
Wow, thank you so much 😊
so useful , thank you.
Thanks for watching
Send by God indeed, best tutorial ever.
Glad it was helpful!…Thanks for watching
useful thanks, hello from kazakhstan
Thanks for watching from Kazakhstan…stay tuned for more…
thank you for this good tutorial
Glad it was helpful!…You’re most welcomed ☺️
You were sent by God bro... thank you !!!!
Glad I could help…Thanks for watching
lovely man thanks a lot!
You're welcome!...Thanks for watching
The fonts doesnt work on vscode. How to fix that?
love you guys
Thanks for watching
Thank you so much man, I was really not looking forward to having to design the whole program using my limited knowledge on tinker.
Glad I could help!..Thanks for watching
Thank you!
You’re most welcomed
Thank you!!!
You're welcome!
Hi! Great video, question tho, aren't you supposed to group the buttons above for google and facebook signup and name the group 'Button'?
Yes correct, I did that for demonstration purpose just to get rid of the white rectangles at the edge of buttons that Tkinter tends to add. Incase you want resolve that, draw an extra rectangle in the background of your buttons and ensure that the background matches the main background of the app design, and then group as Button.
@@Softlinks i have tried this multiple times now and still not working, maybe i misinterpret some things about what you said since i don't have visuals on how to actually do it... XD
this is good but a way better solution is tauri. it uses HTML CSS and JS to make the frontend and has a rust backend. its like designing a website but instead in your browser. its in a lightweight desktop application
your tutorials are really nice
I appreciate your input and will definitely check out Tauri!
I got everything right, but in the final step where i was supposed to run the GUI file, i didn't see how you ran it. can you please explain it? Also, will this make the GUI interactive? I already created my database to store all inputs and data, my question is can I connect my work to the db? and how to do that? THANK YOU so so so much!!! I have been struggling for a few days now to find a way to convert my Figma design into something that Python can understand.
Of course! To run the GUI file generated by Tkinter Designer, you would typically open the Python file (usually named something like “GUI.py”) using a Python interpreter or an IDE like VS Code. You can do this by simply double-clicking on the file or by using the command line to navigate to the directory where the file is located and then running it with the Python interpreter.
As for making the GUI interactive and connecting it to your database, yes, you can definitely achieve that! Tkinter Designer generates the basic structure of the GUI, but you can further customize it and add functionality as needed.
To connect your GUI to a database, you’ll need to use a database library in Python (such as SQLite3, MySQL Connector, or SQLAlchemy) to interact with your database. You can then write functions in your GUI code to handle database operations like inserting, updating, deleting, and querying data.
everyone if ever you encounter invalid URL just Replace "design" in URL with "file"😇
thank you bro!
when i click generate it says invalid url. but i copy the URL of my design
I have the same problem, were you able to fix it??
I have the same problem, can somebody help me?
Error Appearing "Pls Enter a valid File URL". I am working on another project but after clicking on "Generate" on Tkinter Designer, this error shows up. Any help?
Same here. Worked perfectly fine before now it's not...unsure what happened
i suffer the same cause😭
me too, i nedd help:(
very usefuls, but how to add checkbox to confirm TOS
Check boxes will be available soon…otherwise you will need to add it using Tikinter code 🧑💻
Can we also make a simple game like gui with moving objects through this method?
Absolutely! While Tkinter Designer is primarily geared towards designing GUI applications, you can still create simple games with moving objects using Tkinter. You would design the interface elements with Tkinter Designer and then implement the game logic, including moving objects, using Python code. It might require a bit more coding than a traditional GUI application, but it's definitely possible! Let me know if you need more details on how to get started with game development using Tkinter.
@@SoftlinksOk, Thank you 😊
how to change the Textbox font ??
You can use the fonts button at the right hand side of your figma desktop App. Thanks for watching.
Hello, good morning. I have a question. Regarding the last step when I am using the Tkinter Designer app, it keeps displaying the message, "Please enter a valid file URL." even though I followed every step you made and double-checked if I got anything wrong. Can any please help me?
Replace "design" in URL with "file"
@@kawthersiahmed8134 thank you for your help //
thanks for the video, the gui.py file is not in my build folder, thanks
Thank you for watching! I’m sorry to hear you’re experiencing trouble finding the gui.py file. Did you encounter any errors while converting the Figma design into Python GUI? Understanding the issues you faced could help me troubleshoot the missing gui.py file. Let me know if I can assist further!
i get this error: Frame not found in figma file or is empty and im sure all my widgets are in one frame
If you got this error when trying to convert your figma file to python code and you’ve checked your figma widgets are inside a frame, then maybe you should checkout this doc: github.com/ParthJadhav/Tkinter-Designer/issues/341
i am in the same directory and it gave me that ther os no such as diirectorydirectory name requirement.txt
so where is the problem
It seems like there might be a typo or an issue with the directory path. Double-check that you're in the correct directory where the `requirement.txt` file is located. If it's still not working, make sure the file is spelled correctly and try running the command again.
I was doing exactly what you did. There were lots of errors. It couldn't paste the token id and file url, I had to type them in. Then, the last thing on my output path, the desktop, I waited for build to appear. Even now, I'm still waiting. I don't know if I wasted my time or I don't know. HELP me!!!!
I understand your frustration, but let's troubleshoot this together. Firstly, ensure that you're copying the token ID and file URL correctly from Figma. Sometimes, errors can occur if there are extra spaces or characters copied along with the token. Secondly, make sure you're pasting the token ID and file URL in the correct fields within Tkinter Designer.
For the issue with the output path, it's possible that the "build" folder might take some time to appear, especially if there are many files being processed. However, if it's taking unusually long, you might want to check if there are any error messages in the console or if there are any permissions issues preventing the folder from being created.
If you're still encountering issues after trying these steps, consider reaching out to the support channels for Tkinter Designer or Figma. They might be able to provide more specific guidance based on the errors you're experiencing. Don't hesitate to ask for help; we're here to support you through this process!
I'm actually making huge progress
lol python is not for drag and dropped lazy ppl you should understand how they work
Can you help me to get it? i have the same problem with the URL
But does the facebook and Google rectangle is not button?
Yes correct, I did that for demonstration purpose just to get rid of the white rectangles at the edge of buttons that Tkinter tends to add. Incase you want resolve that, draw an extra rectangle in the background of your buttons and ensure that the background matches the main background of the App design.
I'm getting invalid url path error despite the fact I copied it from figma directly any solution?
Same here! Did you managed to fix it?
same here!
Nope
why is my url invalid? i just followed your instructions :(
Me too, can somebody help us???
Screen
Can’t understand the accent …?
I apologise my accent is difficult to understand, I'll work on improving it for better communication in the future videos.
Sounds fine to me.
@Rio have you tried it with subtitles, if you're having trouble?
Listening to more non-native English speakers will improve your English listening skills.
Error Appearing "Pls Enter a valid File URL". I am working on another project but after clicking on "Generate" on Tkinter Designer, this error shows up. Any help?
I got the same problem. do you find anyway to fix it yet
Tkinter Designer automatically converts to figma design to python code what's the use of converting to python code?
converting Figma designs to Python code using Tkinter Designer streamlines the development workflow, improves accuracy, and enhances collaboration between designers and developers.
@@Softlinks can u make a video on ux designing how UI works with UX design and also please do a project on UI/ux designing how python works in backend?
@@kalyanamvenumadhav2245 Thank you for your suggestion! I'll definitely create a video tutorial on UX/UI design and how Python integrates with backend development. Stay tuned for updates on when the video will be released!"
@@SoftlinksPlease!!