Tkinter-Designer Documentation

Technical Documentation: ParthJadhav/Tkinter-Designer

ℹ️ Provenance: Multi-Tier Ingestion · CodeWiki Reference

Overview (`README.md`)

Translations

💡 Introduction

Tkinter Designer was created to speed up the GUI development process in Python. It uses the well-known design software Figma to make creating beautiful Tkinter GUIs in Python a piece of cake 🍰.

Tkinter Designer uses the Figma API to analyze a design file and create the respective code and files needed for the GUI. Even Tkinter Designer's GUI is created using Tkinter Designer.

📢 Announcement

🎉 Multi frame support is here! 🎉

You can now create multiple frames in a single design file and Tkinter Designer will create the respective code and files for each frame. This is a huge step for Tkinter Designer and I'm really excited to see what you guys create with it.

Feel free to share your creations with the community on Discord.

If you encounter any bugs or have any suggestions, please create an issue here.

☄️ Advantages of Tkinter Designer

Interfaces with drag and drop.
A great deal quicker than writing code by hand
Produce more gorgeous interfaces

⚡️ Read the instruction here

View the YouTube video or read the instructions below.

Requirements

Tkinter Designer supports Python 3.9 and newer. Install it with:

bash

pip install tkdesigner

The CLI accepts both current figma.com/design/... links and legacy figma.com/file/... links. If you select a specific frame before copying the Figma link, Tkinter Designer will generate that selected frame.
Always wrap Figma URLs in quotes when running from a shell, because Figma links often include ? and & query parameters.

bash

tkdesigner "$FILE_URL" "$FIGMA_TOKEN"

To generate a class-based Tkinter app:

bash

tkdesigner --template class $FILE_URL $FIGMA_TOKEN

To generate one app with Back/Next navigation across multiple Figma frames:

bash

tkdesigner --template pages $FILE_URL $FIGMA_TOKEN

Generated apps can also apply a ttk theme:

bash

tkdesigner --theme clam $FILE_URL $FIGMA_TOKEN

Generated gui.py files can be imported from another Python file without starting mainloop() automatically, so you can attach commands separately and regenerate the UI later. Use -f when you want the CLI to clear and regenerate an existing build directory.

🦋 Supporting Tkinter Designer

Consider making a donation to the Tkinter Designer project if you or your business have benefited from it. This will accelerate Tkinter Designer's development! Making coffee is simple; I'll be happy to enjoy one.

🔵 Discord server & Linkedin

Click the button below to join the discord server or Linkedin

📐 How it Works

The only thing the user needs to do is design an interface with Figma, and then paste the Figma file URL and API token into Tkinter Designer.

Tkinter Designer will automatically generate all the code and images required to create the GUI in Tkinter.

🎯 Examples

The possibilities are endless with Tkinter Designer, but here are a couple of GUIs that can be perfectly replicated in Tkinter.

^{The following are not my creations.}

HotinGo [(More Info)](https://github.com/Just-Moh-it/HotinGo)

CodTubify [(More Info)](https://github.com/iamDyeus/CodTubify)

BeAnonymous [(More Info)](https://github.com/MambaCodes/BeAnonymous)

Frame Recorder [(More Info)](https://github.com/mehmet-mert/FrameRecorder)

WhatBulk [(More Info)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link)

Atarbals-Modern-Antivirus [(More Info)](https://github.com/HarshscGithub/Atarbals-Modern-Antivirus)

🔥 Showcase

Please let me know if Tkinter Designer was used to create your app. More illustrations will be
beneficial for other people!

(See: Contact Me) or use Show and Tell section in Discussions.

📄 License

Tkinter Designer is licensed under the BSD 3-Clause "New" or "Revised" License.
View Here.

Permissions	Restrictions	Conditions
✓ Commercial Use	× Liability	🛈 License and Copyright Notice
✓ Modification	× Warranty
✓ Distribution
✓ Private Use

Contribute

All contributions from the open-source community, individuals, and partners are welcomed. Our achievement is a result of your active participation.

Contributing guidelines

Code of conduct

LEARN.md

Connect with me on

Author

Created by Parth Jadhav.

Overview (`tkdesigner/figma/README.md`)

Python representation of Figma nodes.

References

https://www.figma.com/developers/api#files

CONTRIBUTING (`docs/CONTRIBUTING.md`)

Welcome to Tkinter-Designer contributing guide

Thank you for investing your time in contributing to our project!

Read our Code of Conduct to keep our community approachable and respectable.

In this guide you will get an overview of the contribution workflow from opening an issue, creating a PR, reviewing, and merging the PR.

New contributor guide

To get an overview of the project, read the README. Here are some resources to help you get started with open source contributions:

Getting started

If you find something that can be improved, solved or changed you are welcome to do so.

Create a new issue

If you spot a problem with the Tkinter-Designer, search if an issue already exists. If a related issue doesn't exist, you can open a new issue using a relevant issue form.

Solve an issue

Scan through our existing issues to find one that interests you. You can narrow down the search using labels as filters.

Make Changes

Once you find the thing you want to work on.

Fork the repository.
Create a branch for your changes.
Clone and checkout that branch locally.
Install dependencies by pip install -r requirements.txt
Make sure it works as expected.
Make the changes.
Test the changes.
Commit and Push the changes.
Create a Pull Request.

Pull Request

The created Pull request should have a brief description on why and how you made the changes.

Your PR is merged

Congratulations :tada::tada: Thank you :sparkles:.

Once your PR is merged, your contributions will be publicly visible on the Tkinter-Designer.

README.Ar DZ (`docs/README.ar-DZ.md`)

مقدمة

تم إنشاء Tkinter Designer لتسريع عملية تطوير واجهات المستخدم GUI في Python. يستخدم هذا المشروع برنامج التصميم المعروف Figma لتسهيل علمية تطوير واجهات المستخدم الجميلة GUI.

يستخدم المشروع Figma API لتحليل ملف تصميم وإنشاء الكود والملفات المطلوبة لواجهة المستخدم GUI. حتى واجهة المستخدم هذا المشروع تم إنشاؤها باستخدام Tkinter Designer.

☄️ مزايا Tkinter Designer

واجهات drag and drop
أسرع بكثير من تطوير الواجهات يديويًا
القدرة على إنشاء واجهات أكثر جمالاً

⚡️ تثبيت واستعمال Tkinter Designer

تحتوي التعليمات على كل المعلومات حول تثبيت واستعمال Tkinter Designer، بالإضافة إلى troubleshooting والإبلاغ عن المشاكل. يوجد أيضًا مقطع فيديو.

[إقرأ التعليمات](/docs/instructions.ar-DZ.md)

🦋 دعم Tkinter Designer

الحياة بدون قهوة، كشيءٍ بلا شيء... آسف، لم أشرب أي قهوة بعد.

🔵 إنضم للDiscord server الرسمي لTkinter Designer

إضغط على الزر أدناه للانضمام الى الdiscord server للمشاركة في النقاشات.

📐 كيف يعمل

الشيء الوحيد الذي يحتاجه المستخدم هو تصميم الواجهة باستعمال Figma ثم نسخ URL الملف والtoken إلى Tkinter Designer.

سيقوم Tkinter Designer تلقائيًا بإنشاء الكود والصور المطلوبة لإنشاء واجهة المستخدم في Tkinter.

🎯 أمثلة

لا حصر لما يمكنك فعله مع Tkinter Designer، ولكن ستجد أدناه بعض الواجهات التي يمكن نسخها بشكل مثالي إلى Tkinter.

^{الأمثلة الموالية ليست من إنشائي}

صفحة تسجيل

صفحة علامة تجارية

مسجل إطارات [(المزيد من المعلومات)](https://github.com/mehmet-mert/FrameRecorder)

WhatBulk [(المزيد من المعلومات)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link)

🔥 عرض

إذا تم إنشاء تطبيقك باستخدام Tkinter Designer، أخبرني بذلك. رؤية المزيد من الأمثلة سيكون مفيدًا لآخرين!

(أنظر إلى: إتصل بي) أو استعمل قسم Show and Tell في الDiscussions.

📝 إتصل بي

إذا أردت الإتصال بي، يمكنك التواصل معي على [email protected]

📄 الرخصة

تم ترخيص Tkinter Designer بموجب الرخصة BSD 3-Clause "New" or "Revised"
إنظر هنا.

الإذن	القيود	الشروط
✓ الاستخدام التجاري	× المسؤولية القانونية	🛈 إشعار الترخيص وحقوق النشر
✓ التعديل	× الضمان
✓ التوزيع
✓ الاستخدام الشخصي

README.Ban BAN (`docs/README.ban-BAN.md`)

💡 পরিচিতি

টিকিন্টার ডিজাইনার পাইথন এ জিইউআই ডেভেলপমেন্ট প্রক্রিয়া ত্বরান্বিত করার জন্য তৈরি করা হয়েছিল। এটি সুপরিচিত ডিজাইন সফ্টওয়্যার ফিগমা ব্যবহার করে পাইথনে সুন্দর টিকিন্টার জিইউআই তৈরি করে কেকের টুকরো তৈরি করে 🍰.

টিকিন্টার ডিজাইনার একটি ডিজাইন ফাইল বিশ্লেষণ করতে এবং জিইউআই-এর জন্য প্রয়োজনীয় কোড এবং ফাইলগুলি তৈরি করতে ফিগমা এপিআই ব্যবহার করে। এমনকি টিকিন্টার ডিজাইনার এর জিইউআই টিকিন্টার ডিজাইনার ব্যবহার করে তৈরি করা হয়েছে।

📢 ঘোষণা

🎉 মাল্টি ফ্রেম-এর সমর্থন এখানে! 🎉

আপনি এখন একটি একক ডিজাইন ফাইলে একাধিক ফ্রেম তৈরি করতে পারেন এবং টিকিন্টার ডিজাইনার প্রতিটি ফ্রেমের জন্য সংশ্লিষ্ট কোড এবং ফাইল তৈরি করবে। এটি টিকিন্টার ডিজাইনারের জন্য একটি বিশাল পদক্ষেপ এবং আপনি এটি দিয়ে কী তৈরি করেন তা দেখে আমি সত্যিই উত্তেজিত।

ডিসকর্ড-এ সম্প্রদায়ের সাথে আপনার সৃষ্টি নির্দ্বিধায় ভাগ করুন।

আপনি যদি কোন বাগ সম্মুখীন হন বা কোন পরামর্শ থাকে, দয়া করে একটি সমস্যা তৈরি করুন এখানে।

☄️ টিকিন্টার ডিজাইনারের সুবিধা

ড্র্যাগ এবং ড্রপ সহ ইন্টারফেস।
হাত দিয়ে কোড লেখার চেয়ে অনেক দ্রুত।
আরো চমত্কার ইন্টারফেস উত্পাদন।

⚡️ এখানে নির্দেশ পড়ুন

ইউটিউব ভিডিও দেখুন বা নীচের নির্দেশাবলী পড়ুন.

🦋 টিকিন্টার ডিজাইনার সমর্থনকারী

টিকিন্টার ডিজাইনার প্রকল্পে দান করার কথা বিবেচনা করুন যদি আপনি বা আপনার ব্যবসা এটি থেকে উপকৃত হন। এটি টিকিন্টার ডিজাইনারের বিকাশকে ত্বরান্বিত করবে! কফি তৈরি করা সহজ; আমি একটি উপভোগ করতে খুশি হবে.

🔵 ডিসকর্ড সার্ভার এবং লিঙ্কড-ইন

ডিসকর্ড সার্ভার বা লিঙ্কড-ইনে যোগ দিতে নীচের বোতামে ক্লিক করুন

📐 কিভাবে এটা কাজ করে

ব্যবহারকারীকে শুধুমাত্র যা করতে হবে তা হল ফিগমা এর সাথে একটি ইন্টারফেস ডিজাইন করুন এবং তারপর ফিগমা ফাইল ইউআরএল এবং এপিআই টোকেন টিকিন্টার ডিজাইনারে পেস্ট করুন।

টিকিন্টার ডিজাইনার টিকিন্টার-এ জিইউআই তৈরি করার জন্য প্রয়োজনীয় সমস্ত কোড এবং ছবি স্বয়ংক্রিয়ভাবে তৈরি করবে।

🎯 উদাহরণ

টিকিন্টার ডিজাইনারের সাথে সম্ভাবনাগুলি অফুরন্ত, তবে এখানে কয়েকটি জিইউআই রয়েছে যা টিকিন্টার-এ পুরোপুরি প্রতিলিপি করা যেতে পারে।

^{নিম্নলিখিত আমার সৃষ্টি নয়।}

HotinGo [(অধিক তথ্য)](https://github.com/Just-Moh-it/HotinGo)

CodTubify [(অধিক তথ্য)](https://github.com/iamDyeus/CodTubify)

BeAnonymous [(অধিক তথ্য)](https://github.com/MambaCodes/BeAnonymous)

Frame Recorder [(অধিক তথ্য)](https://github.com/mehmet-mert/FrameRecorder)

WhatBulk [(অধিক তথ্য)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link)

Atarbals-Modern-Antivirus [(অধিক তথ্য)](https://github.com/HarshscGithub/Atarbals-Modern-Antivirus)

🔥 প্রদর্শনী

আপনার অ্যাপ তৈরি করতে টিকিন্টার ডিজাইনার ব্যবহার করা হয়েছে কিনা দয়া করে আমাকে জানান। আরও দৃষ্টান্ত অন্য মানুষের জন্য উপকারী হবে!

(দেখুন: [আমার সাথে যোগাযোগ করুন](#-আমার সাথে যোগাযোগ করুন)) অথবা ব্যবহার করুন দেখান এবং বলুন আলোচনা বিভাগে।

📄 লাইসেন্স

টিকিন্টার ডিজাইনার বিএসডি ৩-ক্লজ "নতুন" বা "সংশোধিত" লাইসেন্সের অধীনে লাইসেন্সপ্রাপ্ত।
এখানে দেখুন

অনুমতি	বিধিনিষেধ	শর্তাবলী
✓ বাণিজ্যিক ব্যবহার	× দায়	🛈 লাইসেন্স এবং কপিরাইট বিজ্ঞপ্তি
✓ পরিবর্তন	× ওয়ারেন্টি
✓ বিতরণ
✓ ব্যক্তিগত ব্যবহার

অবদান

ওপেন সোর্স সম্প্রদায়, ব্যক্তি এবং অংশীদারদের থেকে সমস্ত অবদানকে স্বাগত জানানো হয়। আমাদের অর্জন আপনার সক্রিয় অংশগ্রহণের ফল।

Contributing guidelines

Code of conduct

LEARN.md

📝 আমার সাথে যোগাযোগ কর

আমার সাথে যোগাযোগ করতে চাইলে করতে পারেন
আমার কাছে পৌঁছান [email protected]

আমার সাথে সংযোগ করুন

README.Fr FR (`docs/README.fr-FR.md`)

💡 Introduction

Tkinter Designer a été créé pour accélérer le processus de développement des interfaces en Python. Il utilise le logiciel de design bien connu Figma afin de rendre la création de magnifiques interfaces Tkinter en Python du gâteau 🍰.

Tkinter Designer utilise l'API de Figma pour analyser les fichiers de design afin de créer le code et les fichiers respectifs nécessaires à l'interface. Même l'interface de Tkinter Designer à été créée avec Tkinter Designer.

☄️ Avantages de Tkinter Designer

Interfaces en drag and drop
Significativement plus rapide que créer le code manuellement
Capacité de créer des interface encore plus belles

⚡️ Installation et utilisation de Tkinter Designer

Les instructions contiennent toutes les informations à propos de l'installation et de l'utilisation de Tkinter Designer, ainsi que les informations pour diagnostiquer et signaler les problèmes.

[Lire les instructions](instructions.fr-FR.md)

🦋 Soutenir Tkinter Designer

La vie sans café est quelque chose sans quelque chose… désolé, je n'ai pas encore eu mon café.

📐 Comment ça marche

La seule chose que l'utilisateur a besoin de faire est de designer l'interface avec Figma, puis coller le lien du fichier Figma et de sa clé d'API dans Tkinter Designer.

Tkinter Designer génèrera automatiquement tout le code et les images requises à créer l'interface avec Tkinter.

🎯 Exemples

Les possibilités sont infinies avec Tkinter Designer, mais voici quelques interfaces pouvant être parfaitement répliquées au sein de Tkinter.

^{Les créations suivantes ne sont pas les miennes.}

Page d'inscription

Page de marque

Enregistreur d'images [(More Info)](https://github.com/mehmet-mert/FrameRecorder)

WhatBulk [(More Info)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link)

🔥 Vitrine

Si votre application a été créée avec Tkinter Designer, faites le moi savoir. Il sera utile pour d'autres de voir plus d'exemples !
(Se référer à la rubrique Me contacter) ou utilisez la section Show and Tell dans les Discussions.

📝 Me contacter

Si vous souhaitez me contacter, vous pouvez me joindre à [email protected]

📄 Licence

Tkinter Designer est mis à disposition sous licence BSD 3-Clause "Nouvelle" ou "Révisée".
Trouvez-la ici.

Permissions	Restrictions	Conditions
✓ Utilisation commerciale	× Responsabilité	🛈 License et Copyright
✓ Modification	× Garrantie
✓ Distribution
✓ Utilisation privée

README.Gu GU (`docs/README.gu-GU.md`)

પરિચય

Tkinter ડિઝાઇનરને પાયથોનમાં GUI વિકાસ પ્રક્રિયા ઝડપી બનાવવા માટે બનાવવામાં આવી હતી. તે Python માં સુંદર Tkinter GUI બનાવવા માટે જાણીતા ડિઝાઇન Software Figma નો ઉપયોગ કરે છે.

Tkinter ડિઝાઇનર ડિઝાઇન ફાઇલનું વિશ્લેષણ કરવા અને GUI માટે જરૂરી કોડ અને ફાઇલો બનાવવા માટે ફિગ્મા APIનો ઉપયોગ કરે છે. ટિંકટર ડીઝાઈનરની જીયુઆઈ પણ ટિંકટર ડિઝાઇનરની મદદથી બનાવવામાં આવી છે.

Tkinter ડિઝાઇનરના ફાયદા

ઇન્ટરફેસો ખેંચો અને છોડો
મેન્યુઅલી કોડ બનાવવા કરતાં નોંધપાત્ર રીતે ઝડપી
વધુ સુંદર ઇન્ટરફેસો બનાવવાની ક્ષમતા

ઇન્સ્ટોલ અને ઉપયોગ કરી રહ્યું છે Tkinter Designer

સૂચનોમાં મુશ્કેલીનિવારણ અને રિપોર્ટિંગ મુદ્દાઓની માહિતી સાથે, ટિંકિટર ડિઝાઇનર ઇન્સ્ટોલ કરવા અને વાપરવા વિશેની તમામ માહિતી શામેલ છે.

[સૂચનો વાંચો](/docs/instructions.gu-GU.md)

Tkinter સહાયક ટિંકિટર ડિઝાઇનર

Coffee :coffee: વિનાનું જીવન કંઈક વિનાનું છે ... માફ કરશો, મારી પાસે હજી સુધી કોઈ કોફી નથી.

નામકરણનું મહત્વ ([વિડિઓ](https://youtu.be/mFjE2-rbpm8) માં ઉલ્લેખિત અને [સૂચનો](/docs/instructions.gu-GU.md))

Tkinter ડિઝાઇનર તેને કોડમાં કન્વર્ટ કરવા તત્વોના નામ પર ખૂબ આધાર રાખે છે. નામકરણ માર્ગદર્શિકા જુઓ અહીં.

📐 તે કેવી રીતે કાર્ય કરે છે

વપરાશકર્તાને Figma સાથેના ઇન્ટરફેસની ડિઝાઈન કરવાની જરૂર છે, અને તે પછી Figma ફાઇલ URL અને API ટોકનને Tkinter ડિઝાઇનરમાં પેસ્ટ કરો.

Tkinter ડિઝાઇનર, Tkinter માં GUI બનાવવા માટે જરૂરી બધા કોડ અને છબીઓ(images) આપમેળે પેદા કરશે.

🎯 ઉદાહરણો

શક્યતાઓ Tkinter ડિઝાઇનર સાથે અનંત છે, પરંતુ અહીં GUIs ની એક દંપતી છે જે સંપૂર્ણ રીતે Tkinter માં નકલ કરી શકાય છે.

^{નીચેની રચનાઓ મારી નથી.}

નોંધણી પૃષ્ઠ

બ્રાંડિંગ પૃષ્ઠ

ફ્રેમ રેકોર્ડર [(વધુ માહિતી)] ()

WhatBulk [(વધુ માહિતી)] ()

🔥 શોકેસ

જો તમારી એપ્લિકેશન Tkinter ડિઝાઇનર સાથે બનાવવામાં આવી હતી, તો મને જણાવો. અન્ય લોકો વધુ ઉદાહરણો જોવા માટે મદદરૂપ થશે!
અથવા ચર્ચાઓ બતાવો અને કહો વિભાગનો ઉપયોગ કરો.

મારો સંપર્ક કરો

જો તમે મારો સંપર્ક કરવા માંગતા હો, તો તમે મને [email protected] પર પહોંચી શકો છો

📄 લાઇસન્સ

Tkinter ડિઝાઇનર BSD 3-કલમ "નવું" અથવા "સુધારેલ" લાઇસન્સ હેઠળ લાઇસન્સ પ્રાપ્ત છે.
અહીં જુઓ.

અનુમતિઓ	પ્રતિબંધો	શરતો
✓ વ્યાપારી ઉપયોગ	× જવાબદારી	🛈 લાઇસન્સ અને Copyright સૂચના
✓ ફેરફાર	× વોરંટી
✓ વિતરણ
✓ ખાનગી ઉપયોગ

README.Hin HIN (`docs/README.hin-HIN.md`)

💡 प्रस्तावना

Tkinter डिजाइनर का उपयोग Python में GUI विकास प्रक्रिया को गति देने के लिए बनाया गया था। यह Python में सुंदर Tkinter GUI बनाने के लिए प्रसिद्ध डिजाइन सॉफ्टवेयर Figma का उपयोग करता है।

Tkinter डिज़ाइनर एक डिज़ाइन फ़ाइल का विश्लेषण करने और GUI के लिए आवश्यक संबंधित code और फ़ाइलें बनाने के लिए Figma API का उपयोग करता है। यहां तक कि Tkinter डिजाइनर का GUI भी Tkinter डिजाइनर का उपयोग करके बनाया गया है।

☄️ Tkinter डिजाइनर के लाभ

इंटरफेस खींचें(means drag) और छोड़ें(means drop)
मैन्युअल रूप से कोड बनाने की तुलना में महत्वपूर्ण रूप से तेज़ है
अधिक सुंदर इंटरफेस बनाने की क्षमता

🦋 Tkinter डिजाइनर का समर्थन

दो ही तो शौक़ हैं मेरे, कॉफी और coding. … मुझे समर्थन दें, मेरे लिए एक कॉफी खरीदें.

⚡️ Tkinter डिजाइनर को install करे और उसका उपयोग करना

निर्देशों में समस्या निवारण और रिपोर्टिंग समस्याओं की जानकारी के साथ-साथ Tkinter Designer को स्थापित करने और उपयोग करने के बारे में सभी जानकारी शामिल है। एक वीडियो भी है।

[निर्देश पढ़ें](/docs/instructions.md)

[वह वीडियो देखें](https://youtu.be/mFjE2-rbpm8)

🔵 आधिकारिक(official) Tkinter डिज़ाइनर के डिस्कॉर्ड सर्वर से जुड़ें

डिसॉर्डर(Discord) सर्वर(server) से जुड़ने और चर्चाओं में भाग लेने के लिए नीचे दिए गए बटन पर क्लिक करें।

✅ नामकरण(Naming) का महत्व ([वीडियो](https://youtu.be/mFjE2-rbpm8) और[निर्देशों](/docs/instructions.md) में उल्लेख किया गया है)

Tkinter Designer इसे कोड में बदलने के लिए तत्वों के नामों पर बहुत अधिक निर्भर करता है। नामकरण मार्गदर्शिका(naming guide) देखें यहां.

📐 यह काम किस प्रकार करता है

केवल एक चीज जो उपयोगकर्ता को करने की आवश्यकता है वह है Figma के साथ एक इंटरफ़ेस डिज़ाइन करना, और फिर Figma फ़ाइल URL और API टोकन को Tkinter डिजाइनर में पेस्ट करना है।

Tkinter डिज़ाइनर स्वचालित रूप से Tkinter में GUI बनाने के लिए आवश्यक सभी कोड और छवियों(images) को उत्पन्न करेगा।

🎯 उदाहरण

Tkinter डिजाइनर के साथ संभावनाएं अनंत हैं, लेकिन यहां कुछ GUI हैं जिन्हें Tkinter में पूरी तरह से दोहराया(replicated) जा सकता है।

^{निम्नलिखित मेरी रचनाएँ नहीं हैं।}

पंजीकरण(Registration) पेज

ब्रांडिंग पेज

Frame Recorder [(और जानकारी)](https://github.com/mehmet-mert/FrameRecorder)

WhatBulk [(और जानकारी)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link)

🔥 शो-कैस

अगर आपका ऐप Tkinter डिज़ाइनर के साथ बनाया गया था, तो मुझे बताएं। वो दूसरों के लिए उदाहरण देखना मददगार होगा!
(See: मुझसे संपर्क करो) या उपयोग करें Show and Tell section in Discussions.

📝 मुझसे संपर्क करो

अगर आप मुझसे संपर्क करना चाहते हैं, तो आप मुझ तक पहुंच सकते हैं - [email protected]

📄 लाइसेंस

Tkinter Designer को BSD 3-क्लॉज "New" या "Revised" लाइसेंस के तहत लाइसेंस प्राप्त है।
View Here.

अनुमतियां	प्रतिबंध	शर्तेँ
✓ वाणिज्य उपयोग	× लाय्बिलिटी	🛈 लाइसेंस और कॉपीराइट नोटिस
✓ परिवर्तन(Modification)	× गारंटी(Warranty)
✓ वितरण(Distribution)
✓ निजी उपयोग

README.It IT (`docs/README.it-IT.md`)

Translations

💡 Introduzione

Tkinter Designer è stato creato per velocizzare la fase di sviluppo dell'interfaccia grafica in Python. Viene utilizzato il ben noto software di prototipazione grafica Figma per creare stupende interfacce grafiche di Tkinter in Python in un batter d'occhio 👁️.

Tkinter Designer utilizza le API di Figma per analizzare il file di design e crearne dunque il rispettivo codice necessario per la GUI. Persino l'interfaccia di Tkinter Designer è stata creata utilizzando Tkinter Designer.

☄️ Vantaggi di Tkinter Designer

Interfaccia drag and drop
Significativamente più veloce rispetto scrivere il codice manualmente
Facilita la creazione di interfacce ancora più belle

⚡️ Leggi le istruzioni qui -> [Documentazione](/docs/instructions.it-IT.md.md)

Le istruzioni contengono tutte le informazioni utili ad installare ed utilizzare Tkinter Designer, insieme alle informazioni utili alla risoluzione e segnalazione di problemi.

🦋 Supporta Tkinter Designer

Se tu o la tua azienda avete beneficiato di Tkinter Designer, considera a supportare lo sviluppo del progetto tramite una donazione. Questo ne aiuterebbe lo sviluppo! È tanto facile quanto preparare un caffè; preparamene uno per me ;)

🔵 Entra nel server Discord ufficiale di Tkinter Designer

Clicca sul pulsante sottostante per entrare nel server Discord ufficiale e prender parte alla discussione.

📐 Come funziona

L'unica cosa che l'utente deve fare è disegnare un'interfaccia con Figma, di seguito copiare ed incollare l'URL del file di Figma e il token API in Tkinter Designer.

Tkinter Designer genererà automaticamente tutto il codice e le immagini necessarie per creare l'interfaccia grafica in Tkinter.

🎯 Esempi

Le possibilità sono infinite con Tkinter Designer, ma questi sono alcune delle interfacce grafiche che possono essere perfettamente replicate in Tkinter.

^{Le seguenti creazioni non sono mie.}

HotinGo [(Ulteriori informazioni)](https://github.com/Just-Moh-it/HotinGo)

Pagina di registrazione

Pagina di branding

Frame Recorder [(Ulteriori informazioni)](https://github.com/mehmet-mert/FrameRecorder)

WhatBulk [(Ulteriori informazioni)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link)

🔥 Vetrina

Se la tua app è stata fatta con Tkinter Designer, fammelo sapere. Sarebbe d'aiuto mostrare agli altri ulteriori esempi!

(Guarda: Contattami) o utilizza la sezione Show and Tell nella pagina Discussions di GitHub.

📄 Licenza

Tkinter Designer è protetto da licenza BSD 3-Clause "New" or "Revised".

Leggi qui.

Permessi	Restrizioni	Condizioni
✓ Uso commerciale	× Responsabilità	🛈 Avviso di licenza e Copyright
✓ Modifica	× Garanzia
✓ Distribuzione
✓ Uso personale

Contribuisci

Accettiamo qualsiasi contribuzione dalla comunità open-source, individuale o collettiva. Dobbiamo il nostro successo al vostro coinvolgimento attivo.

Linee guida per il contributo

Codice di comportamento

Scopri di più

📝 Contattami

Se vuoi contattarmi, puoi mandare una mail
a [email protected]

README.Kr KR (`docs/README.kr-KR.md`)

💡 소개

Tkinter Designer는 Python에서 GUI 개발 프로세스를 가속화하기 위해 만들어졌습니다. 잘 알려진 디자인 소프트웨어 Figma 를 사용하여 Python에서 아름다운 Tkinter GUI를 만드는 것을 식은 죽 먹기 🥣로 만들었습니다.

Tkinter Designer는 Figma API를 사용하여 설계 파일을 분석하고 GUI에 필요한 코드와 파일을 만듭니다. 심지어 Tkinter Designer의 GUI도 Tkinter Designer를 사용하여 만듭니다.

📢 알립니다!

🎉 멀티 프레임이 지원됩니다! 🎉

이제 단일 설계 파일에 여러 프레임을 작성할 수 있으며 Tkinter Designer는 각 프레임에 대해 각각의 코드와 파일을 작성합니다. 이것은 Tkinter Designer에게 큰 한 걸음입니다. 여러분들이 무엇을 만드는지 보게 되어 정말 기쁩니다.

Discord 에서 커뮤니티와 자유롭게 창작물을 공유할 수 있습니다.

버그가 발생하거나 제안사항이 있을 경우 이슈 here를 생성해주시기 바랍니다.

☄️ Tkinter Designer의 장점

드래그 앤 드롭 인터페이스입니다.
손으로 코드를 작성하는 것보다 훨씬 빠릅니다.
더 멋진 인터페이스 제작할 수 있습니다.

⚡️ 여기에서 사용 설명서를 보실 수 있습니다.

YouTube 동영상을 보거나 아래 사용 설명서을 읽을 수 있습니다.

🦋 Tkinter Designer 후원

Tkinter Designer 프로젝트에서 혜택을 받은 경우 후원을 고려해 보세요. 이것은 Tkinter Designer의 개발을 가속화할 것입니다! 커피를 만드는 것은 간단합니다. 기꺼이 즐기겠습니다.

🔵 Discord server & Linkedin

아래 버튼을 클릭하여 디스코드 서버 또는 Linkedin을 확인할 수 있습니다.

📐 작동 방식

사용자가 해야 할 일은 Figma와 인터페이스를 설계한 다음 Figma 파일 URL과 API 토큰을 Tkinter Designer에 붙여넣기만 하면 됩니다.

Tkinter Designer는 Tkinter에서 GUI를 만드는 데 필요한 모든 코드와 이미지를 자동으로 생성합니다.

🎯 예제

Tkinter Designer를 사용하면 가능성이 무한하지만 Tkinter에서 완벽하게 복제할 수 있는 GUI가 몇 가지 있습니다.

^{예시는 저의 창작물이 아닙니다.}

HotinGo [(More Info)](https://github.com/Just-Moh-it/HotinGo)

CodTubify [(More Info)](https://github.com/iamDyeus/CodTubify)

BeAnonymous [(More Info)](https://github.com/MambaCodes/BeAnonymous)

Frame Recorder [(More Info)](https://github.com/mehmet-mert/FrameRecorder)

WhatBulk [(More Info)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link)

Atarbals-Modern-Antivirus [(More Info)](https://github.com/HarshscGithub/Atarbals-Modern-Antivirus)

🔥 쇼 케이스

당신의 앱을 만들기 위해 Tkinter Designer가 사용되었는지 알려주시기 바랍니다. 더 많은 삽화가 다른 사람들에게 이로울 것입니다!

(See: 연락처) 또는 Show and Tell을 사용해 주세요.

📄 라이센스

Tkinter Designer는 BSD 3-clause "New" 또는 "Reved" 라이센스에 따라 라이센스가 부여됩니다.
View Here

권한	제한사항	조건
✓ 상업적 용도	× 책임	🛈 라이센스 및 저작권 고지
✓ 수정	× 정당한 이유
✓ 분배
✓ 개인 사용

컨트리뷰트

오픈 소스 커뮤니티, 개인 및 파트너의 모든 기여를 환영합니다. 우리의 성과는 당신의 적극적인 참여의 결과입니다.

Contributing guidelines

Code of conduct

LEARN.md

📝 연락처

만약 당신이 나에게 연락하고 싶다면
[email protected] 으로 연락 주세요

Connect with me on

README.Mr MR (`docs/README.mr-MR.md`)

💡 परिचय

Tkinter डिझायनर Python मध्ये GUI विकास प्रक्रियेला गती देण्यासाठी तयार केले गेले. हे सुप्रसिद्ध डिझाइन सॉफ्टवेअर Figma वापरून Python मध्ये सुंदर Tkinter GUI तयार करण्यासाठी केकचा एक तुकडा बनवते 🍰.

डिझाईन फाइलचे विश्लेषण करण्यासाठी आणि GUI साठी आवश्यक संबंधित कोड आणि फाइल्स तयार करण्यासाठी Tkinter Designer Figma API वापरतो. Tkinter Designer चे GUI देखील Tkinter Designer वापरून तयार केले आहे.

📢 घोषणा

🎉 मल्टी फ्रेम समर्थन येथे आहे! 🎉

तुम्ही आता एकाच डिझाईन फाइलमध्ये अनेक फ्रेम तयार करू शकता आणि Tkinter Designer प्रत्येक फ्रेमसाठी संबंधित कोड आणि फाइल्स तयार करेल. Tkinter डिझायनरसाठी ही एक मोठी पायरी आहे आणि तुम्ही याच्या सहाय्याने काय तयार करता हे पाहण्यासाठी मला खूप आनंद झाला आहे.

Discord वर समुदायासोबत तुमची निर्मिती मोकळ्या मनाने शेअर करा.

तुम्हाला काही बग आढळल्यास किंवा काही सूचना असल्यास, कृपया [येथे] (https://github.com/ParthJadhav/Tkinter-Designer) एक समस्या तयार करा.

☄️ Tkinter डिझायनरचे फायदे

ड्रॅग आणि ड्रॉप सह इंटरफेस.
हाताने कोड लिहिण्यापेक्षा खूप जलद
अधिक भव्य इंटरफेस तयार करा

⚡️ येथे सूचना वाचा

YouTube व्हिडिओ पहा किंवा खालील सूचना वाचा.

🦋 समर्थन Tkinter डिझायनर

तुम्‍हाला किंवा तुमच्‍या व्‍यवसायाला याचा फायदा झाला असल्‍यास Tkinter Designer प्रॉजेक्टला देणगी देण्याचा विचार करा. हे Tkinter डिझायनरच्या विकासास गती देईल! कॉफी बनवणे सोपे आहे; मला आनंद होईल.

🔵 Discord सर्व्हर आणि LinkedIn

Discord सर्व्हर किंवा LinkedIn सामील होण्यासाठी खालील बटणावर क्लिक करा

📐 हे कसे कार्य करते

वापरकर्त्याला फक्त एक गोष्ट करणे आवश्यक आहे ते म्हणजे Figma सह इंटरफेस डिझाइन करा आणि नंतर Figma फाइल URL आणि API टोकन Tkinter Designer मध्ये पेस्ट करा.

Tkinter डिझायनर Tkinter मध्ये GUI तयार करण्यासाठी आवश्यक असलेले सर्व कोड आणि प्रतिमा स्वयंचलितपणे व्युत्पन्न करेल.

🎯 उदाहरणे

Tkinter डिझायनरमध्ये शक्यता अंतहीन आहेत, परंतु येथे काही GUI आहेत ज्या Tkinter मध्ये उत्तम प्रकारे तयार केल्या जाऊ शकतात.
^{खालील माझी निर्मिती नाही.}

HotinGo [(More Info)](https://github.com/Just-Moh-it/HotinGo)

CodTubify [(More Info)](https://github.com/iamDyeus/CodTubify)

नोंदणी पृष्ठ

ब्रँडिंग पृष्ठ

फ्रेम रेकॉर्डर [(More Info)](https://github.com/mehmet-mert/FrameRecorder)

WhatBulk [(More Info)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link)

🔥 शोकेस

कृपया मला कळवा की Tkinter Designer तुमचा अॅप तयार करण्यासाठी वापरला गेला होता. आणखी चित्रे असतील
इतर लोकांसाठी फायदेशीर!

(पहा: माझ्याशी संपर्क साधा) किंवा चर्चांमध्ये शो आणि सांगा विभाग वापरा .

📄 परवाना

Tkinter डिझायनर BSD 3-क्लॉज "नवीन" किंवा "सुधारित" परवान्याअंतर्गत परवानाकृत आहे.
येथे पहा.

परवानग्या	निर्बंध	परिस्थिती
✓ व्यावसायिक वापर	× दायित्व	🛈 परवाना आणि कॉपीराइट सूचना
✓ फेरफार	× हमी
✓ वितरण
✓ खाजगी वापर

README.Pt BR (`docs/README.pt-BR.md`)

💡 Introdução

Tkinter Designer foi criado para facilitar o desenvolvimento de interfaces gráficas em Python. Utiliza o conhecido software de design Figma para criar belas interfaces gráficas Tkinter em Python ser tão fácil quanto comer bolo 🍰.

Tkinter Designer utiliza a API do Figma para analisar o arquivo de design e criar o respectivo código e os arquivos necessários para a interface gráfica. Até mesmo a interface gráfica do Tkinter Designer foi criada usando o Tkinter Designer.

📢 Anúncio

🎉 O suporte Multiframe chegou! 🎉

Agora você pode criar múltiplos frames em um único arquivo de design e o Tkinter Designer vai criar o respectivo código e arquivos para cada frame. Essa é uma grande evolução para o Tkinter Designer e eu estou muito animado para ver o que vocês vão criar com isso.

Sinta-se a vontade para compartilhar suas criações com a comunidade no Discord.

Se você encontrar algum bug ou tiver alguma sugestão, por favor crie um issue aqui.

☄️ Vantagens do Tkinter Designer

Interfaces arrastando e soltando
Significamente mais rapido para criar do que seria criando código manual
Crie interfaces mais maravilhosas

⚡️ Leia as instruções aqui -> [Documentação](/docs/instructions.pt-BR.md)

As intruções contém todas as informações sobre a instalação e utilização do Tkinter Designer, através dessas intormações podemos revolver problemas e reportar problemas.

🦋 Apoie o Tkinter Designer

Se você ou sua empresa conhecem os benefícios do Tkinter Designer, considerem dar um suporte ao desenvolvimento do projeto através de doações. Isso ajudará o desenvolvimento do Tkinter Designer! É muito fácil - pague-me um Café; Eu vou apreciar ;)

🔵 Inscreva-se no servidor Oficial do Discord do Tkinter Designer

Click no botão abaixo para increver-se no servidor do Discord e começar a fazer parte das discussões.

📐 Como funciona

A única coisa que o usuário precisa é fazer uma interface com o Figma, e após isso colar a URL do Figma file URL e a URL da API token do Figma dentro do Tkinter Designer.

Tkinter Designer pode automaticamente gerar código e imagens requeridas para criar a interface gráfica (GUI) no Tkinter.

🎯 Exemplos

As possibilidades são muitas com Tkinter Designer, mas aqui estão algumas interfaces gráficas (GUIS) que podem ser perfeitamente replicadas no Tkinter.

^{As interfaces gráficas a seguir não são minhas criações.}

HotinGo [(Mais Informações)](https://github.com/Just-Moh-it/HotinGo)

CodTubify [(Mais Informações)](https://github.com/iamDyeus/CodTubify)

BeAnonymous [(Mais Informações)](https://github.com/MambaCodes/BeAnonymous)

Frame Recorder [(Mais Informações)](https://github.com/mehmet-mert/FrameRecorder)

WhatBulk [(Mais Informações)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link)

Atarbals-Modern-Antivirus [(Mais Informações)](https://github.com/HarshscGithub/Atarbals-Modern-Antivirus)

🔥 Casos de sucesso

Se você tiver um app que foi feito com Tkinter Designer, contate-me. Isso pode ajudar outras pessoas, pessoas podem ficar interessadas ao ver esses exemplos!
(Veja: Contate-me) ou utilize Mostrar e Contar.

📄 Licença

Tkinter Designer é licenciado através da licença BSD 3-Clause "New" ou "Revised".
Visualize Aqui.

Permissões	Restrições	Condições
✓ Uso Comercial	× Responsabilidade	🛈 Licença e Notificação de Copyright
✓ Modificação	× Garantia
✓ Distribuição
✓ Uso Privado

📝 Contate-me

Se você quiser me contatar, pode me encontrar no [email protected]

Se conecte comigo no

README.Ru RU (`docs/README.ru-RU.md`)

💡 Введение

Tkinter Designer был создан для ускорения процесса разработки графического интерфейса на Python.

Он использует известное программное обеспечение для проектирования Figma, позволяющее легко создавать красивые графические интерфейсы Tkinter на Python 🍰.

📢 Объявление

🎉 Поддержка нескольких фреймов уже здесь! 🎉

Теперь вы можете создавать несколько фреймов в одном файле дизайна, и Tkinter Designer создаст соответствующий код и файлы для каждого фрейма. Это огромный шаг для Tkinter Designer, и я очень рад увидеть, что вы с его помощью создадите.

Не стесняйтесь делиться своими творениями с сообществом на Discord.

Если вы обнаружите какие-либо ошибки или у вас есть какие-либо предложения, создайте issue здесь.

☄️ Преимущества Tkinter Designer

Интерфейсы с перетаскиванием (drag and drop).
Гораздо быстрее, чем писать код вручную.
Создавайте более красивые интерфейсы.

⚡️ Инструкцию читайте здесь.

Посмотрите видео на YouTube или прочитайте инструкции ниже.

🦋 Поддержка Tkinter Designer

Рассмотрите возможность сделать пожертвование в проект Tkinter Designer, если вы или ваш бизнес получили от этого пользу. Это ускорит разработку Tkinter Designer! Приготовить кофе просто; Я буду рад насладиться одним.

🔵 Сервер Discord и Linkedin

Нажмите кнопку ниже, чтобы присоединиться к серверу Discord или Linkedin.

📐 Как это работает

Единственное, что нужно сделать пользователю, — это разработать интерфейс с помощью Figma, а затем вставить URL-адрес файла Figma и токен API в Tkinter Designer.

Tkinter Designer автоматически сгенерирует весь код и изображения, необходимые для создания графического интерфейса в Tkinter.

🎯 Примеры

Возможности Tkinter Designer безграничны, но вот пара графических интерфейсов, которые можно идеально воспроизвести в Tkinter.

^{Следующее не является моим творением.}

HotinGo [(Узнать больше)](https://github.com/Just-Moh-it/HotinGo)

CodTubify [(Узнать больше)](https://github.com/iamDyeus/CodTubify)

BeAnonymous [(Узнать больше)](https://github.com/MambaCodes/BeAnonymous)

Frame Recorder [(Узнать больше)](https://github.com/mehmet-mert/FrameRecorder)

WhatBulk [(Узнать больше)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link)

Atarbals-Modern-Antivirus [(Узнать больше)](https://github.com/HarshscGithub/Atarbals-Modern-Antivirus)

🔥 Витрина

Сообщите мне, использовался ли Tkinter Designer для создания вашего приложения. Дополнительные иллюстрации будут полезны другим людям!

(См.: Свяжитесь со мной) или используйте раздел Показать и рассказать в обсуждениях.

📄 Лицензия

Tkinter Designer распространяется по лицензии BSD 3-Clause "New" or "Revised".
Просмотреть здесь.

Разрешения	Ограничения	Условия
✓ Коммерческое использование	× Ответственность	🛈 Уведомление о лицензии и авторских правах
✓ Модификация	× Гарантия
✓ Распространение
✓ Частное использование

Способствовать

Приветствуются все вклады сообщества открытого исходного кода, частных лиц и партнеров. Наше достижение – результат вашего активного участия.

Руководство по участию

Кодекс поведения

LEARN.md

📝 Свяжитесь со мной

Если вы хотите связаться со мной, вы можете
сделать это по адресу [email protected]

Свяжитесь со мной на

README.Spa SPA (`docs/README.spa-SPA.md`)

💡 Introducción

Tkinter Designer fue creado para agilizar el desarrolo de GUIs en Python. Éste usa un ya conocido Software de DiseñoFigma para crear bonitas GUIs de Tkinter en Python como un pedazo de pastel 🍰.

Tkinter Designer usa el API de Figma para analizar un archivo de diseño y crear el respectivo código y archivos necesarios para el GUI. Incluso el GUI de Tkinter Designer fue creado usando Tkinter Designer.

☄️ Ventajas de Tkinter Designer

Interfaces de tipo Arrastra y Suélta
Significativamente más rapido que crear código manualmente
Habilidad de crear interfaces más bonitas.

⚡️ Lee las instruciones aquí -> [Documentación](/docs/instructions.md)

Las instruciones contienen toda la informacion sobre la instalación y el uso de Tkinter Designer, junto con información para resolver los problemas y reportar problemas.

🦋 Dar apoyo a Tkinter Designer

Si tú o tu compañía se han beneficiado de Tkinter Designer, considera apoyar el desarrollo del projecto a través de donaciones. Ésto va a impulsar el desarrollo de Tkinter Designer! Es tan fácil como preparar un Cafe; Por favor, haz uno para mi ;)

🔵 Únete al servidor oficial de Discord de Tkinter Designer

Da click en el siguiente botón para unirte al servidor de discord y tomar parte en las discusiones.

📐 Cómo funciona

La única cosa que el usuario debe de hacer es diseñar una interfaz con Figma, y luego pegar el URL de Figma junto con el Token de API en Tkinter Designer.

Tkinter Designer automaticamente generará todo el código e imágenes requeridas para crear la GUI en Tkinter.

🎯 Ejemplos

Las posibilidades son infinitas con Tkinter Designer, pero aquí hay algunas GUIs que pueden ser perfectamente replicadas en Tkinter.

^{Las siguientes no son mis creaciones.}

HotinGo [(Más información)](https://github.com/Just-Moh-it/HotinGo)

Registration Page

Branding Page

Frame Recorder [(More Info)](https://github.com/mehmet-mert/FrameRecorder)

WhatBulk [(More Info)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link)

🔥 Casos de Éxito

Si tu app fue creada con Tkinter Designer, hazmelo saber. Ésto será de ayuda para otros al ver más ejemplos!
(Ve: Contáctame) o usa las secciones Show and Tell.

📄 Licencia

Tkinter Designer está bajo la licencia de BSD 3-Clause "New" o "Revised".
Ver Aquí.

Permisos	Restricciones	Condiciones
✓ Uso Comercial	× Responsabilidad	🛈 Licencia y Notificación de Copyright
✓ Modificación	× Garantía
✓ Distribución
✓ Uso Privado

README.Tr TR (`docs/README.tr-TR.md`)

💡 Tanıtım

Tkinter Designer Python'da GUI hazırlama sürecini hızlandırmak için yapılmıştır. Tkinter Designer bu tasarımı kolayca yapabilmeniz için Figma yazılımını kullanır.

Tkinter Designer Figma API'sini kullanarak bir tasarım dosyasını analiz eder ve ardından GUI için ilgili kodu ve dosyaları sizin için oluşturur. Tkinter Designer'ın GUI tasarımı bile Tkinter Designer kullanarak yapılmıştır.

☄️ Tkinter Designer'ın Avantajları

Sürükle-bırak arayüzler
Manuel olarak kod ile oluşturmaktan çok daha hızlı
Daha güzel arayüzler oluşturmak için bir fırsat

⚡️ Tkinter Designer'ı Kurmak ve Kullanmak

Yönergeler sorun giderme ve hata bildirme ile birlikte Tkinter Designer'ı kurmak ve kullanmak için gereken tüm bilgileri içeriyor.

[Yönergeleri Okuyun](/docs/instructions.tr-TR.md)

🦋 Tkinter Designer'ı Destekleme

Hayat sanki kahvesiz daha … pardon, şu ana kadar hiç kahvem olmadı.

🔵 Tkinter Designer'ın Resmi Discord Sunucusu

Aşağıdaki butona tıklayarak Discord sunucumuza katılın ve tartışmalarda yer alın.

📐 Nasıl Çalışır

Kullanıcıların yapması gereken tek şey Figma ile bir arayüz oluşturmaktır, ardından Figma URL'sini ve API tokenini Tkinter Designer'a yapıştırın.

Tkinter Designer otomatik olarak Tkinter'da GUI için gereken tüm kodu ve resimleri otomatik olarak oluşturacaktır.

🎯 Örnekler

Tkinter Designer ile olasılıklar sonsuzdur, ama burada mükemmel bir şekilde kopyalanabilen birkaç GUI var.

^{Aşağıdakiler benim kreasyonlarım değil.}

Kayıt Sayfası

Marka Sayfası

Frame Recorder [(Daha Fazla Bilgi)](https://github.com/mehmet-mert/FrameRecorder)

WhatBulk [(Daha Fazla Bilgi)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link)

🔥 Vitrin

Eğer Tkinter Designer ile tasarlanmış bir uygulamanız var ise lütfen bana haber verin. Başkalarının daha çok örnek görmesi için yararlı olacaktır!

(Ayrıca: Bana Ulaşın) ya da tartışmalardan Göster ve Anlat bölümünü kullanın.

📝 İletişim

Eğer benimle iletişime geçmek istiyorsanız bana [email protected] mail adresinden ulaşabilirsiniz (İngilizce).

📄 Lisans

Tkinter Designer BSD 3-Clause "Yeni" ya da "Revize Edilmiş" Lisansı ile lisanslanmıştır.
Burdan ulaşabilirsiniz.

İzinler	Kısıtlamalar	Şartlar
✓ Ticari Kullanım	× Sorumluluk	🛈 Lisans ve Telif Hakkı Bildirimi
✓ Modifikasyon	× Garanti
✓ Dağıtım
✓ Özel Kullanım

README.Vi VN (`docs/README.vi-VN.md`)

Here's the translation of the provided text in Vietnamese:

Các bản dịch

💡 Giới thiệu

Tkinter Designer được tạo ra để tăng tốc quá trình phát triển GUI trong Python. Nó sử dụng phần mềm thiết kế nổi tiếng Figma để tạo ra giao diện Tkinter GUI đẹp mắt trong Python một cách dễ dàng như ăn bánh.

Tkinter Designer sử dụng API Figma để phân tích một tệp thiết kế và tạo ra mã và các tệp tương ứng cần thiết cho GUI. Ngay cả giao diện Tkinter Designer cũng được tạo bằng Tkinter Designer.

📢 Thông báo

🎉 Hỗ trợ nhiều frame đã có! 🎉

Bạn có thể tạo nhiều frame trong một tệp thiết kế duy nhất và Tkinter Designer sẽ tạo ra mã và các tệp tương ứng cho mỗi frame. Điều này là một bước quan trọng cho Tkinter Designer và tôi thực sự háo hức xem các bạn tạo ra những gì với nó.

Hãy tự do chia sẻ những tác phẩm của bạn với cộng đồng trên Discord.

Nếu bạn gặp bất kỳ lỗi nào hoặc có bất kỳ đề xuất nào, hãy tạo một issue tại đây.

☄️ Ưu điểm của Tkinter Designer

Giao diện với chức năng kéo và thả.
Nhanh hơn nhiều so với việc viết mã bằng tay.
Tạo ra các giao diện đẹp hơn.

⚡️ Đọc hướng dẫn ở đây

Xem video trên YouTube hoặc đọc hướng dẫn bên dưới.

🦋 Hỗ trợ Tkinter Designer

Hãy xem xét quyên góp cho dự án Tkinter Designer nếu bạn hoặc doanh nghiệp của bạn đã được hưởng lợi từ nó. Điều này sẽ giúp gia tăng quá trình phát triển Tkinter Designer! Hãy mua cho tôi một tách cafe; Tôi sẽ rất vui khi được thưởng thức nó.

🔵 Máy chủ Discord và Linkedin

Nhấp vào nút dưới đây để tham gia máy chủ Discord hoặc Linkedin.

📐 Cách hoạt động

Chỉ cần thiết kế một giao diện bằng Figma, sau đó dán đường dẫn tệp Figma và mã thông báo API vào Tkinter Designer.

Tkinter Designer sẽ tự động tạo tất cả mã và hình ảnh cần thiết để tạo GUI trong Tkinter.

🎯 Ví dụ

Có vô số khả năng với Tkinter Designer, nhưng đây là một số giao diện người dùng có thể được sao chép hoàn hảo trong Tkinter.

^{Các tác phẩm sau không phải do tôi tạo ra.}

HotinGo [(Thông tin chi tiết)](https://github.com/Just-Moh-it/HotinGo)

CodTubify [(Thông tin chi tiết)](https://github.com/iamDyeus/CodTubify)

BeAnonymous [(Thông tin chi tiết)](https://github.com/MambaCodes/BeAnonymous)

MarkMe [(Thông tin chi tiết)](https://github.com/Ayan-thecodeking/MarkMe)

🎓 Hướng dẫn sử dụng

Để biết cách sử dụng Tkinter Designer, hãy xem hướng dẫn chi tiết trong tệp README.md trên GitHub.

Nếu bạn có bất kỳ câu hỏi hoặc cần sự trợ giúp, đừng ngần ngại đặt câu hỏi. Tôi sẽ cố gắng trả lời bạn càng nhanh càng tốt.

Tôi hy vọng bạn tận hưởng việc sử dụng Tkinter Designer và nó mang lại hiệu quả và sự tiện lợi cho quá trình phát triển ứng dụng GUI Python của bạn. Nếu bạn cần thêm thông tin hoặc hỗ trợ, xin vui lòng cho tôi biết.

🎯 Ví dụ

Có vô số khả năng với Tkinter Designer, nhưng đây là một số giao diện người dùng có thể được sao chép hoàn hảo trong Tkinter.

^{Những giao diện dưới đây không phải do tôi tạo ra.}

HotinGo [(Xem thêm)](https://github.com/Just-Moh-it/HotinGo)

CodTubify [(Xem thêm)](https://github.com/iamDyeus/CodTubify)

BeAnonymous [(Xem thêm)](https://github.com/MambaCodes/BeAnonymous)

Frame Recorder [(Xem thêm)](https://github.com/mehmet-mert/FrameRecorder)

WhatBulk [(Xem thêm)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link)

Atarbals-Modern-Antivirus [(Xem thêm)](https://github.com/HarshscGithub/Atarbals-Modern-Antivirus)

🔥 Triển lãm

Hãy cho tôi biết nếu Tkinter Designer đã được sử dụng để tạo ứng dụng của bạn. Nhiều ví dụ sẽ hữu ích cho những người khác!

(Xem: Liên hệ) hoặc sử dụng phần Show and Tell trong phần Thảo luận.

📄 Giấy phép

Tkinter Designer được cấp giấy phép theo

Giấy phép BSD 3-Clause "New" hoặc "Revised".
Xem tại đây.

Quyền hạn	Hạn chế	Điều kiện
✓ Sử dụng thương mại	× Trách nhiệm	🛈 Giấy phép và thông báo bản quyền
✓ Sửa đổi	× Bảo hành
✓ Phân phối
✓ Sử dụng cá nhân

Đóng góp

Tất cả các đóng góp từ cộng đồng mã nguồn mở, cá nhân và đối tác đều được hoan nghênh. Thành tựu của chúng tôi là kết quả của sự tham gia tích cực của bạn.

Hướng dẫn đóng góp

Quy tắc ứng xử

LEARN.md

📝 Liên hệ

Nếu bạn muốn liên hệ với tôi, bạn có thể
liên hệ tôi qua [email protected]

Kết nối với tôi trên [](https://www.linkedin.com/in/parthjadhav04/

README.Zh CN (`docs/README.zh-CN.md`)

💡 介绍

Tkinter Designer 旨在加速 Python 中的 GUI 开发过程。它使用著名的设计软件 Figma 使在 Python 中创建漂亮的 Tkinter GUI 变得轻而易举。

Tkinter Designer 使用 Figma API 来分析设计文件并创建 GUI 所需的相应代码和文件。甚至 Tkinter Designer 的 GUI 也是使用 Tkinter Designer 创建的。

☄️ Tkinter 设计器的优势

拖放界面
比手动创建代码快得多。
能够创建更漂亮的界面。

⚡️ 安装和使用 Tkinter Designer

这些说明包含有关安装和使用 Tkinter Designer 的所有信息，以及用于故障排除和报告问题的信息.

阅读说明书

🦋 支持 Tkinter Designer

没有咖啡的生活是艰难的……对不起，我还没有喝过咖啡。

📐 这个怎么运作

用户唯一需要做的就是用 Figma 设计一个界面，然后将 Figma 文件 URL 和 API 令牌粘贴到 Tkinter Designer 中。

Tkinter Designer 将自动生成在 Tkinter 中创建 GUI 所需的所有代码和图像。

🎯 Examples

Tkinter Designer 的可能性是无限的，但这里有几个可以在 Tkinter 中完美复制的 GUI。

以下不是我的创作。

注册页面

品牌页面

Frame Recorder [(More Info)](https://github.com/mehmet-mert/FrameRecorder)

🔥 展示柜

如果您的应用是使用 Tkinter Designer 制作的，请告诉我。其他人看到更多的例子会很有帮助！
（参见：Contact Me）或使用Show and Tell 部分讨论 .

📝 联络我

如果你想联系我 - [email protected]

📄 执照

Tkinter Designer 根据 BSD 3 条款“新”或“修订”许可获得许可。
View Here.

权限	限制	使适应
✓ 商业用途	× 责任	🛈 许可和版权声明
✓ 修改	× 保修单
✓ 分配
✓ 私人使用

Build (`docs/build.md`)

Building & Releasing to Pypi with Poetry

A Note:

Python packaging is a hot topic, and everyone has an opinion about it.
We migrated to poetry based on discussion in pull request #84
Have we made a huge mistake? If so, open an issue and let us know!

Publishing to testpypi

Install Poetry - ! do not pip install poetry
poetry install - installs dependencies
poetry config repositories.testpypi https://test.pypi.org/legacy/
poetry version $VERSION - bump the version number to the value of <$VERSION>
poetry publish --build -r testpypi -u __token__ -p $TESTPYPI_TOKEN

Packaging [deprecated in Tkinter-Designer as of 1.0.100]

This was preserved as a reference for anyone interested

A brief explanation: packages in python are implicitly declared by providing an __init__.py file.
Any directory with that file present is a package, every file within a package is a module.

So, point the build environment at the dir(s) you want to include in your package in the setup.cfg file.

pyproject.toml is a declarative description of the build environment.
Our build environment needs wheel and setuptools packages to handle building for us.

Here's a tutorial on building/releasing packages for anyone with more interest.

Manual Release

Staging environment:

Make sure conventions are followed and tests pass: flake8 && pytest
Sign up for an account at test.pypi.org and get an API key.
Change the package name in setup.cfg to end in "-"
Create an API key/token for yourself
Create a .pypirc file in your home directory with something like:

text

[testpypi]
  username = __token__
  password = pypi-<YOUR_TOKEN>

pip install --upgrade build twine
Run python -m build from the main project dir, it will create a './dist' dir with the tarball and zip files.
Run twine to publish the dist to the test pypi registry: python -m twine upload --repository testpypi dist/*
To test:
- create a new project directory, blank
- create a venv or whatever you're into: python -m venv .venv
- activate your virtualenv
- pip install -i https://test.pypi.org/simple/ tkdesigner-cli-jvendegna==1.0.11 for example. That one works, feel free to test it.
- tkdesigner $YOUR_FIGMA_TOKEN -f
- python build/gui.py

Note: everywhere you see python is python3, not python2

Instructions.Ar DZ (`docs/instructions.ar-DZ.md`)

كيفية استعمال Tkinter Designer

البدء
تنسيق تصميم Figma
1. المرجع
2. دليل العناصر
إستعمال Tkinter Designer
Troubleshooting

البدء [[الأعلى](#table-of-contents)]

1. تثبيت Python

قبل استعمال Tkinter Designer, ستحتاج إلى تثبيت Python.

لاحقا في هذا الدليل، ستستعمل Package Installer for Python (pip), والذي قد يتطلب منك إضافة Python إلى نظام PATH

2. تثبيت Tkinter Designer

ثلاث خيارات:

pip install tkdesigner
تثبيت poetry
- poetry new gui_project_name && cd gui_project_name
- poetry add tkdesigner
- poetry install
لتشغيل Tkinter Designer من source code, اتبع الخطوات أدناه.
1. تحميل كود Tkinter Designer إما يدويًا أو بواسطة git.
git clone https://github.com/ParthJadhav/Tkinter-Designer.git
1. فتح مجلد Tkinter Designer (تغيير المجلد الحالي)
cd tkinter-designer
1. تثبيت الملحقات الضرورية
- pip install -r requirements.txt
  - في حالة عطب في pip جرب الأوامر التالية:
  - pip3 install -r requirements.txt
  - python -m pip install -r requirements.txt
  - python3 -m pip install -r requirements.txt
  - وإن كان هذا لا يزال يعمل، تأكد من أن Python مُضاف إلى PATH.
. هذا سيقوم بتثبيت كل العناصر الضرورية لعمل Tkinter Designer. قبل استعمال Tkinter Designer ستحتاج إلى إنشاء ملف Figma بالإرشادات التالية.

If you already have created a file then skip to Using Tkinter Designer Section.

إذا أنشأت الملف بالفعل، فانتقل إلى قسم استعمال Tkinter Designer

3. إنشاء حساب Figma

باستعمال متصفح ويب إذهب إلى figma.com وانقر على 'Sign up'
أدخل معلوماتك وتحقق من بريدك الإلكتروني
قم بإنشاء ملف تصميم Figma جديد
إبدأ بإنشاء الواجهة
- القسم الموالي يغطي التنسيق المطلوب لإدخال Tkinter Designer
- هنا الدورة التعليمية الرسمية للبرنامج Figma
- هنا القناة الرسمية في اليوتوب Figma
- هنا مقر المساعدة Figma

تنسيق تصميم Figma [[الأعلى](#table-of-contents)]

1. المرجع

التسمية مهمة

اسم العنصر في Figma	عنصر Tkinter
Button	Button
Line	Line
Rectangle	Rectangle
TextArea	Text Area
TextBox	Entry
Image	Canvas.Image()

يعتمد الكود الذي تم إنشاؤه بواسطة Tkinter Designer على أسماء العناصر من تصميم Figma الخاص بك، وعلى هذا النحو، تحتاج إلى تسمية العناصر الخاصة بك وفقًا لذلك. في Figma ، أعد تسمية عناصرك بالنقر عليها في لوحة Layers.

2. دليل العناصر

أولاً، قم بإنشاء Frame والتي ستكون بمثابة نافذة Tkinter
إضافة صور
- يمكن إنشاء الصور باستخدام الأشكال و / أو الصور
- إذا كنت تستخدم أشكالًا / صورًا متعددة ، فيجب عليك تجميعها معًا عن طريق تحديدها جميعًا والضغط عليها CTRL/⌘ + G
- وبعد ذلك، قم بتسمية العنصر أو المجموعة ب "Image".
نص (نص عادي)
- استخدم مفتاح T لتنشيط أداة Text ، ثم أضف النص حسب الرغبة
- لا يلزم إعادة تسمية النص لاستخدامه في Tkinter Designer
- اضغط على مفتاح Return أو Enter للانتقال إلى السطر التالي.
الإدخال (إدخال مستخدم أحادي السطر)
- قم بتنشيط أداة Rectangle باستخدام R
- اضبط المستطيل حسب رغبتك
- تأكد من تسمية المستطيل "TextBox"
منطقة النص (إدخال مستخدم متعدد الأسطر)
- قم بتنشيط أداة Rectangle باستخدام R
- اضبط المستطيل حسب رغبتك
- تأكد من تسمية المستطيل "TextArea"
Rectangle
- قم بتنشيط أداة Rectangle باستخدام R
- اضبط المستطيل حسب رغبتك
- تأكد من تسمية المستطيل "Rectangle".
زر عادي
- أضف مستطيلاً ليكون بمثابة زر في واجهة المستخدم
- اختياري: أضف نصًا للزر
- حدد الزر (مستطيل) ، وأي نص اختياري ، ثم قم بتجميعها باستخدام CTRL / & # 8984؛ + G
- قم بتسمية المجموعة "Button"

إلجأ إلى هذا الفيديو إذا واجهت أي مشاكل

زر مدور
- أضف مستطيلًا ليكون بمثابة زر في واجهة المستخدم
- اختياري: أضف نصًا للزر
- إجعلها مدورة بإضافة corner radius عن طريق تحديد المستطيل وإضافة corner radius من الجهة اليمنى. إقرأ المزيد عنها
- قم بإنشاء مستطيل بنفس حجم الزر الخاص بك. لا تجعلها مدورة
- قم بتغيير لون المستطيل ليطابق الخلفية
- الآن قم بتحريك المستطيل الذي تم إنشاؤه حديثًا أسفل الزر الرئيسي (مستطيل)
- حدد الزر والمستطيل وأي نص اختياري ، ثم قم بتجميعها باستخدام CTRL / & # 8984؛ + G
- قم بتسمية المجموعة "Button"

إلجأ إلى هذا [الفيديو](https://youtu.be/Qd-jJjduWeQ) إذا واجهت أي مشاكل

استعمال Tkinter Designer [[الأعلى](#table-of-contents)]

المدخلات المطلوبة

هناك بعض المدخلات التي ستحتاج إلى جمعها لتتمكن من استخدام Tkinter Designer.

1. Access Token الشخصي

قم بتسجيل الدخول إلى حساب Figma الخاص بك
انتقل إلى الإعدادات
في علامة التبويب الحساب ، قم بالتمرير لأسفل إلى Personal Access tokens
أدخل اسم access token الخاص بك في نموذج الإدخال واضغط على Enter
سيتم إنشاء access token الخاص بك.
- انسخ هذا access token واحتفظ به في مكان آمن.
- لن تحصل على فرصة أخرى لنسخ هذا token.

2. الحصول على URL الملف

في ملف تصميمك Figma، إضغط على زر Share في القسم العلوي، ثم على 🔗 Copy link

باستعمال CLI

يعد استخدام CLI أمرًا بسيطًا مثل تثبيت الحزمة وتشغيل أداة CLI.

من PyPi

يمكنك استخدام الأوامر أدناه كاختبار باستبدال $FILE_URL و $FIGMA_TOKEN ببياناتك. إذا لم يكن لديك token والرابط فارجع إلى المدخلات المطلوبة.

bash

pip install tkdesigner
tkdesigner $FILE_URL $FIGMA_TOKEN

من Source

لاستخدام CLI من الكود المصدري ، تحتاج إلى clone repository ثم اتباع الإرشادات أدناه.

bash

$ python -m tkdesigner.cli $FILE_URL $FIGMA_TOKEN
# To learn more about how to use the cli, pass the --help flag
$ python -m tkdesigner --help

المخرجات

بشكل تلقائي، كود واجهة المستخدم سيكتب إلى build/gui.py. تستطيع تحديد path المخرج باستعمال flag -o مع path.

لتشغيل واجهة المستخدم المنتجة، قم بcd إلى path الذي ستكتب إليه (build/ مثلاً) وقم بتشغيله مثل أي واجهة مستخدم Tkinter.

bash

cd build
python3 gui.py

استعمال واجهة المستخدم

افتح Tkinter Designer قبل تنفيذ الخطوات التالية

افتح Tkinter Designer GUI عن طريق

text

cd Tkinter-Designer
cd gui
python3 gui.py

إنسخ access token الشخصي إلى Token ID في Tkinter Designer
إنسخ الرابط إلى File URL في Tkinter Designer
إضغط على Output Path لفتح متصفح الملفات
إختر path مخرجات وإضغط على Select Folder
إضغط على Generate

سيتم وضع ملفات الإخراج من Tkinter Designer في path الذي اخترته ، داخل مجلد جديد يسمى build. تهانينا ، لقد قمت الآن بإنشاء Tkinter GUI باستخدام Tkinter Designer!

Troubleshooting [[الأعلى](#table-of-contents)]

العناصر غير مرئية؟ في غير محلها؟
- يرجى التأكد من أن ملف Figma الخاص بك يحتوي على عناصره المسماة بشكل صحيح. * أنظر إلى تنسيق تصميم Figma, §1
الزر له خلفية رمادية من غير قصد؟
- تأكد من إضافة مستطيل خلف عنصر الزر الخاص بك ، وأن لون التعبئة الخاص به هو نفسه لون الخلفية
عناصر غير صحيحة؟
- تأكد من تسمية العناصر الخاصة بك بشكل صحيح في Figma
  - أنظر إلى تنسيق تصميم Figma, §1
النافذة أكبر من الشاشة؟
- قم بتصغير العناصر الخاصة بك في Figma
الملفات لم تُولّد؟
- أعد تشغيل Tkinter Designer
- تحقق مرة أخرى access token وعنوان URL
- تأكد من أن التصميم الخاص بك يحتوي على Frame
شيء آخر؟
- الإبلاغ عن المشكلات غير المدرجة هنا على GitHub

Instructions.Ban BAN (`docs/instructions.ban-BAN.md`)

কবিতা দিয়ে পাইপিকে নির্মাণ ও মুক্তি দেওয়া

একটি নোট:

পাইথন প্যাকেজিং একটি আলোচিত বিষয় এবং প্রত্যেকেরই এটি সম্পর্কে মতামত রয়েছে।
আমরা Pull request #84 এ আলোচনার ভিত্তিতে কবিতায় স্থানান্তরিত হয়েছি।
আমরা কি একটি বড় ভুল করেছি? যদি তাই হয়, একটি সমস্যা খুলুন এবং আমাদের জানান!

টেস্টপিপিতে প্রকাশ করা হচ্ছে

কবিতা ইনস্টল করুন - ! কবিতা ইনস্টল পিপ দিয়ে না
poetry install - নির্ভরতা ইনস্টল করে
poetry config repositories.testpypi https://test.pypi.org/legacy/
poetry version $VERSION - সংস্করণ নম্বরটিকে <$VERSION>-এর মানের সাথে বাম্প করুন
poetry publish --build -r testpypi -u __token__ -p $TESTPYPI_TOKEN

প্যাকেজিং [1.0.100 অনুযায়ী টিকিন্টার-ডিজাইনার-এ অবচয়িত]

এটি আগ্রহী কারো জন্য একটি রেফারেন্স হিসাবে সংরক্ষিত ছিল

একটি সংক্ষিপ্ত ব্যাখ্যা: পাইথন-এ প্যাকেজগুলি একটি __init__.py ফাইল প্রদান করে পরোক্ষভাবে ঘোষণা করা হয়।
সেই ফাইলের সাথে যেকোন ডিরেক্টরি বর্তমান একটি প্যাকেজ, একটি প্যাকেজের মধ্যে থাকা প্রতিটি ফাইল একটি মডিউল।

সুতরাং, আপনি setup.cfg ফাইলে আপনার প্যাকেজে যে dir(গুলি) অন্তর্ভুক্ত করতে চান সেখানে বিল্ড এনভায়রনমেন্ট নির্দেশ করুন।

pyproject.toml হল বিল্ড পরিবেশের একটি ঘোষণামূলক বর্ণনা।
আমাদের বিল্ডিং এনভায়রনমেন্টে আমাদের জন্য বিল্ডিং পরিচালনা করার জন্য চাকা এবং সেটআপ টুল প্যাকেজ প্রয়োজন।

এখানে একটি টিউটোরিয়াল আছে আরো আগ্রহ আছে এমন কারো জন্য প্যাকেজ তৈরি/রিলিজ করার বিষয়ে।

ম্যানুয়াল রিলিজ

স্টেজিং পরিবেশ:

নিশ্চিত করুন যে নিয়মগুলি অনুসরণ করা হয়েছে এবং পরীক্ষায় উত্তীর্ণ হয়েছে: flake8 && pytest৷
test.pypi.org এ একটি অ্যাকাউন্টের জন্য সাইন আপ করুন এবং একটি এপিআই কী পান৷
"-" এ শেষ করতে setup.cfg-এ প্যাকেজের নাম পরিবর্তন করুন
নিজের জন্য একটি এপিআই কী/টোকেন তৈরি করুন
আপনার হোম ডিরেক্টরিতে একটি .pypirc ফাইল তৈরি করুন এরকম কিছু দিয়ে:

text

[testpypi]
  username = __token__
  password = pypi-<YOUR_TOKEN>

pip install --upgrade build twine
মূল প্রকল্প ডির থেকে পাইথন -এম বিল্ড চালান, এটি টারবল এবং জিপ ফাইলের সাথে একটি './dist' ডির তৈরি করবে।
পরীক্ষা pypi রেজিস্ট্রিতে dist প্রকাশ করতে twine চালান: python -m twine upload --repository testpypi dist/*
পরীক্ষা করতে:
- একটি নতুন প্রকল্প ডিরেক্টরি তৈরি করুন, ফাঁকা
- একটি venv তৈরি করুন বা আপনি যা কিছুতে আছেন: python -m venv .venv
- আপনার virtualenv সক্রিয় করুন
- pip install -i https://test.pypi.org/simple/ tkdesigner-cli-jvendegna==1.0.11 উদাহরণস্বরূপ। যে এক কাজ করে, এটা পরীক্ষা নির্দ্বিধায়।
- tkdesigner $YOUR_FIGMA_TOKEN -f
- python build/gui.py

দ্রষ্টব্য: আপনি যেখানেই python দেখছেন সেখানে পাইথন ৩, পাইথন২ নয়

Instructions.Fr FR (`docs/instructions.fr-FR.md`)

Comment utiliser Tkinter Designer

Sommaire

Commencer
Formater votre design Figma
1. Référence
2. Guide des éléments
Utiliser Tkinter Designer
Diagnostic des anomalies

Commencer [[Haut](#Sommaire)]

1. Installer Python

Avant d'utiliser Tkinter Designer, vous devez installer Python.

Plus loin dans ce guide, vous utiliserez le programme d'installation de packages pour Python (pip), ce qui peut vous obliger à ajouter Python à votre PATH système.

2. Installer Tkinter Designer

Une fois Python installé, vous pouvez télécharger Tkinter Designer depuis le dépôt officiel.

Dans la barre latérale de droite, cliquez sur la dernière version et, sous Assets, choisissez tkinter_designer.exe. Une fois l'exécutable téléchargé, vous êtes prêt à exécuter le programme !

Pour exécuter Tkinter Designer à partir du code source, suivez les instructions ci-dessous.

Téléchargez les fichiers sources de Tkinter Designer en les téléchargeant manuellement ou en utilisant git :-

git clone https://github.com/ParthJadhav/Tkinter-Designer.git

Changez votre répertoire de travail en Tkinter Designer.

cd Tkinter-Designer

Installez les dépendances nécessaires en exécutant pip install -r requirements.txt
- Si pip ne fonctionne pas, essayez également les commandes suivantes :
  - pip3 install -r requirements.txt
  - python -m pip install -r requirements.txt
  - python3 -m pip install -r requirements.txt
- Si cela ne fonctionne toujours pas, assurez-vous que Python est ajouté au PATH.

Cela installera toutes les exigences et Tkinter Designer. Avant d'utiliser Tkinter Designer, vous devez créer un fichier Figma avec les instructions ci-dessous.

Si vous avez déjà créé un fichier, passez à la section Utilisation de Tkinter Designer.

3. Créer un compte Figma

Dans un navigateur web, rendez-vous sur figma.com et cliquez sur 'Sign up'
Entrez vos informations, puis vérifiez votre email
Créez un nouveau fichier de design Figma
Commencez à créer votre interface graphique
- La section suivante couvre le formatage requis pour l'entrée de Tkinter Designer.

Formater votre design Figma [[Haut](#Sommaire)]

1. Référence

L'importance du nom

Nom de l'élément Figma	Élément Tkinter
Button	Button
Line	Line
Rectangle	Rectangle
TextArea	Text Area
TextBox	Entry
Image	Canvas.Image()

Le code généré par Tkinter Designer est basé sur les noms des éléments de votre design Figma et, en tant que tel, vous devez nommer vos éléments en conséquence. Dans Figma, renommez vos éléments en double-cliquant dessus dans le panneau Calques.

2. Guide des éléments

Tout d'abord, créez une Frame qui servira de fenêtre Tkinter.
Ajout d'images
- Les images peuvent être créées à l'aide de formes et/ou d'images
- Si vous utilisez plusieurs formes/images, vous devez les regrouper en les sélectionnant toutes et en appuyant sur CTRL/⌘ + G
- Après cela, nommez l'élément ou le groupe comme "Image".
Texte (Texte normal)
- Utilisez la touche T pour activer l'outil texte, puis ajoutez du texte comme vous le souhaitez
- Le texte n'a pas besoin d'être renommé pour être utilisé dans Tkinter Designer
- Appuyez explicitement sur la touche Retour ou Entrée pour passer à la ligne suivante.
Entrée de texte (Entrée utilisateur sur une seule ligne)
- Activez l'outil Rectangle avec R
- Ajustez le rectangle à votre convenance
- Assurez-vous que le rectangle est nommé "TextBox"
Zone de texte (Entrée utilisateur sur plusieurs lignes)
- Activez l'outil Rectangle avec R
- Ajustez le rectangle à votre convenance
- Assurez-vous que le rectangle est nommé "TextArea"
Rectangle
- Activez l'outil Rectangle avec R
- Ajustez le rectangle à votre convenance
- Assurez-vous que le rectangle est nommé "Rectangle"
Bouton normal
- Ajouter un rectangle pour servir de bouton dans votre interface graphique
  - Facultatif : ajoutez du texte au bouton
- Sélectionnez le bouton (Rectangle) et tout texte facultatif, puis regroupez-les avec CTRL/⌘ + G
- Nommez le groupe "Button"

Référez vous à [cette vidéo](https://youtu.be/Qd-jJjduWeQ) si vous rencontrez tout problème

Bouton arrondi
- Ajouter un rectangle pour servir de bouton dans votre interface graphique
  - Facultatif : ajoutez du texte au bouton
- Arrondissez-le en ajoutant un rayon d'angle en sélectionnant le rectangle et en ajoutant un rayon d'angle à partir du côté droit. En savoir plus
- Créez un rectangle avec la même taille de votre bouton. Ne l'arrondissez pas.
- Changez la couleur du rectangle pour qu'elle corresponde à l'arrière-plan
- Déplacez maintenant le rectangle nouvellement créé sous le bouton principal (Rectangle).
- Sélectionnez le bouton (Rectangle) et tout texte facultatif, puis regroupez-les avec CTRL/⌘ + G
- Nommez le groupe "Button"

Référez vous à [cette vidéo](https://youtu.be/Qd-jJjduWeQ) si vous rencontrez tout problème

Utiliser Tkinter Designer [[Haut](#sommaire)]

Ouvrez Tkinter Designer avant de suivre les étapes suivantes

1. Clé d'accès personnelle

Connectez-vous à votre compte Figma
Accédez à Paramètres
Dans l'onglet Compte, faites défiler jusqu'à Personnal access tokens
Saisissez le nom de votre clé d'accès dans le formulaire de saisie et appuyez sur Entrée
Votre clé d'accès personnelle sera créé.
- Copiez cette clé et conservez-la dans un endroit sûr.
- Vous n'aurez pas d'autre chance de copier cette clé.
Collez votre clé d'accès personnelle dans le formulaire Token ID dans Tkinter Designer

2. URL du fichier

Dans votre fichier de conception Figma, cliquez sur le bouton Partager dans la barre supérieure, puis cliquez sur 🔗 Copier le lien
Collez le lien dans la zone File URL au sein de Tkinter Designer

Utilisation de l'interface de ligne de commande

L'utilisation de la CLI est aussi simple que l'installation du package et l'exécution de l'outil CLI.

Vous pouvez utiliser la commande ci-dessous comme test en remplaçant $YOUR_FIGMA_TOKEN par votre token d'accès personnel Figma généré. Si vous n'avez pas le jeton, reportez-vous à la Section des entrées requises .

bash

# Exemple de données
$ python -m tkdesigner.cli https://www.figma.com/file/WVLnulVsI177tvnxSdqOUZ/Untitled?node-id=0%3A1 $YOUR_FIGMA_TOKEN -f
# Pour en savoir plus sur l'utilisation de la cli, passez l'indicateur --help
$ python -m tkdesigner.cli --help

Par défaut, le code GUI sera écrit dans build/gui.py.
Pour exécuter l'interface graphique générée, cd dans le répertoire dans lequel vous l'avez construit (par exemple build/) et exécutez-le comme vous le feriez avec n'importe quelle interface graphique Tkinter.

bash

cd build
python3 gui.py

Utilisation de l'interface graphique

Ouvrez TKinter Designer en

text

cd Tkinter-Designer
interface graphique cd
python3 gui.py

Collez votre jeton d'accès personnel dans le formulaire ID de jeton dans Tkinter Designer
Collez le lien dans le formulaire URL du fichier dans Tkinter Designer
Cliquez sur le formulaire Chemin de sortie pour ouvrir un navigateur de fichiers
Choisissez un chemin de sortie et cliquez sur Sélectionner un dossier
Appuyez sur Générer

Les fichiers de sortie de Tkinter Designer seront placés dans le répertoire de votre choix, dans un nouveau dossier appelé build. Félicitations, vous avez maintenant créé votre interface graphique Tkinter à l'aide de Tkinter Designer !

Diagnostic des anomalies [[Haut](#sommaire)]

Éléments non visibles ? Mal placés ?
- Veuillez vous assurer que votre fichier Figma a ses éléments nommés correctement. * Voir Formater votre dessin Figma, §1
Le bouton a un arrière-plan gris non désiré ?
- Assurez-vous que vous avez ajouté un rectangle derrière votre élément de bouton et que sa couleur de remplissage est la même que celle de l'arrière-plan
Éléments incorrects ?
- Assurez-vous d'avoir nommé correctement vos éléments dans Figma
  - Se référer à Formater votre design Figma, §1
La fenêtre est plus grande que l'écran ?
- Réduisez la taille de vos éléments dans Figma
Les fichiers ne se génèrent pas ?
- Redémarrez Tkinter Designer
- Vérifiez la clé d'API et l'URL
- Assurez-vous que votre design a une Frame
Autre chose ?
- Signalez des problèmes non répertoriés ici sur GitHub

Instructions.Gu GU (`docs/instructions.gu-GU.md`)

How to use Tkinter Designer

અનુક્રમણિકા

પ્રારંભ કરી રહ્યા છીએ
1. પાયથોન ઇન્સ્ટોલ કરો
2. ટીકીટર ડિઝાઇનર ઇન્સ્ટોલ કરો
3. ફિગ્મા એકાઉન્ટ બનાવો
તમારી ફિગ્મા ડિઝાઇન ફોર્મેટિંગ
1. સંદર્ભ
2. એલિમેન્ટ ગાઇડ
ટિંકટર ડિઝાઇનરનો ઉપયોગ કરીને
1. વ્યક્તિગત પ્રવેશ ટોકન
2. ફાઇલ URL
3. તમારા જનરેટેડ કોડની કસોટી કરો
મુશ્કેલીનિવારણ

પ્રારંભ [[અનુક્રમણિકા]](#અનુક્રમણિકા)

1. પાયથોન ઇન્સ્ટોલ કરો

ટિંકટર ડિઝાઇનરનો ઉપયોગ કરતા પહેલા, તમારે પાયથોન ઇન્સ્ટોલ કરવાની જરૂર છે.

અહીં Python ડાઉનલોડ્સ Page ની એક લિંક છે.
વિવિધ operating સિસ્ટમો પર પાયથોન install કરવા માટે અહીં સહાયક માર્ગદર્શિકા છે.
પછી આ માર્ગદર્શિકામાં, તમે Python(pip) માટે પેકેજ ઇન્સ્ટોલરનો ઉપયોગ કરશો, જેના માટે તમારે તમારી સિસ્ટમ પાથમાં પાયથોન ઉમેરવાની જરૂર પડી શકે છે. *

2. ટિંકટર ડિઝાઇનર ઇન્સ્ટોલ કરો

એકવાર તમે પાયથોન ઇન્સ્ટોલ કર્યા પછી, તમે Tkinter ડિઝાઇનર Official Repository પરથી ડાઉનલોડ કરી શકો છો.

જમણી બાજુની સાઇડબારમાં, નવીનતમ પ્રકાશનને ક્લિક કરો અને Assets હેઠળ, tkinter_designer.exe પસંદ કરો. એક્ઝેક્યુટેબલ ડાઉનલોડ થયા પછી, તમે પ્રોગ્રામ ચલાવવા માટે તૈયાર છો!

સ્રોત કોડમાંથી ટિંક્ટર ડિઝાઇનર ચલાવવા માટે, નીચે આપેલા સૂચનોને અનુસરો.

સ્રોત ફાઇલોને ટિંકટર ડિઝાઇનર માટે જાતે ડાઉનલોડ કરીને અથવા ઉપયોગ કરીને ડાઉનલોડ કરો git :-

git clone https://github.com/ParthJadhav/Tkinter-Designer.git

તમારી કાર્યકારી ડિરેક્ટરીને ટીકીટર ડિઝાઇનર પર બદલો

cd Tkinter-Designer

ચલાવીને જરૂરી પરાધીનતા સ્થાપિત કરો

pip install -r requirements.txt ચલાવીને આવશ્યક અવલંબન સ્થાપિત કરો

જે સ્થિતિમાં PIP કામ કરતું નથી, નીચેના આદેશો પણ અજમાવો:
- pip3 install -r requirements.txt
- python -m pip install -r requirements.txt
- python3 -m pip install -r requirements.txt
જો આ હજી પણ કામ કરતું નથી, તો ખાતરી કરો કે પાયથોન PATH માં ઉમેરવામાં આવ્યો છે.

આ બધી આવશ્યકતાઓ અને ટિંકટર ડિઝાઇનર ઇન્સ્ટોલ કરશે. તમે ટિંકટર ડિઝાઇનરનો ઉપયોગ કરો તે પહેલાં તમારે નીચેની સૂચનાઓ સાથે ફિગ્મા ફાઇલ બનાવવાની જરૂર છે.

જો તમે પહેલેથી જ ફાઇલ બનાવી છે, તો પછી [** ટીકીટર ડિઝાઇનરનો ઉપયોગ કરીને **] (# ઉપયોગ કરીને-ટિંકિટર-ડિઝાઇનર) વિભાગ પર જાઓ.

3. ફિગ્મા એકાઉન્ટ બનાવો

વેબ બ્રાઉઝરમાં, figma.com પર નેવિગેટ કરો અને 'સાઇન અપ' ક્લિક કરો.
તમારી માહિતી દાખલ કરો, પછી તમારું ઇમેઇલ ચકાસો
નવી ફિગ્મા ડિઝાઇન ફાઇલ બનાવો
તમારી જીયુઆઈ બનાવવાનું પ્રારંભ કરો
- આગલા વિભાગમાં ટિંકટર ડિઝાઇનર ઇનપુટ માટે આવશ્યક ફોર્મેટિંગ આવરી લે છે.

તમારી ફિગ્મા ડિઝાઇનને ફોર્મેટ કરી રહ્યું છે

1. સંદર્ભ

નામકરણ મહત્વપૂર્ણ છે

ફિગ્મા Element નામ	Tkinter
Button	Button
Line	Line
Rectangle	Rectangle
TextArea	Text Area
TextBox	Entry
Image	Canvas.Image()

Tkinter ડિઝાઇનર દ્વારા જનરેટ થયેલ કોડ તમારી ફિગ્મા ડિઝાઇનના તત્વોના નામ પર આધારિત છે અને, જેમ કે, તમારે તે મુજબ તમારા તત્વોનું નામ લેવાની જરૂર છે. ફિગ્મામાં, તમારા તત્વોને સ્તર પેનલમાં ડબલ-ક્લિક કરીને નામ બદલો.

2. એલિમેન્ટ માર્ગદર્શિકા

પ્રથમ, એક ફ્રેમ બનાવો જે તમારી ટિંકટર વિંડો તરીકે કામ કરશે.
છબીઓ ઉમેરવી
- છબીઓ આકાર અને / અથવા છબીઓનો ઉપયોગ કરીને બનાવી શકાય છે
- જો તમે બહુવિધ આકારો / છબીઓનો ઉપયોગ કરો છો, તો તમારે બધાને પસંદ કરીને અને CTRL / & # 8984 ને દબાવવાથી તેમને એક સાથે જૂથ બનાવવું જોઈએ; + G
- તે નામ પછી તત્વ અથવા જૂથને "છબી" તરીકે નામ આપો.

*. ટેક્સ્ટ (સામાન્ય ટેક્સ્ટ)

ટેક્સ્ટ ટૂલને સક્રિય કરવા માટે T કીનો ઉપયોગ કરો, પછી ઇચ્છિત લખાણ ઉમેરો
ટિંકટર ડિઝાઇનરના ઉપયોગ માટે ટેક્સ્ટનું નામ બદલવું જરૂરી નથી
આગલી લાઇન પર જવા માટે સ્પષ્ટ રીતે Return અથવા Enter કી દબાવો.
એન્ટ્રી (સિંગલ લાઇન યુઝર ઇનપુટ)
- R સાથે લંબચોરસ ટૂલને સક્રિય કરો
- તમારી પસંદગી પ્રમાણે લંબચોરસને સમાયોજિત કરો
- ખાતરી કરો કે લંબચોરસનું નામ "TextBox" છે
ટેક્સ્ટ ક્ષેત્ર (મલ્ટિ-લાઇન યુઝર ઇનપુટ)
- R સાથે લંબચોરસ ટૂલને સક્રિય કરો
- તમારી પસંદગી પ્રમાણે લંબચોરસને સમાયોજિત કરો
- ખાતરી કરો કે લંબચોરસનું નામ "TextArea" છે

લંબચોરસ
R સાથે લંબચોરસ ટૂલને સક્રિય કરો
- તમારી રુચિ પ્રમાણે લંબચોરસને સમાયોજિત કરો
- ખાતરી કરો કે લંબચોરસનું નામ "Rectangle" રાખવામાં આવ્યું છે
સામાન્ય બટન
- તમારા GUI માં બટન તરીકે સેવા આપવા માટે લંબચોરસ ઉમેરો
  - વૈકલ્પિક: બટન માટે ટેક્સ્ટ ઉમેરો
- બટન (લંબચોરસ) અને કોઈપણ લખાણ, પસંદ કરો પછી તેને Ctrl/⌘ + G સાથે જૂથ બનાવો
- જૂથનું નામ "Button"

જો તમને કોઈ મુશ્કેલીનો સામનો કરવો પડે તો [આ વિડિઓ](https://youtu.be/Qd-jJjduWeQ) નો સંદર્ભ લો

ગોળાકાર બટન
- તમારા GUI માં બટન તરીકે સેવા આપવા માટે લંબચોરસ ઉમેરો
  - વૈકલ્પિક: બટન માટે ટેક્સ્ટ ઉમેરો
- લંબચોરસ પસંદ કરીને અને ખૂણે ત્રિજ્યાને જમણી બાજુથી ઉમેરીને તેને ગોળાકાર બનાવો. તેના પર વધુ વાંચો
- તમારા બટનના સમાન કદ સાથે એક લંબચોરસ બનાવો. તેને ગોળાકાર ન બનાવો.
  પૃષ્ઠભૂમિ સાથે મેળ કરવા માટે લંબચોરસનો રંગ બદલો
- હવે નવા બનાવેલા લંબચોરસને મુખ્ય બટન (લંબચોરસ) ની નીચે ખસેડો.
- બટન, લંબચોરસ અને કોઈપણ વૈકલ્પિક ટેક્સ્ટ પસંદ કરો, પછી તેમને Ctrl / ⌘ + G સાથે જૂથ બનાવો
- જૂથનું નામ "Button"

જો તમને કોઈ મુશ્કેલીનો સામનો કરવો પડે તો [આ વિડિઓ](https://youtu.be/Qd-jJjduWeQ) નો સંદર્ભ લો

ટિંકિટર ડિઝાઇનરને નીચેના પગલાઓ કરતા પહેલા ખોલો

1. પર્સનલ એક્સેસ ટોકન

તમારા ફિગ્મા એકાઉન્ટમાં લ .ગ ઇન કરો
સેટિંગ્સ પર નેવિગેટ કરો
The. એકાઉન્ટ ટ tabબમાં, વ્યક્તિગત પ્રવેશ ટોકન્સ પર નીચે સ્ક્રોલ કરો
The. પ્રવેશ ફોર્મમાં તમારી toક્સેસ ટોકનનું નામ દાખલ કરો અને Enter દબાવો
તમારી Personal Access Token બનાવવામાં આવશે.
- આ ટોકન Copy કરો અને તેને ક્યાંક સુરક્ષિત રાખો.
- તમને આ ટોકન copy કરવાની બીજી તક નહીં મળે.
તમારી Private Access Token Tkinter ડિઝાઇનરમાં Token Id ફોર્મમાં પેસ્ટ કરો

2. ફાઇલ URL

તમારી ફિગ્મા ડિઝાઇન ફાઇલમાં, ટોચની પટ્ટીમાં Share બટનને ક્લિક કરો, પછી 🔗 પર ક્લિક કરો; link Copy કરો
Tkinter ડિઝાઇનરમાં File URL ફોર્મમાં લિંક પેસ્ટ કરો

ની મદદથી CLI

CLI નો ઉપયોગ એ પેકેજ ઇન્સ્ટોલ કરવા અને CLI ટૂલ ચલાવવા જેટલું સરળ છે.

તમે પેદા ફિગ્મા પર્સનલ Accessક્સેસ ટોકન દ્વારા $ YOUR_FIGMA_TOKEN ને બદલીને તમે પરીક્ષણ તરીકે નીચેનો આદેશ વાપરી શકો છો.

bash

# Example data
$ python -m tkdesigner.cli https://www.figma.com/file/WVLnulVsI177tvnxSdqOUZ/Untitled?node-id=0%3A1 $YOUR_FIGMA_TOKEN -f

# ક્લાઈટનો ઉપયોગ કેવી રીતે કરવો તે વિશે વધુ જાણવા માટે --help ફ્લેગ પસાર કરો

python -m tkdesigner.cli --help

ડિફ defaultલ્ટ રૂપે, GUI કોડ build / gui.py પર લખવામાં આવશે.
જનરેટ કરેલી GUI, સીડી ચલાવવા માટે તમે તેને બનાવેલ ડિરેક્ટરીમાં (દા.ત. build / -) બનાવો અને તમે ચલાવો તે જ રીતે ચલાવો-ટિંકટર GUI.

bash

cd build
$ python3 gui.py

GUI નો ઉપયોગ કરીને

દ્વારા "Tkinter Designer GUI" ખોલો

text

cd Tkinter-Designer
cd gui
python3 gui.py

તમારી Personal Access Token ટીકીટર ડિઝાઇનરમાં Token ID ફોર્મમાં પેસ્ટ કરો
ટિંકિટર ડિઝાઇનરમાં File URL ફોર્મમાં લિંક પેસ્ટ કરો
ફાઇલ બ્રાઉઝર ખોલવા માટે Select Path ફોર્મને ક્લિક કરો
આઉટપુટ પાથ પસંદ કરો અને ફોલ્ડર પસંદ કરો ક્લિક કરો.
દબાવો Generate

ટિંકટર ડિઝાઇનરની આઉટપુટ ફાઇલો તમારી પસંદ કરેલી ડિરેક્ટરીમાં build નામના નવા ફોલ્ડરમાં મૂકવામાં આવશે. અભિનંદન, તમે હવે Tkinter ડીઝાઈનરનો ઉપયોગ કરીને તમારું Tkinter GUI બનાવ્યું છે!

મુશ્કેલીનિવારણ

તત્વો દૃશ્યમાન નથી? ખોટી રીતે?
- કૃપા કરીને ખાતરી કરો કે તમારી ફિગ્મા ફાઇલમાં તે તત્વો યોગ્ય નામવાળી છે.
બટનની અકારણ ગ્રે પૃષ્ઠભૂમિ છે?
- ખાતરી કરો કે તમે તમારા બટન તત્વની પાછળ એક લંબચોરસ ઉમેર્યો છે, અને તેનો ભરો રંગ પૃષ્ઠભૂમિ જેવો જ છે
ખોટા તત્વો?
- ખાતરી કરો કે તમે ફિગ્મામાં તમારા તત્વોનું નામ યોગ્ય રાખ્યું છે
  - જુઓ તમારી ફિગ્મા ડિઝાઇન ફોર્મેટિંગ, અને સંપ્રદાય; 1
વિંડો સ્ક્રીન કરતા મોટી છે?
- ફિગ્મામાં તમારા તત્વોનું કદ ઘટાડવું
ફાઇલો ઉત્પન્ન થતી નથી?
ટિંકટર ડિઝાઇનરને ફરીથી પ્રારંભ કરો
- Token અને URL ને બે વાર તપાસો
- ખાતરી કરો કે તમારી ડિઝાઇનમાં ફ્રેમ છે
કંઈક બીજું?
- અહીં GitHub પર સૂચિબદ્ધ નથી તેવા મુદ્દાઓની જાણ કરો

Instructions.It IT (`docs/instructions.it-IT.md`)

Come usare Tkinter Designer

Traduzioni

Indice dei contenuti

Introduzione
Formattare il Design di Figma
1. Riferimento
2. Guida sugli elementi
Utilizza Tkinter Designer
Risoluzione dei problemi

Introduzione [[Top](#indice-dei-contenuti)]

1. Installa Python

Prima di utilizzare Tkinter Designer, devi installare Python.

In questa guida dovrai utilizzare il Package Installer for Python (pip), il quale potrebbe richiedere di essere aggiunto alla PATH di sistema.

2. Installa Tkinter Designer

Tre opzioni:

Utilizza il comando pip install tkdesigner;
Tramite poetry
- poetry new <gui_project_name> && cd <gui_project_name>
- poetry add tkdesigner
- poetry install
Per eseguire i comandi sopra riportati è necessario aver installato poetry.
Per eseguire Tkinter Designer dal codice sorgente, segui le seguenti istruzioni.
1. Scarica manualmente i file dal codice sorgente di Tkinter Designer by downloading o utilizza GIT.
  
  git clone https://github.com/ParthJadhav/Tkinter-Designer.git
2. Spostati nella directory di Tkinter Designer.
  
  cd Tkinter-Designer
3. Installa le dipendenze necessarie tramite i seguenti comandi:
  - pip install -r requirements.txt
    - Se pip non dovesse funzionare, puoi provare ad utilizzare i seguenti comandi:
    - pip3 install -r requirements.txt
    - python -m pip install -r requirements.txt
    - python3 -m pip install -r requirements.txt
    - Se non dovesse comunque funzionare, assicurati di aver aggiunto Python alla PATH di sistema.
Questo installerà Tkinter Designer e le sue dipendenze. Per poter utilizzare Tkinter Designer devi creare un file di Figma seguendo le istruzioni.

Qualora avessi già creato il file puoi recarti nella sezione Utilizza Tkinter Designer.

3. Crea un account Figma

In un web brwoser, vai su figma.com e clicca su 'Sign up';
Inserisci le tue informazioni, e verifica il tuo indirizzo mail;
Crea un nuovo File di Design Figma;
Inizia a disegnare la tua interfaccia.
- Di seguito delle fonti utili:

Formatta il tuo Design Figma [[Top](#indice-dei-contenuti)]

1. Riferimento

La denominazione è importante

Nome elemento Figma	Elemento Tkinter
Button	Button
Line	Line
Text	Testo a scelta
Rectangle	Rectangle
TextArea	Text Area
TextBox	Entry
Image	Canvas.Image()

Il codice generato da Tkinter Designer è basato sui nomi degli elementi del Design Figma e, visto ciò, devi nominare gli elementi correttamente. In Figma, rinomina i elementi facendovi doppio click nel pannello Layers.

2. Guida sugli elementi

Per prima cosa, crea un Frame che fungerà come finestra di Tkinter.
Aggiungi immagini
- Le immagini possono essere importate o create mediante forme
- Se desideri utilizzare più forme/immagini, devi raggrupparle selezionandole e premendo i tasti CTRL/⌘ + G
- Dopodiché nomina l'elemento o il gruppo "Image"
Testo (Testo normale)
- Usa il tasto T per attivare lo strumento testo, quindi aggiungi il testo desiderato
- Il testo non deve essere rinominato per essere utilizzato in Tkinter Designer
- Premi il tasto Return o Enter per muoverti alla riga successiva
Input (Inserimento a linea singola)
- Attiva lo strumento rettangolo utilizzando il tasto R
- Ridimensiona l'elemento rettangolo a tuo piacimento
- Assicurati di rinominare l'elemento rettangolo "TextBox"
Area di testo (Inserimento a linea multipla)
- Attiva lo strumento rettangolo utilizzando il tasto R
- Ridimensiona l'elemento rettangolo a tuo piacimento
- Assicurati di rinominare l'elemento rettangolo "TextArea"
Rettangolo
- Attiva lo strumento rettangolo utilizzando il tasto R
- Ridimensiona l'elemento rettangolo a tuo piacimento
- Assicurati di rinominare l'elemento rettangolo "Rectangle"
Pulsante normale
- Aggiungi un rettangolo per farlo funzionare come pulsante
  - Facoltativo: Aggiungi un testo al tuo pulsante
- Seleziona il pulsante (Rettangolo), e l'eventuale testo, e raggruppali premendo i tasti CTRL/⌘ + G
- Rinomina il gruppo "Button"

Guarda [questo video](https://youtu.be/Qd-jJjduWeQ) se dovessi riscontrare problemi.

Pulsante rotondo
- Aggiungi un rettangolo per farlo funzionare come pulsante
  - Facoltativo: Aggiungi un testo al tuo pulsante
- Rendilo rotondo aggiungendo un raggio ai bordi. Scopri di più qui.
- Crea un elemento Rettangolo dalle stesse dimensioni del tuo pulsante. Non seguire il punto precedente (dunque non renderlo rotondo)
- Cambia il colore dell'elemento Rettangolo in modo da farlo combaciare con lo sfondo
- Ora posizionati sull'ultimo elemento Rettangolo creato (quello sottostante)
- Seleziona il pulsante (Rettangolo), e l'eventuale testo, e raggruppali premendo i tasti CTRL/⌘ + G
- Rinomina il gruppo "Button"

Guarda [questo video](https://youtu.be/Qd-jJjduWeQ) se dovessi riscontrare problemi.

Utilizza Tkinter Designer [[Top](#indice-dei-contenuti)]

Requisiti minimi

Ci sono alcuni requisiti minimi che devi soddisfare per poter utilizzare TKinter Designer.

1. Personal Access Token

Accedi a Figma
Vai nelle impostazioni
Nella scheda Account, scrolla fino a Personal access tokens
Inserisci il nome del tuo access token nel campo e premi Enter
Ora il tuo Personal Access Token è stato creato.
- Copia questo token e tienilo al sicuro.
- Non esiste alcuna procedura per recuperare questo codice.

2. Ottieni l'URL del file

Nel tuo file di Design Figma, clicca sul pulsante Share nella barra in alto, quindi clicca su 🔗 Copy link

Utilizzare la CLI

Per utilizzare la CLI è sufficiente installare il pacchetto ed avviarlo da riga di comando. Per installarlo segui una delle due prossime opzioni.

Tramite PyPi

Puoi usare il seguente comando sostituendo $FILE_URL & $FIGMA_TOKEN con i tuoi dati. Se non dovessi avere questi dati, segui la sezione Requisiti Minimi.

bash

pip install tkdesigner
tkdesigner $FILE_URL $FIGMA_TOKEN

Tramite sorgente

Per usare CLI puoi decidere di clonare il codice sorgente dalla repository e seguire le istruzioni di seguito.

Puoi usare il seguente comando sostituendo $FILE_URL & $FIGMA_TOKEN by your data. e non dovessi avere questi dati, segui la sezione Requisiti Minimi.

bash

$ python -m tkdesigner.cli $FILE_URL $FIGMA_TOKEN
# To learn more about how to use the cli, pass the --help flag
$ python -m tkdesigner --help

Output

Di base, il codice dell'interfaccia grafica wiene scritto nella directory build/gui.py. Puoi specificare un'altra directory utilizzando il flag -o seguito dalla path.

Per eseguire la GUI generata, spostarsi nella directory di output ed eseguire allo stesso modo in cui si esegue una GUI in Tkinter.

bash

cd build
python3 gui.py

Utilizzare la GUI

Apri Tkinter Designer prima di eseguire i seguenti passaggi

Apri TKinter Designer GUI eseguendo i seguenti comandi:

text

cd Tkinter-Designer
cd gui
python3 gui.py

Incolla il tuo personal access token nel form Token ID di Tkinter Designer
Incolla il tuo File URL nel form di Tkinter Designer
Clicca su Output Path per aprire il file browser
Scegli la cartella di destinazione e clicca su Select Folder
Clicca infine su Generate

I file di output di Tkinter Designer verranno salvati nella directory da te inserita, dentro una nuova cartella chiamata build. Congratulazioni, hai creato la tua GUI Tkinter grazie a Tkinter Designer!

Risoluzione dei problemi [[Top](#indice-dei-contenuti)]

Elementi non visibili? Fuori posto?
- Assicurati di aver rinominato correttamente gli elementi nel tuo file di Figma.
  Leggi Formatta il tuo Design Figma.
Il pulsante ha un indisiderato sfondo grigio?
- Assicurati di aver aggiunto un Rettangolo dietro al tuo elemento pulsante, e che il suo colore sia identico a quello di sfondo.
Elementi errati?
- Assicurati di aver rinominato correttamente gli elementi nel tuo file di Figma.
  Leggi Formatta il tuo Design Figma.
La finestra è più grande dello schermo?
- Riduci la dimensione degli elementi Figma.
Non si generano i file?
- Riavvia Tkinter Designer
- Controlla il tuo personal access token e l'URL del file
- Assicurati di aver predisposto un frame al tuo file di Figma
Qualcos'altro?
- Segnala i problemi non listati nella sezione Issues della repository

Instructions.Kr KR (`docs/instructions.kr-KR.md`)

Tkinter Designer 사용법

시작하기 [[Top](#)]

1. Python 설치하기

Tkinter Designer를 사용하기 전에 Python을 설치해야 합니다.

이 가이드의 뒷부분에서 Python용 Package Installer(pip)를 사용할 것이며, 이 경우 시스템 환경변수에 Python을 추가해야 할 수도 있습니다.

2. Tkinter Designer 설치하기

세 가지 옵션:

pip install tkdesigner
poetry 설치
- poetry new <gui_project_name> && cd <gui_project_name>
- poetry add tkdesigner
- poetry install
소스 코드에서 Tkinter Designer를 실행하려면 아래 지침을 따르십시오.
1. Tkinter Designer의 원본 파일을 수동으로 다운로드하거나 GIT를 사용하여 다운로드합니다.
  
  git clone https://github.com/ParthJadhav/Tkinter-Designer.git
2. 작업 디렉토리를 Tkinter Designer로 변경합니다.
  
  cd Tkinter-Designer
3. 다음을 실행하여 필요한 종속성을 설치합니다.
  - pip install -r requirements.txt
    - pip이 작동하지 않는 경우 다음 명령도 사용해 보십시오:
    - pip3 install -r requirements.txt
    - python -m pip install -r requirements.txt
    - python3 -m pip install -r requirements.txt
    - 그래도 작동하지 않으면 환경변수에 Python이 추가되었는지 확인합니다.
그러면 모든 요구 사항과 Tkinter Designer가 설치됩니다. Tkinter Designer를 사용하기 전에 아래 지침을 사용하여 Figma 파일을 만들어야 합니다.

파일을 이미 만든 경우 Tkinter Designer 사용하기 섹션으로 건너뜁니다.

3. Figma 계정 생성하기

웹 브라우저에서 figma.com 로 이동하여 '가입'을 클릭합니다.
정보를 입력한 다음 이메일 인증을 합니다.
새로운 Figma 파일을 만듭니다.
GUI 제작 시작
- 다음 섹션에서는 Tkinter Designer 입력에 필요한 형식에 대해 설명합니다.

Figma 가이드 [[Top](#목차)]

1. 레퍼런스

Naming이 중요합니다

Figma Element Name	Tkinter Element
Button	Button
Line	Line
Text	Name it anything
Rectangle	Rectangle
TextArea	Text Area
TextBox	Entry
Image	Canvas.Image()

Tkinter Designer에서 생성된 코드는 Figma 설계의 요소 이름을 기반으로 하므로 요소 이름을 적절하게 지정해야 합니다. Figma의 레이어 패널에서 요소를 두 번 클릭하여 이름을 바꿉니다.

2. 속성 가이드

먼저 Tkinter 창 역할을 할 프레임을 만듭니다.
Image
- 도형 및/또는 이미지를 사용하여 이미지를 생성할 수 있습니다.
- 여러 도형/이미지를 사용하는 경우 '모두 선택'을 눌러 그룹화해야 합니다 CTRL/⌘ + G
- 그런 다음 요소 또는 그룹의 이름을 "이미지"로 지정합니다.
Text (일반 텍스트)
- T 키를 눌러 텍스트 도구를 활성화한 다음 원하는 대로 텍스트 추가합니다.
- Tkinter Designer에서 사용하기 위해 텍스트 이름을 변경할 필요가 없습니다.
- 명시적으로 Return 또는 Enter 키를 눌러 다음 줄로 이동합니다.
Entry (사용자의 한 줄 입력)
- R을 사용하여 Rectangle 도구 활성화
- 원하는 대로 Rectangle 조정
- Rectangle의 이름이 "TextBox"인지 확인합니다
Text Area (사용자의 여러줄 입력)
- R을 사용하여 Rectangle 도구 활성화
- 원하는 대로 Rectangle 조정
- Rectangle의 이름이 "TextArea"인지 확인합니다
Rectangle
- R을 사용하여 Rectangle 도구 활성화
- 원하는 대로 Rectangle 조정
- Rectangle의 이름이 "Rectangle"인지 확인합니다
Normal Button
- GUI에서 button으로 사용할 rectangle 추가
  - 선택 사항: button에 대한 text 추가
- button(Rectangle)과 옵션으로 text를 선택한 다음 CTRL/⌘ + G로 그룹화합니다
- 그룹 이름을 "Button"으로 지정합니다
둥근 Button
- GUI에서 button으로 사용할 rectangle 추가
  - 선택 사항: button에 text 추가
- rectangle을 선택하고 오른쪽에서 모서리 반지름을 추가하여 모서리 반지름을 반올림합니다. 자세히 읽어보기
- button과 크기가 같은 Rectangle을 만듭니다. 동그랗게 만들지 마세요.
- 배경과 일치하도록 Rectangle 색상 변경
- 이제 새로 만든 Rectangle을 기본 button(Rectangle) 아래로 이동합니다.
- button, Rectangle및 optional text를 선택한 다음 CTRL/⌘ + G로 그룹화합니다
- 그룹 이름을 "Button"으로 지정합니다

문제가 발생하면 [유튜브](https://youtu.be/Qd-jJjduWeQ) 를 참조하십시오

Tkinter Designer 사용하기 [[Top](#목차)]

필수 입력 정보

TKinter Designer를 사용하려면 몇 가지 입력 정보를 수집해야 합니다.

1. 개인 액세스 토큰

Figma 계정에 로그인합니다
설정으로 이동
Account 탭에서 Personal access tokens으로 스크롤합니다
입력 양식에 액세스 토큰 이름을 입력하고 Enter 키를 누릅니다
개인 액세스 토큰이 생성됩니다.
- 이 토큰을 복사하여 안전한 곳에 보관하십시오.
- 이 토큰을 다시 복사할 수 없습니다.

2. File URL 얻기

Figma 디자인 파일에서 상단 바의 Share 버튼을 클릭한 다음 🔗 Copy link를 클릭합니다.

CLI로 실행하기

CLI를 사용하는 것은 패키지를 설치하고 CLI 도구를 실행하는 것만큼 간단합니다.

PyPi로 실행하기

$FILE_URL & $FIGMA_TOKEN을 데이터로 대체하여 아래 명령을 테스트로 사용할 수 있습니다. 토큰과 링크가 없으면 필수 입력 정보 Section을 참조하십시오.

bash

pip install tkdesigner

tkdesigner $FILE_URL $FIGMA_TOKEN

소스로 실행하기

소스 코드에서 CLI를 사용하려면 리포지토리를 복제한 다음 아래 지침을 따라야 합니다.

$FILE_URL & $FIGMA_TOKEN을 데이터로 대체하여 아래 명령을 테스트로 사용할 수 있습니다. 토큰과 링크가 없으면 필수 입력 정보 Section을 참조하십시오.

bash

$ python -m tkdesigner.cli $FILE_URL $FIGMA_TOKEN

# To learn more about how to use the cli, pass the --help flag
$ python -m tkdesigner --help

결과물

기본적으로 GUI 코드는 build/gui.py 에 기록됩니다. '-o' 플래그를 사용하고 경로를 제공하여 출력 경로를 지정할 수 있습니다.

생성된 GUI를 실행하려면 빌드한 디렉토리(예: build/)에 들어가 Tkinter GUI와 마찬가지로 실행합니다.

bash

cd build
python3 gui.py

GUI로 실행하기

다음 단계를 수행하기 전에 Tkinter Designer 실행시키기

다음 명령어를 통해 TKinter Designer GUI를 실행합니다.

text

cd Tkinter-Designer
cd gui
python3 gui.py

Tkinter Designer의 Token ID에 personal access token를 추가합니다.
Tkinter Designer의 File URL에 Figma링크를 추가합니다.
Output Path 를 통해 저장될 위치를 누릅니다.
생성 경로를 선택하고 다음을 누릅니다. Select Folder
Generate를 누릅니다.

Tkinter Designer의 출력 파일은 선택한 디렉토리의 build라는 새 폴더 안에 배치됩니다. 축하합니다. 이제 Tkinter Designer를 사용하여 Tkinter GUI를 만들었습니다!

문제해결 [[Top](#목차)]

요소가 보이지 않습니까?
- Figma 파일의 요소 이름이 올바른지 확인하십시오 * See Figma 가이드, §1
버튼에 의도하지 않은 회색 배경이 있습니까?
- 버튼 요소 뒤에 직사각형을 추가했는지 확인하고 채우기 색이 배경의 색과 동일한지 확인합니다.
잘못된 요소?
- Figma에서 요소의 이름을 올바르게 지정했는지 확인합니다.
  - See Figma 가이드, §1
창이 화면보다 큽니까?
- Figma에서 요소의 크기를 줄이세요.
파일이 생성되지 않습니까?
- Tkinter Designer 다시 시작합니다.
- 토큰과 URL을 더블체크합니다.
- 디자인에 프레임이 있는지 확인합니다.
다른 문제가 있습니까?
- Report issues not listed here on GitHub

Instructions (`docs/instructions.md`)

How to use Tkinter Designer

Translations

Getting Started
Formatting Your Figma Design
1. Reference
2. Element Guide
Using Tkinter Designer
Troubleshooting

Getting Started [[Top](#table-of-contents)]

1. Install Python

Before using Tkinter Designer, you'll need to install Python.

Tkinter Designer supports Python 3.9 and newer.

Later in this guide, you will use the Package Installer for Python (pip), which may require you to add Python to your system PATH.

2. Install Tkinter Designer

Three options:

pip install tkdesigner
Install Poetry
- poetry new <gui_project_name> && cd <gui_project_name>
- poetry add tkdesigner
- poetry install
To run Tkinter Designer from the source code, follow the instructions below.
1. Download the source files for Tkinter Designer by downloading it manually or using GIT.
  
  git clone https://github.com/ParthJadhav/Tkinter-Designer.git
2. Change your working directory to Tkinter Designer.
  
  cd Tkinter-Designer
3. Install the necessary dependencies by running
  - pip install -r requirements.txt
    - In the event that pip doesn't work, also try the following commands:
    - pip3 install -r requirements.txt
    - python -m pip install -r requirements.txt
    - python3 -m pip install -r requirements.txt
    - If this still doesn't work, ensure that Python is added to the PATH.
This will install all requirements and Tkinter Designer. Before you use Tkinter Designer you need to create a Figma File with the below instructions.

If you already have created a file then skip to Using Tkinter Designer Section.

Docker users can build and run the CLI with:

bash

docker build -t tkdesigner .
docker run --rm -v "$PWD:/work" tkdesigner "$FILE_URL" "$FIGMA_TOKEN" -o /work

3. Make a Figma Account

In a web browser, navigate to figma.com and click 'Sign up'
Enter your information, then verify your email
Create a new Figma Design file
Get started making your GUI
- The next section covers required formatting for Tkinter Designer input.

Formatting Your Figma Design [[Top](#table-of-contents)]

1. Reference

Naming is Important

Figma Element Name	Tkinter Element
Button	Button
Line	Line
Text	Name it anything
Rectangle	Rectangle
TextArea	Text Area
TextBox	Entry
Image	Canvas.Image()
ButtonHover (EXPERIMENTAL)	Button shown on hover
CheckButton or CheckBox	Checkbutton
RadioButton or Radio	Radiobutton
ComboBox	ttk.Combobox
ListBox	Listbox
Toggle or ToggleButton	Toggle-style Checkbutton
Table	ttk.Treeview table
TabView, Tabs, or Notebook	ttk.Notebook tab view

The code generated by Tkinter Designer is based on the names of elements from your Figma design and, as such, you need to name your elements accordingly. In Figma, rename your elements by double-clicking them in the Layers panel.

If an element is not one of the native Tkinter elements above, Tkinter Designer now attempts to export it as an image instead of replacing it with a black rectangle. This helps preserve vectors, smoothed corners, icons, and grouped artwork.

2. Element Guide

First, create a Frame that will serve as your Tkinter Window.
Adding Images
- Images can be created using shapes and/or images
- If you use multiple shapes/images, you must group them together by selecting them all and pressing CTRL/⌘ + G
- After that name the element or group as "Image".
Text (Normal Text)
- Use the T key to activate the text tool, then add text as desired
- Text does not have to be renamed for use in Tkinter Designer
- Explicitly press the Return Or Enter Key to move to the next line.
Entry (Single-Line User Input)
- Activate the Rectangle tool with R
- Adjust the Rectangle to your liking
- Make sure the Rectangle is named "TextBox"
Text Area (Multi-Line User Input)
- Activate the Rectangle tool with R
- Adjust the Rectangle to your liking
- Make sure the Rectangle is named "TextArea"
Rectangle
- Activate the Rectangle tool with R
- Adjust the Rectangle to your liking
- Make sure the Rectangle is named "Rectangle"
Normal Button
- Add rectangle to serve as a button in your GUI
  - Optional: Add text for the button
- Select the button(Rectangle), and any optional text, then group them with CTRL/⌘ + G
- Name the group "Button"

Refer to [this video](https://youtu.be/Qd-jJjduWeQ) if you face any problem

Rounded Button
- Add rectangle to serve as a button in your GUI
  - Optional: Add text for the button
- Make it rounded by adding corner radius by selecting the rectangle and adding corner radius from the right side. Read more on it
- Create a Rectangle with same size of your button. Don't make it rounded.
- Change the Rectangle's color to match the Background
- Now move the newly created rectangle below the main button(Rectangle).
- Select the button, Rectangle, and any optional text, then group them with CTRL/⌘ + G
- Name the group "Button"

Refer to [this video](https://youtu.be/Qd-jJjduWeQ) if you face any problem

Button with Hover Effect (EXPERIMENTAL)
- Duplicate the Button you created in the previous step
  - You can duplicate the Button by selecting the button group and pressing CTRL/⌘ + D
- Rename the duplicate button to "ButtonHover"
- Place the duplicate button above the original button
- Make sure it's on the same position as the original button
  - x and y coordinates should be the same
- Make changes to the duplicate button for the hover effect
  - For example, change the color

Refer to [this video](https://watch.screencastify.com/v/saDGrNayjwSmxbFbShB1) if you face any problem

Using Tkinter Designer [[Top](#table-of-contents)]

Required Inputs

There are some inputs you'll need to collect to be able to use the TKinter Designer.

1. Personal Access Token

Log into your Figma account
Navigate to Settings
In the Account tab, scroll down to Personal access tokens
Enter the name of your access token in the entry form and press Enter
Your personal access token will be created.
- Copy this token and keep it somewhere safe.
- You will not get another chance to copy this token.

2. Getting your File URL

In your Figma design file, click the Share button in the top bar, then click on 🔗 Copy link

Tip: If you want to generate only one specific frame, select that frame before copying the link. Tkinter Designer will use the node-id in the Figma URL when it is present.

Using the CLI

Using the CLI is as simple as installing the package and running the CLI tool.

From PyPi

You can use the below command as test by replacing $FILE_URL & $FIGMA_TOKEN by your data. If you haven't got the token and link then refer to Required Inputs Section.

bash

pip install tkdesigner

tkdesigner $FILE_URL $FIGMA_TOKEN

Wrap the Figma URL in quotes when pasting the literal URL into a shell:

bash

tkdesigner "https://www.figma.com/design/FILE_KEY/Name?node-id=1-2&t=..." "$FIGMA_TOKEN"

If you do not want to place the token directly in the command, set it in FIGMA_TOKEN and pass only the URL:

bash

FIGMA_TOKEN="your-token" tkdesigner "$FILE_URL"

To generate a class-based Tkinter app instead of a top-level script, add --template class:

bash

tkdesigner --template class $FILE_URL $FIGMA_TOKEN

To generate a single app with Back/Next navigation across multiple Figma frames, use --template pages:

bash

tkdesigner --template pages $FILE_URL $FIGMA_TOKEN

To apply a ttk theme in the generated app, pass --theme with a theme name available in your Tk installation:

bash

tkdesigner --theme clam $FILE_URL $FIGMA_TOKEN

From Source

To use CLI from the source code you need to clone the repository and then follow the below instructions.

You can use the below command as test by replacing $FILE_URL & $FIGMA_TOKEN by your data. If you haven't got the token and link then refer to Required Inputs Section.

bash

$ python -m tkdesigner.cli $FILE_URL $FIGMA_TOKEN

# To learn more about how to use the cli, pass the --help flag
$ python -m tkdesigner --help

Output

By default, the GUI code will be written to build/gui.py. You can specify the output path by using -o Flag and providing the path.

To run the generated GUI, cd into the directory you built it to (e.g. build/) and run it just as you would any Tkinter GUI.

bash

cd build
python3 gui.py

You can also import build/gui.py from another Python file to attach your own commands without editing generated code. The generated script only starts mainloop() when it is run directly.

Using the GUI

Open Tkinter Designer before doing the following steps

Open TKinter Designer GUI by

text

cd Tkinter-Designer
cd gui
python3 gui.py

Paste your personal access token into the Token ID form in Tkinter Designer
Paste the link into the File URL form in Tkinter Designer
Click the Output Path form to open a file browser
Choose an output path and click Select Folder
Press Generate

The output files from Tkinter Designer will be placed in your chosen directory, inside a new folder called build. Congratulations, you have now created your Tkinter GUI using Tkinter Designer!

Troubleshooting [[Top](#table-of-contents)]

Elements not visible? Misplaced?
- Please make sure that your Figma File has its elements named correctly. * See Formatting Your Figma Design, §1
Button has an unintended gray background?
- Make sure you have added a Rectangle behind your button element, and that its Fill color is the same as the Background's
Incorrect elements?
- Make sure you have named your elements correctly in Figma
  - See Formatting Your Figma Design, §1
Window is larger than the screen?
- Reduce the size of your elements in Figma
Files not generating?
- Restart Tkinter Designer
- Double-check the token and URL
- Quote the Figma URL if you run the CLI from a shell
- Add -f if you want to clear and regenerate an existing non-empty build directory
- If you see a Figma API quota or rate-limit message, wait for your Figma quota to reset or use a token with available quota
- Make sure your design has a Frame
- If your file has many frames, select the target frame in Figma before copying the URL
Fonts look different?
- Tkinter can only use fonts installed on the computer running the generated app
- Tkinter Designer writes the Figma font family into generated text widgets, but each user's OS may fall back if that font is unavailable
Something else?
- Report issues not listed here on GitHub

Instructions.Pt BR (`docs/instructions.pt-BR.md`)

Como usar o Tkinter Designer

Índice

Comece por aqui
Formatando seu design Figma
1. Referência
2. Guia de elementos
Usando o Tkinter Designer
Solução de problemas

Começando [[Top](#table-of-contents)]

1. Instalando Python

Antes de usar o Tkinter Designer, você precisará instalar o Python.

Mais adiante neste guia, você usará o Package Installer for Python (pip), que pode exigir que você adicione o Python ao PATH do seu sistema.

2. Instalando Tkinter Designer

Três opções:

pip install tkdesigner
Instale poetry
- poetry new <gui_project_name> && cd <gui_project_name>
- poetry add tkdesigner
- poetry install
Para executar o Tkinter Designer a partir do código-fonte, siga as instruções abaixo.
1. Baixe os arquivos de origem do Tkinter Designer, você pode baixar manualmente ou usar o GIT.
  
  git clone https://github.com/ParthJadhav/Tkinter-Designer.git
2. Altere seu diretório de trabalho para Tkinter Designer.
  
  cd tkinter-designer
3. Instale as dependências necessárias executando
  - pip install -r requirements.txt
    - No evento do pip não funcionar, tente também os seguintes comandos:
    - pip3 install -r requirements.txt
    - python -m pip install -r requirements.txt
    - python3 -m pip install -r requirements.txt
    - Se ainda assim não funcionar, se certifique de que o Python está adicionado ao PATH.
Isso instalará todos os requisitos e o Tkinter Designer. Antes de usar o Tkinter Designer, você precisa criar um arquivo Figma com as instruções abaixo.

Se você já criou um arquivo, pule para Usando o Tkinter Designer.

3. Faça uma conta no Figma

Em um navegador da Web, navegue até figma.com e clique em 'Sign up'
Insira suas informações e, em seguida, verifique seu e-mail
Crie um novo arquivo Figma Design
Comece a fazer sua GUI
- A próxima seção abrange a formatação necessária para a entrada do Tkinter Designer.

Formatando seu design Figma [[Top](#table-of-contents)]

1. Referência

Nomear é importante

Nome do Elemento no Figma	Elemento no Tkinter
Button	Button
Text	Qualquer nome
Rectangle	Rectangle
Line	Line
TextArea	Text Area
TextBox	Entry
Image	Canvas.Image()

O código gerado pelo Tkinter Designer é baseado nos nomes dos elementos do seu design Figma e, como tal, você precisa nomear seus elementos de acordo. No Figma, renomeie seus elementos clicando duas vezes neles no painel Camadas.

2. Guia de elementos

Primeiro, crie um Frame que servirá como sua janela Tkinter.
Adicionando imagens
- As imagens podem ser criadas usando formatos e/ou imagens
- Se você usar vários formatos/imagens, você selecionar todos e pressionar CTRL/⌘ + G
- Depois disso nomeie o elemento ou grupo como "Image".
Texto (Texto normal)
- Use o atalho T para ativar a ferramenta de texto e, em seguida, adicione o texto conforme desejado
- O texto não precisa ser renomeado para uso no Tkinter Designer
- Para pular linhas pressione Return ou Enter
Entrada de texto (Uma linha para entrada do usuario)
- Pressione R para habilitar a ferramenta Retângulo
- Ajuste o retângulo ao seu gosto
- Renomeio o retângulo para "TextBox"
Entrada de texto (Entrada de usuário de várias linhas)
- Pressione R para habilitar a ferramenta Retângulo
- Ajuste o retângulo ao seu gosto
- Renomeio o retângulo para "TextArea"
Retângulo
- Pressione R para habilitar a ferramenta Retângulo
- Ajuste o retângulo ao seu gosto
- Renomeio o retângulo para "Rectangle"
Botão normal
- Adicione um retângulo para servir como um botão em sua GUI
  - Opcional: adicione texto para o botão
- Selecione o botão (Retângulo) e qualquer texto opcional e agrupe-os com CTRL/⌘ + G
- Nomeie o grupo "Button"

Consulte [este vídeo](https://youtu.be/Qd-jJjduWeQ) se tiver algum problema

Botão arredondado
- Adicione um retângulo para servir como um botão em sua GUI
  - Opcional: adicione texto para o botão
- Para fazer o arredondamento no botão modifique o raio (´Corner radius´) Leia mais sobre isso
- Crie um retângulo com o mesmo tamanho do seu botão. Não o torne arredondado.
- Altere a cor do retângulo para corresponder ao plano de fundo
- Agora mova o retângulo recém-criado abaixo do botão principal (Retângulo).
- Selecione o botão, Retângulo e qualquer texto opcional e, em seguida, agrupe-os com CTRL/⌘ + G
- Nomeie o grupo "Button"

Consulte [este vídeo](https://youtu.be/Qd-jJjduWeQ) se tiver algum problema

Usando o Tkinter Designer [[Top](#table-of-contents)]

Entradas Necessárias

Existem algumas entradas que você precisará coletar para poder usar o TKinter Designer.

1. Token de acesso pessoal

Faça login na sua conta Figma
Navegue até Configurações
Na guia Account role para baixo até Personal access tokens
Digite o nome do seu token de acesso no formulário de entrada e pressione Enter
Seu token de acesso pessoal será criado.
- Copie este token e mantenha-o em algum lugar seguro.
- Você não terá outra chance de copiar este token.

2. Obtendo o URL do seu arquivo

Em seu arquivo de design Figma, clique no Share botão na barra superior, em seguida, clique em 🔗 Copy link

Usando a CLI

Usar a CLI é tão simples quanto instalar o pacote e executar a ferramenta CLI.

De PyPi

Você pode usar o comando abaixo como teste substituindo $FILE_URL & $FIGMA_TOKEN Se você não tiver o token e o link, consulte a Seção de Entradas Requeridas.

bash

pip install tkdesigner

tkdesigner $FILE_URL $FIGMA_TOKEN

Da fonte

Para usar a CLI a partir do código-fonte, você precisa clonar o repositório e seguir as instruções abaixo.

Você pode usar o comando abaixo como teste substituindo $FILE_URL & $FIGMA_TOKEN por seus dados. Se você não tiver o token e o link, consulte a Seção de Entradas Requeridas.

bash

$ python -m tkdesigner.cli $FILE_URL $FIGMA_TOKEN

# To learn more about how to use the cli, pass the --help flag
$ python -m tkdesigner --help

Saída

Por padrão, o código GUI será escrito em build/gui.py. Você pode especificar o caminho de saída usando o sinalizador -o e fornecendo o caminho.

Para executar a GUI gerada, cd no diretório em que você a construiu (por exemplo, build/) e execute-a como faria com qualquer GUI do Tkinter.

bash

cd build
python3 gui.py

Usando a GUI

Abra o Tkinter Designer antes de executar as etapas a seguir

Abra a GUI do TKinter Designer por

text

cd Tkinter-Designer
cd gui
python3 gui.py

Cole seu token de acesso pessoal no formulário Token ID no Tkinter Designer
Cole o link no formulário URL do arquivo no Tkinter Designer
Clique no formulário Output Path para abrir um navegador de arquivos
Escolha um caminho de saída e clique em Select Folder
Pressione Generate

Os arquivos de saída do Tkinter Designer serão colocados no diretório escolhido, dentro de uma nova pasta chamada build. Parabéns, você agora criou sua GUI do Tkinter usando o Tkinter Designer!

Solução de problemas [[Top](#table-of-contents)]

Elementos não visíveis? Extraviado?
- Certifique-se de que seu arquivo Figma tenha seus elementos nomeados corretamente. * Consulte Formatando o design do Figma, §1
O botão tem um fundo cinza não intencional?
- Certifique-se de ter adicionado um retângulo atrás do elemento do botão e que sua cor de preenchimento seja a mesma do plano de fundo
Elementos incorretos?
- Certifique-se de ter nomeado seus elementos corretamente no Figma
  - Consulte Formatando o design do Figma, §1
A janela é maior que a tela?
- Reduza o tamanho de seus elementos no Figma
Arquivos não estão gerando?
- Reinicie o Tkinter Designer
- Verifique novamente o token e o URL
- Certifique-se de que seu design tenha um quadro
Algo mais?
- Relatar problemas não listados aqui no GitHub

Instructions.Ru RU (`docs/instructions.ru-RU.md`)

Начало работы [[Наверх](#Оглавление)]

1. Установите Python

Перед использованием Tkinter Designer вам необходимо установить Python.

Далее в этом руководстве вы будете использовать установщик пакетов для Python (pip), который может потребовать от вас добавить Python в PATH вашей системы.

2. Установите Tkinter Designer

Три варианта:

pip install tkdesigner
Установите poetry
- poetry new <gui_project_name> && cd <gui_project_name>
- poetry add tkdesigner
- poetry install
Чтобы запустить Tkinter Designer из исходного кода, следуйте инструкциям ниже.
1. Загрузите исходные файлы для Tkinter Designer, загрузив их вручную или с помощью GIT.
  
  git clone https://github.com/ParthJadhav/Tkinter-Designer.git
2. Измените рабочий каталог на Tkinter Designer.
  
  cd Tkinter-Designer
3. Установите необходимые зависимости, запустив
  - pip install -r requirements.txt
    - В случае, если pip не работает, попробуйте также следующие команды:
    - pip3 install -r requirements.txt
    - python -m pip install -r requirements.txt
    - python3 -m pip install -r requirements.txt
    - Если это по-прежнему не работает, убедитесь, что Python добавлен в PATH.
При этом будут установлены все зависимости и Tkinter Designer. Прежде чем использовать Tkinter Designer, вам необходимо создать файл Figma, следуя инструкциям ниже.

Если вы уже создали файл, перейдите к разделу Использование Tkinter Designer.

3. Создайте учетную запись Figma

В веб-браузере перейдите на figma.com и нажмите «Зарегистрироваться».
Введите свою информацию, затем подтвердите свой адрес электронной почты.
Создайте новый файл дизайна Figma.
Начните создавать графический интерфейс:
- В следующем разделе описано необходимое форматирование входных данных Tkinter Designer.

Форматирование дизайна Figma [[Наверх](#Оглавление)]

1. Референс

Имена важны!

Имя элемента Figma	Tkinter элемент
Button	Button
Line	Line
Text	Name it anything
Rectangle	Rectangle
TextArea	Text Area
TextBox	Entry
Image	Canvas.Image()

Код, сгенерированный Tkinter Designer, основан на именах элементов вашего дизайна Figma, и поэтому вам необходимо соответствующим образом называть свои элементы. В Figma переименуйте свои элементы, дважды щелкнув на них на панели «Layers».

2. Руководство по элементам

Сначала создайте Frame, который будет служить вашим окном Tkinter.
Добавление изображений
- Изображения могут быть созданы с использованием фигур и/или изображений.
- Если вы используете несколько фигур/изображений, вам необходимо сгруппировать их, выделив их все и нажав CTRL/⌘ + G
- После этого назовите элемент или группу «Image».
Text (обычный текст)
- Используйте клавишу T, чтобы активировать текстовый инструмент, затем добавьте текст по желанию.
- Текст не нужно переименовывать для использования в Tkinter Designer.
- Нажмите клавишу Return или Enter, чтобы перейти к следующей строке.
Entry (однострочный пользовательский ввод)
- Активируйте инструмент «Прямоугольник» с помощью R.
- Отрегулируйте прямоугольник по своему вкусу.
- Убедитесь, что прямоугольник называется «TextBox».
Text Area (многострочный пользовательский ввод)
- Активируйте инструмент «Прямоугольник» с помощью R.
- Отрегулируйте прямоугольник по своему вкусу.
- Убедитесь, что прямоугольник назван «TextArea».
Прямоугольник
- Активируйте инструмент «Прямоугольник» с помощью R.
- Отрегулируйте прямоугольник по своему вкусу.
- Убедитесь, что прямоугольник назван «Rectangle».
Обычная кнопка
- Добавьте прямоугольник, который будет служить кнопкой в вашем графическом интерфейсе.
  - Необязательно: добавьте текст для кнопки.
- Выберите кнопку (прямоугольник) и любой дополнительный текст, затем сгруппируйте их с помощью CTRL/⌘ + G
- Назовите группу «Button».

Если у вас возникнут какие-либо проблемы, обратитесь к [этому видео](https://youtu.be/Qd-jJjduWeQ).

Скругленная кнопка
- Добавьте прямоугольник, который будет служить кнопкой в вашем графическом интерфейсе.
  - Необязательно: добавьте текст для кнопки.
- Сделайте его закругленным, добавив угловой радиус, выделив прямоугольник и добавив угловой радиус с правой стороны. Подробнее об этом
- Создайте прямоугольник того же размера, что и ваша кнопка. Не делайте его закругленным.
- Измените цвет прямоугольника, чтобы он соответствовал фону.
- Теперь переместите вновь созданный прямоугольник под главную кнопку (Прямоугольник).
- Выберите кнопку, прямоугольник и любой дополнительный текст, затем сгруппируйте их с помощью CTRL/⌘ + G
- Назовите группу «Button».

Если у вас возникнут какие-либо проблемы, обратитесь к [этому видео](https://youtu.be/Qd-jJjduWeQ).

Использование Tkinter Designer [[Наверх](#Оглавление)]

Необходимые входные данные

Чтобы использовать TKinter Designer, вам необходимо собрать некоторые данные.

1. Токен личного доступа

Войдите в свою учетную запись Figma.
Перейдите в «Settings» \ «Настройки».
На вкладке Account прокрутите вниз до пункта Personal access tokens.
Введите имя вашего токена доступа в форму ввода и нажмите Enter.
Будет создан ваш личный токен доступа.
- Скопируйте этот токен и сохраните его в безопасном месте.
- У вас больше не будет возможности скопировать этот токен.

2. Получение URL-адреса файла

В файле дизайна Figma нажмите кнопку Share на верхней панели, затем нажмите 🔗 Copy link

Использование интерфейса командной строки

Использовать CLI так же просто, как установить пакет и запустить инструмент CLI.

Из PyPi

Вы можете использовать приведенную ниже команду в качестве проверки, заменив $FILE_URL и $FIGMA_TOKEN своими данными. Если у вас нет токена и ссылки, обратитесь к Разделу «Необходимые входные данные».

bash

pip установить tkdesigner

tkdesigner $FILE_URL $FIGMA_TOKEN

Из исходников

Чтобы использовать CLI из исходного кода, вам необходимо клонировать репозиторий, а затем следовать инструкциям ниже.

bash

$ python -m tkdesigner.cli $FILE_URL $FIGMA_TOKEN

# Чтобы узнать больше о том, как использовать cli, передайте флаг --help
$ python -m tkdesigner --help

Выходные данные

По умолчанию код графического интерфейса будет записан в build/gui.py. Вы можете указать выходной путь, используя флаг «-o» и указав путь.

Чтобы запустить сгенерированный графический интерфейс, перейдите в каталог, в котором вы его создали (например, build/), и запустите его так же, как и любой графический интерфейс Tkinter.

bash

cd build
python3 gui.py

Использование графического интерфейса

Откройте Tkinter Designer, прежде чем выполнять следующие шаги.

Откройте графический интерфейс TKinter Designer с помощью

bash

cd Tkinter-Designer
cd gui
python3 gui.py

Вставьте свой персональный токен доступа в форму Token ID в Tkinter Designer.
Вставьте ссылку в форму File URL в Tkinter Designer.
Нажмите форму Output Path, чтобы открыть браузер файлов.
Выберите путь вывода и нажмите Select Folder.
Нажмите Generate.

Выходные файлы Tkinter Designer будут помещены в выбранный вами каталог внутри новой папки с именем build. Поздравляем, вы создали графический интерфейс Tkinter с помощью Tkinter Designer!

Устранение неполадок [[Наверх](#Оглавление)]

Элементы не видны? Находятся не на своём месте?
- Убедитесь, что в вашем файле Figma элементы названы правильно. * См. Форматирование дизайна Figma, §1.
Кнопка имеет незапланированный серый фон?
- Убедитесь, что вы добавили прямоугольник позади элемента кнопки и что его цвет заливки такой же, как у фона.
Неправильные элементы?
- Убедитесь, что вы правильно назвали свои элементы в Figma.
  - См. Форматирование дизайна Figma, §1.
Окно больше экрана?
- Уменьшите размер ваших элементов в Figma.
Файлы не генерируются?
- Перезапустите Tkinter Designer.
- Дважды проверьте токен и URL-адрес.
- Убедитесь, что в вашем дизайне есть Frame.
Что-то другое?
- Сообщить о проблемах, не перечисленных здесь на GitHub

Instructions.Spa SPA (`docs/instructions.spa-SPA.md`)

¿Cómo usar Tkinter Designer?

Traducciones

Tabla de contenidos

Comience por aquí
Dando formato a tu diseño de Figma
1. Referencia
2. Guía de Elementos
Usar Tkinter Designer
Solución de Problemas

Comenzando [[Top](#table-of-contents)]

1. Instalar Python

Antes de usar Tkinter Desinger, deberás instalar Python.

Más tarde en éste curso, usarás el Package Installer de Python (pip), el cual requiere que agregues Python al PATH de tu sistema

2. Instalar Tkinter Designer

Tres opciones:

pip install tkdesigner
Instalar poetry
- poetry new <gui_project_name> && cd <gui_project_name>
- poetry add tkdesigner
- poetry install
Para ejecutar Tkinter Designer desde el archivo fuente, sigue las siguientes instrucciones.
1. Descarga el archivo fuente, descargandolo manualmente o usando GIT.
  
  git clone https://github.com/ParthJadhav/Tkinter-Designer.git
2. Cambia tu directorio de trabajo a Tkinter Designer.
  
  cd Tkinter-Designer
3. Instala las dependencias necesarias ejecutando
  - pip install -r requirements.txt
    - En el caso que pip no funcione, también prueba con los siguientes comandos:
    - pip3 install -r requirements.txt
    - python -m pip install -r requirements.txt
    - python3 -m pip install -r requirements.txt
    - Si esto no funciona, asegurate de que Python está agregado al PATH.
Ésto instalará todos los requisitos y Tkinter Designer. Antes de usar Tkinter Designer, deberás crear un archivo de Figma siguiendo las siguientes instrucciones.

Si ya creaste un archivo Figma, puedes saltar a la sección Usar Tkinter Designer.

3. Crear una cuenta en Figma

En un navegador web, navega a figma.com y da click en 'Sign up'
Ingresa tu informacion y luego verifica tu email
Crea un nuevo archivo de diseño en Figma
Comienza a crear tu GUI
- Las siguientes secciones abarcan el formato necesario para el resultado en Tkinter Designer.

Dando formato a tu diseño de Figma [[Top](#table-of-contents)]

1. Referencias

El nombre es importante

Nombre de Elemento en Figma	Elemento en Tkinter
Button	Button
Line	Line
Text	Nómbralo como quieras
Rectangle	Rectangle
TextArea	Text Area
TextBox	Entry
Image	Canvas.Image()

El código generado por Tkinter Designer está basado en los nombres de los elementos de tu diseño en Figma, y como tal, necesitas nombrar tus elementos de acuerdo a lo establecido. En Figma, puedes renombrar tus elementos al dar doble click en ellos en el panel de Layers.

2. Guía de Elementos

Primero, crea un Frame que te servirá como tu ventana de Tkinter.
Añadir Imágenes
- Las imágenes pueden ser creadas usando formas y/o imágenes.
- Si usas multiples formas/imágenes, necesitarás agruparlos todos juntos, seleccionandolos y presionando CTRL/⌘ + G
- Después de eso, nombra el elemento o grupo como "Image".
Texto (Texto Normal)
- Usa la tecla T para activar la herramienta de texto, después añade texto que desees.
- El texto no tiene que ser renombrado para usar en Tkinter Designer.
- Explicitamente presiona las teclas Return o Enter para saltar a la siguiente línea.
Entry (Input de Usuario en una sóla línea)
- Activa la herramienta de Rectángulo con la letra R
- Ajusta el rectangulo a tu gusto
- Asegurate que el Rectángulo sea llamado "TextBox"
Area de Texto (Input de Usuario en múltiples líneas)
- Activa la herramienta de Rectángulo con la letra R
- Ajusta el rectangulo a tu gusto
- Asegurate que el Rectángulo sea llamado "TextArea"
Rectángulo
- Activa la herramienta de Rectángulo con la letra R
- Ajusta el rectangulo a tu gusto
- Asegurate que el Rectángulo sea llamado "Rectangle"
Botón Normal
- Añade un rectangulo para que funcione como un botón en tu GUI
  - Opcional: Añade texto para el botón.
- Selecciona el botón(Rectangle), y cualquier texto opcional, luego agrupalos con CTRL/⌘ + G
- Nombra el grupo "Button"

Dirigete a [Éste video](https://youtu.be/mFjE2-rbpm8?t=275) si te encuentras con cualquier problema

Botón circular
- Añade un rectangulo para que funcione como un botón en tu GUI
  - Opcional: Añade texto para el botón.
- Hazlo redondo al añadir un radio de esquinas, seleccionado el rectángulo y añadiendo un radio de esquinas desde el lado derecho. Lee más en
- Crea un rectángulo con el mismo tamaño que tu botón. No lo hagas redondeado.
- Cambia el color del rectángulo para combinarlo con el fondo
- Ahora, mueve el rectángulo más nuevo debajo del botón principal(Rectangle).
- Selecciona el botón, el rectángulo y cualquier texto adicional, luego agrupalos con CTRL/⌘ + G
- Nombra al grupo "Button"

Dirigete a [Éste video](https://youtu.be/mFjE2-rbpm8?t=275) si te encuentras con cualquier problema

Usar Tkinter Designer [[Top](#table-of-contents)]

Datos Requeridos

Hay algunos datos que necesitarás coleccionar para usar Tkinter Designer.

1. Token de Acceso Personal

Inicia sesión en tu cuenta de Figma
Dirígete a Configuración
En la pestaña de Account, deslíza hacía abajo hasta Personal Access Tokens
Ingresa el nombre de tu Token de Acceso Personal en el campo y presiona Enter
Tu Token de Acceso Personal será creada.
- Copia ésta Token y guárdala en algún lugar seguro.
- No tendrás otra chance de copiar ésta Token.

2. Obteniendo URL de tu archivo

En tu archivo de diseño de Figma, da click en el botón de Share en la barra superior, luego da click en 🔗 Copy Link

Usando el CLI

Usar el CLI es tan simple como instalar un pacquete y ejecutar la herramienta de CLI.

Desde PyPi

Puedes usar el siguiente comando como una prueba, reemplazando $FILE_URL & $FIGMA_TOKEN por tu información. Si todavía no haz conseguido el Token, dirígete a Datos Requeridos.

bash

pip install tkdesigner

tkdesigner $FILE_URL $FIGMA_TOKEN

Desde Archivo Fuente

Para usar CLI desde el archivo fuente, necesitas clonar el repositorio y luego seguir las siguientes instrucciones.

Puedes usar el siguiente comando como una prueba, reemplazando $FILE_URL & $FIGMA_TOKEN por tu información. Si todavía no haz conseguido el Token, dirígete a Datos Requeridos.

bash

$ python -m tkdesigner.cli $FILE_URL $FIGMA_TOKEN

# Para aprender más sobre cómo usar el CLI, pasa el Flag --help
$ python -m tkdesigner --help

Resultado

Por defecto, el código GUI será almacenado en build/gui.py. Puedes especificar la ruta al presionar la Flag -o y escribiendo la ruta.

Para ejecutar el GUI generado, haz un cd hasta el directorio que haz creado (en general: build/) y ejecutalo tal como lo hicieras con cualquier GUI de Tkinter.

bash

cd build
python3 gui.py

Usando el GUI

Abre Tkinter Desinger antes de realizar los siguientes pasos

Abre Tkinter Designer GUI de la siguiente forma

text

cd Tkinter-Designer
cd gui
python3 gui.py

Pega tu Token de Acceso Personal en el campo de Token ID en Tkinter Designer
Pega el link en el campo de File URL en Tkinter Designer
Da click en el campo de Output Path para abrir el buscador de archivos
Elige una ruta de destino y da click Select Folder
Presiona Generate

Los archivos generados por Tkinter Designer serán puestos en tu directorio de destino, dentro de una nueva carpeta llamada build. Felicitaciones, ahora has cread tu GUI de Tkinter usando Tkinter Designer!

Solución de Problemas [[Top](#table-of-contents)]

¿Los elementos no son visibles? ¿Están en un lugar equivocado?
- Por favor, asegurate que tu archivo Figma tiene los elementos nombrados correctamente. * Ve Dando formato a tu diseño de Figma, §1
¿El botón tiene un fondo gris no deseado?
- Asegurate que has añadido un rectángulo detras de tu elemento botón, y que éste sea del mismo color que el fondo
¿Elementos incorrectos?
- Asegurate que has nombrado tus elementos correctamente en Figma
  - Ve Dando formato a tu diseño de Figma, §1
¿La ventana es más grande que la pantalla?
- Reduce el tamaño de tus elementos en Figma
¿Los archivos no se generan?
- Reinicia Tkinter Designer
- Vuelve a checkear el URL y el Token Access
- Asegurate que tu diselo tiene un Frame
¿Algo más?
- Reportar problemas no mencionados aquí en GitHub

Instructions.Tr TR (`docs/instructions.tr-TR.md`)

Tkinter Designer Nasıl Kullanılır

İçindekiler

Başlarken
Figma Tasarımınızı Biçimlendirme
1. Referans
2. Element Kılavuzu
Tkinter Designer'ı Kullanma
Sorun Giderme

Başlarken [[Top](#table-of-contents)]

1. Python'u Kurun

Tkinter Designer'ı kullanmaya başlamadan önce Python'u kurmanız gerekmektedir.

Bu rehberden sonra Python'un paket yükleyicisi olan "pip"i kullanacaksınız, bu yüzden Python'u sistem yoluna eklemeniz gerekebilir.

2. Tkinter Designer'ı Yükleyin

Üç yol

pip install tkdesigner
Install poetry
- poetry new <gui_proje_ismi> && cd <gui_proje_ismi>
- poetry add tkdesigner
- poetry install
Tkinter Designer'ı kaynak kodundan çalıştırmak için aşağıdaki adımları izleyin.
1. Tkinter Designer'ın kaynak kodunu GIT kullanarak veya manuel olarak indirin.
  
  git clone https://github.com/ParthJadhav/Tkinter-Designer.git
2. Çalışma alanınızı Tkinter Designer olarak değiştirin.
  
  cd tkinter-designer
3. Bunları çalıştırarak gerekenleri indirin.
  - pip install -r requirements.txt
    - O an "pip" çalışmıyorsa şu komutları deneyin:
    - pip3 install -r requirements.txt
    - python -m pip install -r requirements.txt
    - python3 -m pip install -r requirements.txt
    - Eğer halen çalışmıyorsa Python'un sistem yoluna eklendiğinden emin olun.
Bu tüm gerekli şeyleri ve Tkinter Designer'ı kuracaktır. Tkinter Designer'ı kullanmadan önce aşağıdaki yönergeler ile bir Figma dosyası oluşturmanız gerekmektedir.

Eğer zaten oluşturduysanız Tkinter Designer'ı Kullanma kısmına atlayabilirsiniz.

3. Bir Figma Hesabı Oluşturma

Tarayıcınızdan figma.com adresine gidin ve "Üye Ol // Sign Up" tuşuna tıklayın.
Bilgilerinizi girin ardından email hesabınızı doğrulayın
Yeni bir Figma Tasarım Dosyası oluşturun
Arayüzünüzü yapmaya başlayın
- Sonraki bölüm, Tkinter Designer girişi için gerekli biçimlendirmeyi kapsar.

Figma Tasarımınızı Biçimlendirme [[Top](#table-of-contents)]

1. Referans

İsimlendirme Önemlidir

Figma Element İsmi	Tkinter Elementi
Button	Button
Line	Line
Rectangle	Rectangle
TextArea	Text Area
TextBox	Entry
Image	Canvas.Image()

Tkinter Designer'ın oluşturduğu kodlar Figma tasarımınızdaki element isimlerden gelir, bu yüzden isimlendirmeyi doğru yapmanız gerekir. Figma'da elementleri kontrol panelindeki katmanlar paneli aracılığıyla çift tıklayarak isimlendirebilirsiniz.

2. Element Kılavuzu

Öncelikle, Tkinter Penceresi olarak kullanacağınız bir "frame" oluşturun.
Resim Ekleme
- Resimler, şekiller ve resimler kullanılarak oluşturulabilir.
- Eğer birden fazla şekil veya resim kullandıysanız, önce hepsini seçip ardından CTRL/⌘ + G kısayolu ile gruplandırmanız gerekir.
- Bundan sonra elementi veya grubu "Image" olarak isimlendirin.
Yazı (Normal Yazı)
- T tuşunu kullanarak yazı aracını aktif edin. Ardından istediğiniz yazıyı girin
- Tkinter Designer'da yazının kullanımı için yeniden isimlendirilmesine gerek yoktur
- Return ya da Enter tuşuna basarak sonraki satıra ilerleyin.
Giriş (Tek Satır Kullanıcı Input'u)
- R tuşu ile Rectangle(Dikdörtgen) aracını aktive edin
- Diktörtgeni beğeninize göre ayarlayın
- Dikdörtgenin "TextBox" olarak adlandırıldığından emin olun
Yazı Alanı (Çoklu Kullanıcı Input)
- R tuşu ile Rectangle(Dikdörtgen) aracını aktive edin
- Diktörtgeni beğeninize göre ayarlayın
- Dikdörtgenin "TextArea" olarak adlandırıldığından emin olun
Dikdörtgen
- R tuşu ile Rectangle(Dikdörtgen) aracını aktive edin
- Diktörtgeni beğeninize göre ayarlayın
- Dikdörtgenin "Rectangle" olarak adlandırıldığından emin olun
Normal Buton
- Buton olarak kullanmak için bir rectangle(dikdörtgen) ekleyin
  - Opsiyonel: Buton için bir yazı ekleyin
- Butonu(Rectangle), ve herhangi bir yazıyı seçin, ardından onları CTRL/⌘ + G ile guruplayın
- Grubu "Button" olarak adlandırın

Herhangi bir problemde [bu videoyu](https://youtu.be/Qd-jJjduWeQ) referans alın

Köşeli Buton
- Buton olarak kullanmak için bir rectangle(dikdörtgen) ekleyin
  - Opsiyonel: Buton için bir yazı ekleyin
- Diktörtgene sağ taraftan kenar-yumuşatma ekleyerek kenarlarını yuvarlayın. Daha fazlasına ulaşın
- Butonunuz ile aynı boyutta bir diktörtgen oluşturun. Onu yuvarlatmayın.
- Dikdörtgeninizin rengini arkaplan ile eşleşmesi için değiştirin
- Şimdi yeni oluşturulan dikdörtgeni ana düğmenin(dikdörtgenin) altına taşıyın.
- Butonu, dikdörtgeni ve herhangi opsiyonel yazıyı seçin ve onları CTRL/⌘ + G ile gruplandırın
- Grubu "Button" olarak adlandırın.

Herhangi bir problemde [bu videoyu](https://youtu.be/Qd-jJjduWeQ) referans alın

Tkinter Designer'ı Kullanma [[Top](#table-of-contents)]

Gerekli Girdiler

TKinter Designer'ı kullanabilmek için bazı girdileri toplamanız gerekmektedir.

1. Kişisel Erişim Tokenı

Figma hesabınıza girin
Ayarlara gidin
Account sekmesinde, Personal access tokens kısmına kadar kaydırın
Giriş formu için erişim tokeninizin ismini girin ve Enter tuşuna basın
Kişisel erişim tokeniniz oluşturalacak.
- Bu tokeni kopyalayın ve güvenli bir yerde saklayın.
- Bu tokenı kopyalamak için başka şansınız olmayacak.

2. Dosya URL'nizi Elde Etme

Figma tasarım dosyanızda üst menüden Share butonuna, ardından 🔗 Copy link'e tıklayın

CLI'ı Kullanma

CLI'yı kullanmak paketi yüklemek ve CLI aracını çalıştırmak kadar kolaydır.

PyPi'den

Verilerinizle $FILE_URL & $FIGMA_TOKEN değiştirerek aşağıdaki komutu test olarak kullanabilirsiniz. Eğer linke ve tokena ulaşamadıysanız Gerekli Girdiler kısmına bakın.

bash

pip install tkdesigner

tkdesigner $FILE_URL $FIGMA_TOKEN

Kaynaktan

CLI'ı kaynak kodundan kullanmak için depoyu klonlamanız ve ardından aşağıdaki talimatları izlemeniz gerekir.

Verilerinizle $FILE_URL & $FIGMA_TOKEN değiştirerek aşağıdaki komutu test olarak kullanabilirsiniz. Eğer linke ve tokena ulaşamadıysanız Gerekli Girdiler kısmına bakın.

bash

$ python -m tkdesigner.cli $FILE_URL $FIGMA_TOKEN

# To learn more about how to use the cli, pass the --help flag
$ python -m tkdesigner --help

Çıktı

Varsayılan olarak GUI kodu build/gui.py dosyasına yazılacak. Çıktı yolunu -o ile değiştirebilirsiniz.

Oluşturulan GUI'yi çalıştırmak için GUI'yi oluşturduğunuz konuma gidin ve herhangi normal bir Tkinter GUI'si çalıştırır gibi çalıştırın.

bash

cd build
python3 gui.py

GUI'yi Kullanma

Sıradaki adımları yapmadan önce Tkinter Designer'ı açın

TKinter Designer GUI'sini aşağıdaki kod yardımıyla açın

text

cd Tkinter-Designer
cd gui
python3 gui.py

kişisel erişim tokenı'nı Tkinter Designer'daki Token ID kısmına yapıştırın.
Tkinter Designer'da linki File URL kısmına yapıştırın
Dosya gezgininden bir dosya açmak için Output Path'a tıklayın
Bir çıktı yolu seçin ve Select Folder'a basın
Generate'e tıklayın

Tkinter Designer'ın çıktı dosyaları, seçtiğiniz dizine, build adlı yeni bir klasöre yerleştirilecektir. Tebrikler, şimdi Tkinter GUI'nizi Tkinter Designer kullanarak oluşturdunuz!

Sorun Giderme [[Top](#table-of-contents)]

Elementler görünmüyor mu? Yanlış mı yerleştirilmiş?
- Lütfen Figma dosyasındaki elementlerin doğru isimlendirildiğinden emin olun. * See Formatting Your Figma Design, §1
Butonun istenmeyen bir gri arka planı mı var?
- Buton elementinizin arkasına dikdörtgen eklediğinizden ve dolgu renginin arka plan rengiyle aynı olduğundan emin olun.
Yanlış elementler?
- Figmada elementinizi doğru isimlendirdiğinizden emin olun
  - Şu kısma bakın: Figma Tasarımınızı Biçimlendirme, §1
Pencere ekranınızdan daha mı büyük?
- Figma'da elementlerinizin boyutunu düşürün
Dosya oluşturulmuyor mu?
- Tkinter Designer'ı yeniden başlatın
- Token'ı ve URL'yi iki kez kontrol edin
- Tasarımınızın bir Frame'e(çerçeve) sahip olduğundan emin olun
Başka bir şey?
- GitHub'da burda listelenmeyen sorunları bildirin

Instructions.Vi VN (`docs/instructions.vi-VN.md`)

Cách sử dụng Tkinter Designer

Các bản dịch

Mục lục

Bắt đầu
Cách định dạng thiết kế ở Figma
1. Tài liệu tham khảo
2. Hướng dẫn về các phần tử
Sử dụng Tkinter Designer
Khắc phục sự cố

Bắt đầu [[Top](#table-of-contents)]

1. Install Python

Trước khi sử dụng Tkinter Designer, bạn sẽ cần cài đặt Python.

*Trong hướng dẫn này, bạn sẽ sử dụng Trình cài đặt Gói cho Python (pip), điều này có thể đòi hỏi bạn phải thêm Python vào PATH của hệ thống.

2. Cài đặt Tkinter Designer

3 Phương Pháp:

Sử dụng câu lệnh pip install tkdesigner
Cài đặt poetry và sử dụng các câu lệnh:
- poetry new <gui_project_name> && cd <gui_project_name>
- poetry add tkdesigner
- poetry install
Chạy Tkinter Designer từ mã nguồn mở:
1. Tải xuống các tệp nguồn cho Tkinter Designer bằng cách tải xuống thủ công hoặc sử dụng GIT.
  
  git clone https://github.com/ParthJadhav/Tkinter-Designer.git
2. Thay đổi thư mục làm việc của bạn thành Tkinter Designer.
  
  cd Tkinter-Designer
3. Cài đặt các gói cần thiết.
  - pip install -r requirements.txt
    - Nếu pip không hoạt động, hãy thử các câu lệnh sau:
    - pip3 install -r requirements.txt
    - python -m pip install -r requirements.txt
    - python3 -m pip install -r requirements.txt
    - Nếu vẫn không hoạt động, hãy đảm bảo Python đã được thêm vào PATH.
Điều này sẽ cài đặt tất cả các yêu cầu và Tkinter Designer. Trước khi sử dụng Tkinter Designer, bạn cần tạo một tệp Figma với các hướng dẫn dưới đây.

Nếu bạn đã tạo một file, hãy đi tới phần Sử dụng Tkinter Designer.

3. Tạo tài khoản Figma

Truy cập figma.com và đăng kí
Nhập thông tin của bạn, sau đó xác minh email của bạnl
Tạo một file thiết kế Figma
Bắt đầu tạo GUI (Giao diện người dùng đồ họa)
- Phần tiếp theo sẽ đề cập đến định dạng cần thiết cho đầu vào Tkinter Designer.
- Đây là loạt bài hướng dẫn chính thức của Figma dành cho người mới bắt đầu.
- Đây là kênh YouTube chính thức của Figma.
- Đây là Trung tâm Trợ giúp của Figma.

Định dạng thiết kế ở Figma [[Top](#table-of-contents)]

1. Tham khảo

Cách đặt tên là một yếu tố vô cùng quan trọng

Tên phần tử trong Figma	Khi phần tử ở Tkinter
Button	Button
Line	Line
Text	Name it anything
Rectangle	Rectangle
TextArea	Text Area
TextBox	Entry
Image	Canvas.Image()

Mã được tạo ra bởi Tkinter Designer dựa trên tên các phần tử trong thiết kế Figma của bạn, và do đó, bạn cần đặt tên cho các phần tử của mình một cách phù hợp. Trong Figma, đổi tên các phần tử bằng cách nhấp đúp vào chúng trong bảng Layers.

2. Hướng dẫn về các phần tử

Trước tiên, tạo một khung chứa và đó sẽ là cửa sổ Tkinter của bạn.
Thêm ảnh
- IHình ảnh có thể được tạo bằng các hình dạng (shapes) và/hoặc hình ảnh (images)
- Nếu bạn sử dụng nhiều hình dạng/ảnh, bạn phải nhóm chúng lại bằng cách chọn tất cả và nhấn CTRL/⌘ + G
- Sau đó, đặt tên cho phần tử hoặc nhóm là "Image".
Văn bản (Văn bản bình thường)
- Sử dụng phím T để kích hoạt công cụ văn bản, sau đó thêm văn bản theo ý muốn
- Văn bản không cần được đổi tên để sử dụng trong Tkinter Designer
- Nhấn rõ nút Return hoặc Enter để chuyển xuống dòng tiếp theo.
Entry (Người dùng nhập trong 1 dòng)
- Kích hoạt công cụ Hình lập phương (rectangle) với R
- Điều chỉnh Hình lập phương (rectangle) theo ý thích của bạn
- Đảm bảo rằng Hình lập phương (rectangle) có tên là "TextBox"
Vùng văn bản (Người dùng nhập nhiều dòng)
- Kích hoạt công cụ Hình lập phương (rectangle) với R
- Điều chỉnh Hình lập phương (rectangle) theo ý thích của bạn
- Đảm bảo rằng Hình lập phương (rectangle) có tên là "TextArea"
Hình lập phương
- Kích hoạt công cụ Hình lập phương (rectangle) với R
- Điều chỉnh Hình lập phương (rectangle) theo ý thích của bạn
- Đảm bảo rằng Hình lập phương (rectangle) có tên là "Rectangle"
Nút thông thường
- Thêm một Hình lập phương để làm nút trong Giao diện người dùng đồ họa của bạn.
  - Tùy chọn: Thêm văn bản cho nút.
- Chọn nút (Hình lập phương vừa tạo) và văn bản, sau đó nhóm chúng với phím CTRL/⌘ + G
- Đặt tên cho nhóm là "Button"

Tham khảo [video này](https://youtu.be/Qd-jJjduWeQ) nếu bạn gặp phải vấn đề

Nút bo tròn
- Add rectangle to serve as a button in your GUI
- Thêm một Hình lập phương để làm nút trong Giao diện người dùng đồ họa của bạn.
  - Tùy chọn: Thêm văn bản cho nút.
    -Làm cho nút có hình dạng bo tròn bằng cách thêm bán kính góc bằng cách chọn Hình lập phương và thêm bán kính góc từ phía bên phải.Đọc thêm
- Tạo một Hình lập phương có cùng kích thước với nút của bạn. Không làm cho nó bo tròn.
- Thay đổi màu sắc của Hình lập phương để phù hợp với nền.
- Tiếp theo, di chuyển Hình lập phương vừa tạo xuống phía dưới nút chính (Hình lập phương).
- Chọn nút, Hình lập phương và văn bản tùy chọn (nếu có), sau đó nhóm chúng với phím CTRL/⌘ + G.
- Đặt tên cho nhóm là "Button".

Tham khảo [video này](https://youtu.be/Qd-jJjduWeQ) nếu bạn gặp phải vấn đề

Sử dụng Tkinter Designer [[Top](#table-of-contents)]

Các thông tin cần nhập

Có một số thông tin mà bạn sẽ cần thu thập để sử dụng Tkinter Designer.

1. Mã truy cập cá nhân

Đăng nhập vào tài khoản Figma của bạn.
Di chuyển đến Cài đặt.
Trong tab Tài khoản, cuộn xuống đến Mã truy cập cá nhân.
Nhập tên của mã truy cập cá nhân vào ô nhập và nhấn Enter.
Mã truy cập cá nhân của bạn sẽ được tạo.
- Sao chép mã truy cập này và lưu nó ở một nơi an toàn.
- Mã này sẽ chỉ xuất hiện một lần và không thể sao chép lại

2. Lấy địa chỉ của file

Trong tệp thiết kế Figma của bạn, nhấp vào nút Share ở thanh trên cùng, sau đó nhấp vào 🔗 Copy link

Sử dụng CLI

Sử dụng CLI rất đơn giản, chỉ cần cài đặt gói và chạy công cụ CLI.

Từ PyPi

Bạn có thể sử dụng lệnh dưới đây để kiểm tra bằng cách thay thế $FILE_URL và $FIGMA_TOKEN bằng dữ liệu của bạn. Nếu bạn chưa có mã thông báo và liên kết, vui lòng tham khảo phần Các thông tin cần nhập.

bash

pip install tkdesigner

tkdesigner $FILE_URL $FIGMA_TOKEN

Từ mã nguồn

Để sử dụng CLI từ mã nguồn, bạn cần sao chép kho mã và sau đó làm theo các hướng dẫn dưới đây.

bash

$ python -m tkdesigner.cli $FILE_URL $FIGMA_TOKEN

# To learn more about how to use the cli, pass the --help flag
$ python -m tkdesigner --help

Kết quả

Mặc định, mã GUI sẽ được ghi vào tệp build/gui.py. Bạn có thể chỉ định đường dẫn đầu ra bằng cách sử dụng cờ -o và cung cấp đường dẫn.

Để chạy GUI đã tạo, hãy di chuyển đến thư mục bạn đã xây dựng (ví dụ: build/) và chạy nó như bất kỳ GUI Tkinter nào khác.

bash

cd build
python3 gui.py

Sử dụng giao diện người dùng đồ họa (GUI)

Mở Tkinter Designer trước khi làm các bước sau

Mở giao diện người dùng Tkinter Designer bằng cách:

text

cd Tkinter-Designer
cd gui
python3 gui.py

Dán mã truy cập cá nhân của bạn vào ô Token ID trong Tkinter Designer.
Dán liên kết vào ô File URL trong Tkinter Designer.
Nhấp vào ô Output Path để mở trình duyệt tệp.
Chọn một đường dẫn đầu ra và nhấp vào Select Folder.
Nhấn Generate.

Các tệp kết quả từ Tkinter Designer sẽ được đặt trong thư mục đã chọn của bạn, trong một thư mục mới có tên là build. Chúc mừng bạn đã tạo thành công giao diện Tkinter của bạn bằng Tkinter Designer!

Gỡ lỗi [[Trở lại đầu trang](#table-of-contents)]

Các phần tử không hiển thị? Bị đặt sai vị trí?
- Vui lòng đảm bảo rằng tệp Figma của bạn đã đặt tên các phần tử của nó đúng cách. * Xem Định dạng thiết kế Figma của bạn, §1
Nút có màu nền xám không đúng ý?
- Hãy đảm bảo bạn đã thêm một hình chữ nhật phía sau phần tử nút của bạn và màu sắc Fill của nó giống với màu nền.
Các phần tử không chính xác?
- Hãy đảm bảo bạn đã đặt tên các phần tử của mình đúng cách trong Figma.
  - Xem Định dạng thiết kế Figma của bạn, §1
Cửa sổ lớn hơn màn hình?
- Giảm kích thước các phần tử trong Figma.
Không tạo ra các tệp?
- Khởi động lại Tkinter Designer.
- Kiểm tra lại mã thông báo và liên kết.
- Đảm bảo thiết kế của bạn có một khung (Frame).
Có vấn đề khác?
- Báo cáo vấn đề không được liệt kê tại đây trên GitHub

Instructions.Zh CN (`docs/instructions.zh-CN.md`)

如何使用 Tkinter Designer

入门 [[Top](#目录)]

1.安装Python

在使用 Tkinter Designer 之前，您需要安装 Python。

在本指南的后面部分，您将使用 Python 包安装程序 (pip)，这可能需要您将 Python 添加到系统 PATH 中。

2. 安装 Tkinter 设计器

安装 Python 后，您可以从官方存储库下载 Tkinter Designer。

在右侧边栏上，单击最新版本，然后在 Assets 下，选择 tkinter_designer.exe。下载完可执行文件后，您就可以运行程序了！

要从源代码运行 Tkinter Designer，请按照以下说明进行操作。

通过手动下载或使用 git 下载 Tkinter Designer 的源文件：-

git clone https://github.com/ParthJadhav/Tkinter-Designer.git
将您的工作目录更改为 Tkinter Designer。

cd Tkinter-Designer
通过运行安装必要的依赖项

pip install -r requirements.txt

安装必要的依赖项
- 如果 pip 不起作用，还可以尝试以下命令：
  - pip3 install -r requirements.txt
  - python -m pip install -r requirements.txt
  - python3 -m pip install -r requirements.txt
- 如果这仍然不起作用，请确保将 Python 添加到 PATH。
这将安装所有要求和 Tkinter Designer。在使用 Tkinter Designer 之前，您需要按照以下说明创建 Figma 文件。

如果您已经创建了文件，请跳至 Using Tkinter Designer 部分。

3. 创建一个 Figma 帐户

在网页浏览器中，导航至 figma.com 并点击“注册”
输入您的信息并验证您的电子邮件
创建一个新的 Figma Design 文件
开始制作你的 GUI
- 下一节介绍 Tkinter 设计器输入所需的格式。

格式化你的 Figma 设计[[Top](#目录)]

1. 参考

命名很重要

Figma 元素名称	Tkinter 元素
Button	Button
Line	Line
Rectangle	Rectangle
TextArea	Text Area
TextBox	Entry
Image	Canvas.Image()

Tkinter Designer 生成的代码基于 Figma 设计中的元素名称，因此，您需要相应地命名元素。在 Figma 中，通过在“图层”面板中双击元素来重命名元素。

2. 元素指南

首先，创建一个框架作为您的 Tkinter 窗口。
添加图片
- 可以使用形状和/或图像创建图像
- 如果您使用多个形状/图像，您必须通过选择它们并按 CTRL/⌘ 将它们组合在一起。 + G
- 在此之后将元素或组命名为“Image”。
文本（普通文本）
- 使用 T 键激活文本工具，然后根据需要添加文本
- 在 Tkinter Designer 中使用时不必重命名文本
- 明确按下 Return 或 Enter 键移动到下一行。
输入（单行用户输入）
- 使用 R 激活矩形工具
- 根据您的喜好调整矩形
- 确保矩形命名为“TextBox”
文本区域（多行用户输入）
- 使用 R 激活矩形工具
- 根据您的喜好调整矩形
- 确保矩形命名为“TextArea”
矩形
- 使用 R 激活矩形工具
- 根据您的喜好调整矩形
- 确保矩形被命名为“Rectangle”
按钮
- 添加一个元素作为 GUI 中的按钮
  - 可选：为按钮添加文本
- 在按钮下方的图层上创建一个矩形
- 更改矩形的颜色以匹配背景
- 选择按钮、矩形和任何可选文本，然后将它们与CTRL/⌘ + G
- 将组命名为“Button”

使用 Tkinter Designer [[Top](#目录)]

1. 个人访问令牌

登录您的 Figma 帐户
导航到设置
在 Account 选项卡中，向下滚动到 Personal access tokens
在条目表单中输入您的访问令牌的名称，然后按 Enter
您的个人访问令牌将被创建。
- 复制此令牌并将其保存在安全的地方。
- 您将不会再有机会复制此令牌。
将您的个人访问令牌粘贴到 Tkinter Designer 中的 Token ID 表单中

2. 文件地址

在您的 Figma 设计文件中，单击顶部栏中的 Share 按钮，然后单击 🔗 复制链接
将链接粘贴到 Tkinter Designer 中的 File URL 表单中

使用 CLI

使用 CLI 就像安装软件包和运行 CLI 工具一样简单。

您可以通过将 $YOUR_FIGMA_TOKEN 替换为您生成的 Figma Personal Access Token 来使用以下命令作为测试。如果您还没有获得令牌，请参阅 Required Inputs Section 。

bash

# 示例数据
$ python -m tkdesigner.cli https://www.figma.com/file/WVLnulVsI177tvnxSdqOUZ/Untitled?node-id=0%3A1 $YOUR_FIGMA_TOKEN -f
# 要了解有关如何使用 cli 的更多信息，请传递 --help 标志
$ python -m tkdesigner.cli --help

默认情况下，GUI 代码将写入 build/gui.py。
要运行生成的 GUI，请 cd 进入您构建它的目录（例如 build/）并像运行任何 Tkinter GUI 一样运行它。

bash

cd build
python3 gui.py

使用 GUI

1.打开TKinter Designer

text

cd Tkinter-Designer
cd gui
python3 gui.py

将您的 个人访问令牌 粘贴到 Tkinter Designer 中的 令牌 ID 表单中
将链接粘贴到 Tkinter Designer 中的 File URL 表单中
单击输出路径表单打开文件浏览器
选择一个输出路径并点击Select Folder
按生成

Tkinter Designer 的输出文件将放置在您选择的目录中，位于名为 build 的新文件夹中。恭喜，您现在已经使用 Tkinter Designer 创建了您的 Tkinter GUI！

故障排除 [[Top](#目录)]

元素不可见？放错地方了？
- 请确保您的 Figma 文件具有正确命名的元素。 * 请参阅格式化您的 Figma 设计，§1
按钮有意外的灰色背景？
- 确保您在按钮元素后面添加了一个矩形，并且其填充颜色与背景的相同
不正确的元素？
- 确保您在 Figma 中正确命名了元素
  - 请参阅格式化您的 Figma 设计，§1
窗口比屏幕大？
- 减少 Figma 中元素的大小
文件没有生成？
- 重启 Tkinter 设计器
- 仔细检查令牌和 URL
- 确保你的设计有一个框架
还有什么？
- 报告未在 GitHub 上列出的问题

--- METRICS ---

Files Extracted: 31
Estimated Token Budget: ~54068 tokens
Canonical Reference: https://codewiki.google/github.com/ParthJadhav/Tkinter-Designer

Docker & Self-Hosted Deployment Verified OCI

Technical Documentation: ParthJadhav/Tkinter-Designer

Overview (`README.md`) Copy Section

Translations Copy Chapter

💡 Introduction Copy Chapter

📢 Announcement Copy Chapter

🎉 Multi frame support is here! 🎉 Copy Section

☄️ Advantages of Tkinter Designer Copy Chapter

⚡️ Read the instruction here Copy Chapter

Requirements Copy Chapter

🦋 Supporting Tkinter Designer Copy Chapter

🔵 Discord server & Linkedin Copy Chapter

📐 How it Works Copy Chapter

🎯 Examples Copy Chapter

HotinGo [(More Info)](https://github.com/Just-Moh-it/HotinGo) Copy Section

CodTubify [(More Info)](https://github.com/iamDyeus/CodTubify) Copy Section

BeAnonymous [(More Info)](https://github.com/MambaCodes/BeAnonymous) Copy Section

Frame Recorder [(More Info)](https://github.com/mehmet-mert/FrameRecorder) Copy Section

WhatBulk [(More Info)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link) Copy Section

Atarbals-Modern-Antivirus [(More Info)](https://github.com/HarshscGithub/Atarbals-Modern-Antivirus) Copy Section

🔥 Showcase Copy Chapter

📄 License Copy Chapter

Contribute Copy Chapter

Author Copy Chapter

Overview (`tkdesigner/figma/README.md`) Copy Section

References Copy Chapter

CONTRIBUTING (`docs/CONTRIBUTING.md`) Copy Section

Welcome to Tkinter-Designer contributing guide

New contributor guide Copy Chapter

Getting started Copy Chapter

Create a new issue

Solve an issue

Make Changes Copy Section

Pull Request Copy Section

Your PR is merged Copy Section

README.Ar DZ (`docs/README.ar-DZ.md`) Copy Section

مقدمة Copy Chapter

☄️ مزايا Tkinter Designer Copy Chapter

⚡️ تثبيت واستعمال Tkinter Designer Copy Chapter

[إقرأ التعليمات](/docs/instructions.ar-DZ.md) Copy Section

🦋 دعم Tkinter Designer Copy Chapter

🔵 إنضم للDiscord server الرسمي لTkinter Designer Copy Chapter

📐 كيف يعمل Copy Chapter

🎯 أمثلة Copy Chapter

صفحة تسجيل Copy Section

صفحة علامة تجارية Copy Section

مسجل إطارات [(المزيد من المعلومات)](https://github.com/mehmet-mert/FrameRecorder) Copy Section

WhatBulk [(المزيد من المعلومات)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link) Copy Section

🔥 عرض Copy Chapter

📝 إتصل بي Copy Chapter

📄 الرخصة Copy Chapter

README.Ban BAN (`docs/README.ban-BAN.md`) Copy Section

💡 পরিচিতি Copy Chapter

📢 ঘোষণা Copy Chapter

🎉 মাল্টি ফ্রেম-এর সমর্থন এখানে! 🎉 Copy Section

☄️ টিকিন্টার ডিজাইনারের সুবিধা Copy Chapter

⚡️ এখানে নির্দেশ পড়ুন Copy Chapter

🦋 টিকিন্টার ডিজাইনার সমর্থনকারী Copy Chapter

🔵 ডিসকর্ড সার্ভার এবং লিঙ্কড-ইন Copy Chapter

📐 কিভাবে এটা কাজ করে Copy Chapter

🎯 উদাহরণ Copy Chapter

HotinGo [(অধিক তথ্য)](https://github.com/Just-Moh-it/HotinGo) Copy Section

CodTubify [(অধিক তথ্য)](https://github.com/iamDyeus/CodTubify) Copy Section

BeAnonymous [(অধিক তথ্য)](https://github.com/MambaCodes/BeAnonymous) Copy Section

Frame Recorder [(অধিক তথ্য)](https://github.com/mehmet-mert/FrameRecorder) Copy Section

WhatBulk [(অধিক তথ্য)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link) Copy Section

Atarbals-Modern-Antivirus [(অধিক তথ্য)](https://github.com/HarshscGithub/Atarbals-Modern-Antivirus) Copy Section

🔥 প্রদর্শনী Copy Chapter

📄 লাইসেন্স Copy Chapter

অবদান Copy Chapter

📝 আমার সাথে যোগাযোগ কর Copy Chapter

README.Fr FR (`docs/README.fr-FR.md`) Copy Section

💡 Introduction Copy Chapter

☄️ Avantages de Tkinter Designer Copy Chapter

⚡️ Installation et utilisation de Tkinter Designer Copy Chapter

[Lire les instructions](instructions.fr-FR.md) Copy Section

🦋 Soutenir Tkinter Designer Copy Chapter

📐 Comment ça marche Copy Chapter

🎯 Exemples Copy Chapter

Page d'inscription Copy Section

Overview (`README.md`)

Translations

💡 Introduction

📢 Announcement

🎉 Multi frame support is here! 🎉

☄️ Advantages of Tkinter Designer

⚡️ Read the instruction here

Requirements

🦋 Supporting Tkinter Designer

🔵 Discord server & Linkedin

📐 How it Works

🎯 Examples

HotinGo [(More Info)](https://github.com/Just-Moh-it/HotinGo)

CodTubify [(More Info)](https://github.com/iamDyeus/CodTubify)

BeAnonymous [(More Info)](https://github.com/MambaCodes/BeAnonymous)

Frame Recorder [(More Info)](https://github.com/mehmet-mert/FrameRecorder)

WhatBulk [(More Info)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link)

Atarbals-Modern-Antivirus [(More Info)](https://github.com/HarshscGithub/Atarbals-Modern-Antivirus)

🔥 Showcase

📄 License

Contribute

Author

Overview (`tkdesigner/figma/README.md`)

References

CONTRIBUTING (`docs/CONTRIBUTING.md`)

New contributor guide

Getting started

Make Changes

Pull Request

Your PR is merged

README.Ar DZ (`docs/README.ar-DZ.md`)

مقدمة

☄️ مزايا Tkinter Designer

⚡️ تثبيت واستعمال Tkinter Designer

[إقرأ التعليمات](/docs/instructions.ar-DZ.md)

🦋 دعم Tkinter Designer

🔵 إنضم للDiscord server الرسمي لTkinter Designer

📐 كيف يعمل

🎯 أمثلة

صفحة تسجيل

صفحة علامة تجارية

مسجل إطارات [(المزيد من المعلومات)](https://github.com/mehmet-mert/FrameRecorder)

WhatBulk [(المزيد من المعلومات)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link)

🔥 عرض

📝 إتصل بي

📄 الرخصة

README.Ban BAN (`docs/README.ban-BAN.md`)

💡 পরিচিতি

📢 ঘোষণা

🎉 মাল্টি ফ্রেম-এর সমর্থন এখানে! 🎉

☄️ টিকিন্টার ডিজাইনারের সুবিধা

⚡️ এখানে নির্দেশ পড়ুন

🦋 টিকিন্টার ডিজাইনার সমর্থনকারী

🔵 ডিসকর্ড সার্ভার এবং লিঙ্কড-ইন

📐 কিভাবে এটা কাজ করে

🎯 উদাহরণ

HotinGo [(অধিক তথ্য)](https://github.com/Just-Moh-it/HotinGo)

CodTubify [(অধিক তথ্য)](https://github.com/iamDyeus/CodTubify)

BeAnonymous [(অধিক তথ্য)](https://github.com/MambaCodes/BeAnonymous)

Frame Recorder [(অধিক তথ্য)](https://github.com/mehmet-mert/FrameRecorder)

WhatBulk [(অধিক তথ্য)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link)

Atarbals-Modern-Antivirus [(অধিক তথ্য)](https://github.com/HarshscGithub/Atarbals-Modern-Antivirus)

🔥 প্রদর্শনী

📄 লাইসেন্স

অবদান

📝 আমার সাথে যোগাযোগ কর

README.Fr FR (`docs/README.fr-FR.md`)

💡 Introduction

☄️ Avantages de Tkinter Designer

⚡️ Installation et utilisation de Tkinter Designer

[Lire les instructions](instructions.fr-FR.md)

🦋 Soutenir Tkinter Designer

📐 Comment ça marche

🎯 Exemples

Page d'inscription

Page de marque

Enregistreur d'images [(More Info)](https://github.com/mehmet-mert/FrameRecorder)

WhatBulk [(More Info)](https://www.instagram.com/p/CQUmKckFBbT/?utm_medium=copy_link)

🔥 Vitrine

📝 Me contacter