Tkinter-Designer README

The project's README from github.com/ParthJadhav/Tkinter-Designer. As one markdown file: README.md.

bloom-banner-01-light-tags-1500x500

logo

Tkinter Designer

Drag & Drop GUI Creator

Tkinter Designer - No-code solution for Python GUI's | Product Hunt


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.

Tkinter Designer GUI

📢 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

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

⚡️ Read the instruction here

View the YouTube video or read the instructions below.

Instructions Youtube Tutorial

Requirements

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

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.

tkdesigner "$FILE_URL" "$FIGMA_TOKEN"

To generate a class-based Tkinter app:

tkdesigner --template class $FILE_URL $FIGMA_TOKEN

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

tkdesigner --template pages $FILE_URL $FIGMA_TOKEN

Generated apps can also apply a ttk theme:

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.

Buy Me A Coffee Paypal

🔵 Discord server & Linkedin

Click the button below to join the discord server or Linkedin

Join Discord Server Connect on 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.

How it Works

🎯 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)

Example 3

CodTubify (More Info)

Example 3

BeAnonymous (More Info)

Example 1

Frame Recorder (More Info)

Example 3

WhatBulk (More Info)

Example 3

Atarbals-Modern-Antivirus (More Info)

Example 3

🔥 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 Linkedin

Author

Created by Parth Jadhav.

Tkinter-Designer (ParthJadhav/Tkinter-Designer)

Searching Database…

Что это такое?Tkinter Designer — это инструмент, который превращает макеты из Figma в работающие GUI на Python Tkinter: он читает ваш файл с дизайном через Figma API и генерирует весь код и картинки, которые нужны для интерфейса.
То есть я рисую интерфейс в Figma, а он сам пишет код на Python?Именно так — это генератор кода, а не библиотека. Вы вставляете ссылку на файл в Figma и API-токен, а он разбирает дизайн и выдаёт код для Tkinter вместе с файлами изображений. Работа идёт через CLI, кроме того, в комплекте есть и собственный GUI.
Как его запустить?Установите пакет через pip (нужен Python 3.9 или новее), затем запустите Tkinter Designer и вставьте ссылку на свой файл в Figma и API-токен.
Нужно ли что-то ещё в Figma, кроме самого дизайна?Только аккаунт Figma, в котором лежит ваш дизайн — инструмент авторизуется с помощью Figma API-токена, чтобы прочитать файл. Кроме этого понадобится лишь Python 3.9+.
Есть ли подводные камни при вставке ссылки на Figma?Да — берите URL в кавычки в командной строке: в ссылках Figma часто встречаются параметры с ? и &, которые ломают команду без кавычек. А ещё если перед копированием ссылки выделить конкретный фрейм, то именно он и будет сгенерирован.
Может ли он сделать приложение с несколькими экранами?Да. Помимо вывода одного фрейма он умеет генерировать приложение на Tkinter с классами, или одно приложение с навигацией «Назад/Далее» между несколькими фреймами Figma; в сгенерированных приложениях можно также применить тему ttk.
Как подключить свою логику к сгенерированному интерфейсу?Сгенерированный gui.py можно импортировать из другого файла на Python без автоматического запуска mainloop — так вы сможете привязать свои команды к виджетам и позже перегенерировать интерфейс.
Я изменил дизайн в Figma — как обновить сгенерированный GUI?Запустите CLI снова с флагом -f: он очистит существующую папку сборки и заново сгенерирует всё по обновлённому дизайну.
Сам Tkinter Designer сделан с помощью Tkinter Designer?Да — в README отмечается, что даже собственный GUI Tkinter Designer был создан с помощью Tkinter Designer, так что это заодно наглядная демонстрация того, что умеет инструмент.
Size
10.1 MB
Stars
10.3K
Age
5y
Commits · 90 Days