DEV Community

Cover image for ๐Ÿš€ BuilderUI: Create Delphi Interfaces Dynamically from JSON
Joรฃo Bosco
Joรฃo Bosco

Posted on

๐Ÿš€ BuilderUI: Create Delphi Interfaces Dynamically from JSON

Have you ever found yourself copying and pasting the same UI code across multiple Delphi forms? I did โ€” and thatโ€™s exactly why I created BuilderUI.

BuilderUI is a dynamic UI generator for Delphi that allows you to define components using JSON and render them at runtime. Itโ€™s perfect for scenarios where flexibility, rapid prototyping, or low-code customization is needed.

๐Ÿ”ง What is BuilderUI?

BuilderUI is a Delphi engine that reads a JSON file and builds a fully working VCL form with components like:

  • TEdit, TLabel, TButton, TCheckBox, TComboBox
  • Containers like TPanel
  • Event support like OnClick

โœ… Main Features:

  • JSON-driven UI generation
  • Component positioning (Top, Left, Width, Height)
  • Runtime event handling
  • Clean and extensible architecture

๐Ÿงช Example JSON Input

{
  "Name": "FrmLoginScreen",
  "Type": "TForm",
  "Caption": "Login Screen",
  "Width": 400,
  "Height": 300,
  "Components": [
    {
      "Type": "TLabel",
      "Name": "lblUser",
      "Caption": "Username",
      "Top": 20,
      "Left": 20
    },
    {
      "Type": "TEdit",
      "Name": "edtUser",
      "Top": 40,
      "Left": 20,
      "Width": 200
    },
    {
      "Type": "TButton",
      "Name": "btnLogin",
      "Caption": "Login",
      "Top": 80,
      "Left": 20
    }
  ]
}
Enter fullscreen mode Exit fullscreen mode

๐Ÿง  How It Works (Under the Hood) BuilderUI uses:

๐Ÿ—๏ธ Builder + Factory pattern to create UI elements
๐Ÿ” RTTI to dynamically instantiate and set component properties
๐Ÿ”Ž System.JSON for JSON parsing
๐Ÿงช In-progress unit tests using DUnitX

๐Ÿ’ก Why BuilderUI?

Use cases:
Generate dynamic admin panels from metadata
Let clients define UI layouts via config
Create low-code solutions inside Delphi
Replace boilerplate screen generation with flexible runtime forms

๐Ÿงญ Roadmap

Grouping and tabs with TPageControl
Data-aware components with binding
Drag-and-drop form designer
Integration with 3rd-party components (DevExpress, TMS)
JSON schema validation and autocomplete

โš™๏ธ How to Use

Want a quick demo? Just clone the repo and run the example project.

  1. Clone the repository: git clone https://github.com/boscobecker/BuilderUI.git
  2. Open in Delphi (tested on Delphi 10.4 and 11+)
  3. Load a JSON file with layout
  4. Run the project and see the form created at runtime

๐Ÿ™Œ Contribute or Give Feedback

This project is under active development.
If you're passionate about runtime UI, low-code, or just love Delphi โ€” I'd love your feedback, ideas or contributions.
โญ Star the project on GitHub
๐Ÿ’ฌ Comment here or open an issue
๐Ÿค Connect with me on LinkedIn :https://www.linkedin.com/in/boscobecker/
๐Ÿ”— GitHub Repo: https://github.com/boscobecker/BuilderUI

๐Ÿง  Follow me for more Delphi & .NET content!

Top comments (0)