pynamicui 0.0.7

dynamic web-like UIs using a declarative syntax

PynamicUI

PynamicUI is a lightweight Python library that provides a dynamic user interface (UI) framework for creating interactive and responsive applications. It simplifies the process of building user interfaces by abstracting away the complexities of working directly with a UI toolkit like Tkinter. With PynamicUI, you can create dynamic web-like UIs using a declarative syntax, making it easy to define and manage the UI components and their interactions.

Features

• Declarative Syntax: Define UI components using a declarative syntax similar to HTML, making it intuitive and easy to manage.
• Dynamic Rendering: Efficiently render virtual elements as tkinter widgets, ensuring responsiveness and interactivity.
• State Management: Manage the state of your application and automatically update the UI when state changes occur.
• Hooks and Effects: Utilize hooks and effects to add custom logic and side effects to elements, enhancing interactivity.
• Styling Capabilities: Apply styles to UI elements with ease, allowing for seamless customization of appearance.
• Responsive and Interactive UIs: Build dynamic and responsive user interfaces with web-like interactions.

Installation

PynamicUI requires the CustomTkinter library. To install PynamicUI and its dependencies, you can use pip:

pip install pynamicui

Getting Started

Using PynamicUI in a New Project

To start using PynamicUI in a new project, follow these steps:

1. Import the required classes and functions from PynamicUI:

from pynamicui import createStylesheet, createDom, createElement, setAppearanceMode
import customtkinter as tk

2. Define your UI components using the createElement class:

class CounterApp:
    def __init__(self, dom):
        self.dom = dom
        # Create the counter state using dom.useState
        self.dom.useState("counter", 0, self.update_counter_label)

        # Create a label to display the counter value
        self.counter_label = createElement(self.dom, "Label", props={"text": "Counter: 0"}, place={"relwidth": 1, "relheight": 0.5})

        # Create a button to increment the counter
        self.increment_button = createElement(self.dom, "Button", style="PrimaryButton", props={"text": "Increment", "command": self.increment_counter}, place={"relwidth": 1, "relheight": 0.5, "rely": 0.5})

    def increment_counter(self):
        # Get the current counter value
        counter = self.dom.getState("counter")
        # Increment the counter value
        counter += 1
        # Update the counter state
        self.dom.setState("counter", counter)

    def update_counter_label(self, prop, element, value):
        # Update the counter label text prop with the new counter value
        self.counter_label.setProp("text", f"Counter: {value}")

3. Add styles using the createStylesheet class:

styles = createStylesheet()

styles.addStyle("PrimaryButton", {
    "font": ("Arial", 14, "normal"),
    "fg_color": "grey",
    "bg_color": "blue"
})

styles.addStyle("SecondaryButton", {
    "font": ("Arial", 14, "normal"),
    "fg_color": "black",
    "bg_color": "green"
})

4. Render the virtual DOM and launch your application:

if __name__ == "__main__":
    dom = createDom()
    dom.setStylesheet(styles)
    
    CounterApp(dom)

    dom.render()

Integrating PynamicUI in an Existing Project

To integrate PynamicUI into an existing project, follow these steps:

1. Install PynamicUI and its dependencies as described in the Installation section.

2. Import the required classes and functions from PynamicUI:

from pynamicui import createStylesheet, createDom, createElement, setAppearanceMode
import customtkinter as tk

3. Identify the parts of your application where you want to use PynamicUI and create virtual elements accordingly.

4. Add styles using the createStylesheet class to customize the appearance of the UI elements.

5. Implement state management and hooks to add interactivity and custom logic to your application.

6. Render the virtual DOM and launch your application:

if __name__ == "__main__":
    dom = createDom(root=existingCustomTkinterRoot)

Documentation

For detailed documentation and usage examples, please refer to the PynamicUI Wiki.

Examples

Check out the examples folder for practical examples building an application with PynamicUI.

Contributions

Contributions to PynamicUI are welcome! If you find any issues or have suggestions for improvements, please open an issue or submit a pull request on GitHub.

License

PynamicUI is licensed under the Apache License. Feel free to use, modify, and distribute this library as permitted by the license.

Acknowledgments

PynamicUI is built upon the foundation of CustomTkinter. Special thanks to the developers of CustomTkinter for their valuable contributions.