figmaflet


Namefigmaflet JSON
Version 0.0.3 PyPI version JSON
download
home_pageNone
SummaryA tool to generate Flet UI from Figma designs.
upload_time2025-01-07 18:36:26
maintainerNone
docs_urlNone
authorNone
requires_python>=3.8
licenseApache-2.0 license
keywords flet drag-and-drop figma ui easy
VCS
bugtrack_url
requirements flet requests jinja2 pillow
Travis-CI No Travis.
coveralls test coverage No coveralls.
            # FigmaFlet

FigmaFlet is a tool that generates Flet UI code directly from Figma designs. It streamlines the process of transforming your Figma prototypes into production-ready Python code using the Flet framework. 

## Features

- **Figma Integration**: Fetch designs directly from Figma using the file URL and API token.
- **Automatic Code Generation**: Generate Flet UI code from your designs with minimal manual effort.
- **Multi-line Text Handling**: Supports multi-line text elements seamlessly.
- **Graphical Interface**: Provides an intuitive GUI for entering API tokens, file URLs, and output paths.

## Installation

### From Source
1. Clone the repository:
```bash
git clone https://github.com/Benitmulindwa/figmaflet.git
cd figmaflet
```
2. Install the dependencies:
```bash
pip install -r requirements.txt
```
### From PyPI

```
pip install figmaflet
```

## Usage

1. Launch the GUI to interactively input your API token, file URL, and output path:

```bash
python -m figmaflet.gui
```
![figmaflet_gui](https://github.com/user-attachments/assets/10ed6ffa-9deb-4e7d-94b2-11489d4ebf23)
### How It Works
- Input your API token, file URL and output path.
- FigmaFlet fetches the design data using Figma's API token.
- The tool processes the design elements and generates Flet-compatible Python code.
- The generated code is saved to your specified output path.

2. Command-Line Interface (CLI)
Once installed, use the CLI to generate Flet code:

```bash
figmaflet --apikey YOUR_API_KEY --fileurl YOUR_FILE_URL --output YOUR_OUTPUT_PATH
```


Figma API Key
You will need your Figma API token to access design files. Generate your key by visiting your [Figma](https://figma.com) account settings.


File URL
Provide the Figma file URL containing your design; This is your figma project's URL.

## Results:
### Figma design

![figmaOriginal](https://github.com/user-attachments/assets/054e5b07-aece-45ba-812b-4b6dceaaeb86)

### Figmaflet output
![figmaflet_5th_try](https://github.com/user-attachments/assets/15727ba1-b619-4e5f-a4be-f410231f9658)
## Upcoming Features
- **Images** and **Icons**
- **TextFields**
- **Buttons** + **Events handling**(eg: on_hover)
- **Fonts support**
- **Style Improvements**: better handling of **shadows**, **gradients** and other advanced figma styles
- **UI Responsivity**
- **Flexibiliy**: the generated code must be more flexible and easy to edit
- **Animations**


## Contributing
Contributions to FigmaFlet are highly welcomed! 

#### To contribute:

- **Fork the repository.**
- **Create a feature branch.**
- **Submit a pull request with a detailed explanation of your changes.**
## License
This project is licensed under the Apache-2.0 License. See the LICENSE file for details.

## Author
Benit Mulindwa - [GitHub](https://github.com/benitmulindwa)

### Acknowledgments
Special thanks to the tkinterdesigner and Figma communities for their support and inspiration.

### Contact
For questions, suggestions, or feedback, feel free to open an issue or reach out to mulindwabenit@gmail.com.


            

Raw data

            {
    "_id": null,
    "home_page": null,
    "name": "figmaflet",
    "maintainer": null,
    "docs_url": null,
    "requires_python": ">=3.8",
    "maintainer_email": null,
    "keywords": "flet, drag-and-drop, figma, ui, easy",
    "author": null,
    "author_email": "Benit Mulindwa <mulindwabenit@gmail.com>",
    "download_url": "https://files.pythonhosted.org/packages/5a/d0/5fd58e863c0b0ef4f2162c6d4c29e47e032c74549ec80fb88ab9920682d1/figmaflet-0.0.3.tar.gz",
    "platform": null,
    "description": "# FigmaFlet\r\n\r\nFigmaFlet is a tool that generates Flet UI code directly from Figma designs. It streamlines the process of transforming your Figma prototypes into production-ready Python code using the Flet framework. \r\n\r\n## Features\r\n\r\n- **Figma Integration**: Fetch designs directly from Figma using the file URL and API token.\r\n- **Automatic Code Generation**: Generate Flet UI code from your designs with minimal manual effort.\r\n- **Multi-line Text Handling**: Supports multi-line text elements seamlessly.\r\n- **Graphical Interface**: Provides an intuitive GUI for entering API tokens, file URLs, and output paths.\r\n\r\n## Installation\r\n\r\n### From Source\r\n1. Clone the repository:\r\n```bash\r\ngit clone https://github.com/Benitmulindwa/figmaflet.git\r\ncd figmaflet\r\n```\r\n2. Install the dependencies:\r\n```bash\r\npip install -r requirements.txt\r\n```\r\n### From PyPI\r\n\r\n```\r\npip install figmaflet\r\n```\r\n\r\n## Usage\r\n\r\n1. Launch the GUI to interactively input your API token, file URL, and output path:\r\n\r\n```bash\r\npython -m figmaflet.gui\r\n```\r\n![figmaflet_gui](https://github.com/user-attachments/assets/10ed6ffa-9deb-4e7d-94b2-11489d4ebf23)\r\n### How It Works\r\n- Input your API token, file URL and output path.\r\n- FigmaFlet fetches the design data using Figma's API token.\r\n- The tool processes the design elements and generates Flet-compatible Python code.\r\n- The generated code is saved to your specified output path.\r\n\r\n2. Command-Line Interface (CLI)\r\nOnce installed, use the CLI to generate Flet code:\r\n\r\n```bash\r\nfigmaflet --apikey YOUR_API_KEY --fileurl YOUR_FILE_URL --output YOUR_OUTPUT_PATH\r\n```\r\n\r\n\r\nFigma API Key\r\nYou will need your Figma API token to access design files. Generate your key by visiting your [Figma](https://figma.com) account settings.\r\n\r\n\r\nFile URL\r\nProvide the Figma file URL containing your design; This is your figma project's URL.\r\n\r\n## Results:\r\n### Figma design\r\n\r\n![figmaOriginal](https://github.com/user-attachments/assets/054e5b07-aece-45ba-812b-4b6dceaaeb86)\r\n\r\n### Figmaflet output\r\n![figmaflet_5th_try](https://github.com/user-attachments/assets/15727ba1-b619-4e5f-a4be-f410231f9658)\r\n## Upcoming Features\r\n- **Images** and **Icons**\r\n- **TextFields**\r\n- **Buttons** + **Events handling**(eg: on_hover)\r\n- **Fonts support**\r\n- **Style Improvements**: better handling of **shadows**, **gradients** and other advanced figma styles\r\n- **UI Responsivity**\r\n- **Flexibiliy**: the generated code must be more flexible and easy to edit\r\n- **Animations**\r\n\r\n\r\n## Contributing\r\nContributions to FigmaFlet are highly welcomed! \r\n\r\n#### To contribute:\r\n\r\n- **Fork the repository.**\r\n- **Create a feature branch.**\r\n- **Submit a pull request with a detailed explanation of your changes.**\r\n## License\r\nThis project is licensed under the Apache-2.0 License. See the LICENSE file for details.\r\n\r\n## Author\r\nBenit Mulindwa - [GitHub](https://github.com/benitmulindwa)\r\n\r\n### Acknowledgments\r\nSpecial thanks to the tkinterdesigner and Figma communities for their support and inspiration.\r\n\r\n### Contact\r\nFor questions, suggestions, or feedback, feel free to open an issue or reach out to mulindwabenit@gmail.com.\r\n\r\n",
    "bugtrack_url": null,
    "license": "Apache-2.0 license",
    "summary": "A tool to generate Flet UI from Figma designs.",
    "version": "0.0.3",
    "project_urls": {
        "Homepage": "https://github.com/Benitmulindwa/figmaflet"
    },
    "split_keywords": [
        "flet",
        " drag-and-drop",
        " figma",
        " ui",
        " easy"
    ],
    "urls": [
        {
            "comment_text": "",
            "digests": {
                "blake2b_256": "163d09f0047631b9ac94a3ac230e7827e85174f0ec35f7451c43ecce8d7b2de5",
                "md5": "73bd27c7402b3f592e7aa422df3ca2f7",
                "sha256": "e08ff7776ea8ace4744a05eefb5752a37ba06627d41d614f4096b2c46e2e65f5"
            },
            "downloads": -1,
            "filename": "figmaflet-0.0.3-py3-none-any.whl",
            "has_sig": false,
            "md5_digest": "73bd27c7402b3f592e7aa422df3ca2f7",
            "packagetype": "bdist_wheel",
            "python_version": "py3",
            "requires_python": ">=3.8",
            "size": 16683,
            "upload_time": "2025-01-07T18:36:23",
            "upload_time_iso_8601": "2025-01-07T18:36:23.882969Z",
            "url": "https://files.pythonhosted.org/packages/16/3d/09f0047631b9ac94a3ac230e7827e85174f0ec35f7451c43ecce8d7b2de5/figmaflet-0.0.3-py3-none-any.whl",
            "yanked": false,
            "yanked_reason": null
        },
        {
            "comment_text": "",
            "digests": {
                "blake2b_256": "5ad05fd58e863c0b0ef4f2162c6d4c29e47e032c74549ec80fb88ab9920682d1",
                "md5": "ca3d9d5d340b2457021746be81badb1c",
                "sha256": "744a1a2cd83f7db433f19e93ccfec15e9f7eaf6b2f21b2313138c9661361e08b"
            },
            "downloads": -1,
            "filename": "figmaflet-0.0.3.tar.gz",
            "has_sig": false,
            "md5_digest": "ca3d9d5d340b2457021746be81badb1c",
            "packagetype": "sdist",
            "python_version": "source",
            "requires_python": ">=3.8",
            "size": 15112,
            "upload_time": "2025-01-07T18:36:26",
            "upload_time_iso_8601": "2025-01-07T18:36:26.522373Z",
            "url": "https://files.pythonhosted.org/packages/5a/d0/5fd58e863c0b0ef4f2162c6d4c29e47e032c74549ec80fb88ab9920682d1/figmaflet-0.0.3.tar.gz",
            "yanked": false,
            "yanked_reason": null
        }
    ],
    "upload_time": "2025-01-07 18:36:26",
    "github": true,
    "gitlab": false,
    "bitbucket": false,
    "codeberg": false,
    "github_user": "Benitmulindwa",
    "github_project": "figmaflet",
    "travis_ci": false,
    "coveralls": false,
    "github_actions": false,
    "requirements": [
        {
            "name": "flet",
            "specs": []
        },
        {
            "name": "requests",
            "specs": []
        },
        {
            "name": "jinja2",
            "specs": []
        },
        {
            "name": "pillow",
            "specs": []
        }
    ],
    "lcname": "figmaflet"
}
        
Elapsed time: 1.95944s