TUI Designer
Terminal User Interface designer for PowerShell
The TUI Designer is currently in beta.
The Terminal User Interface (TUI) designer is used for designing UIs that run within standard terminals. They output script that works with Terminal.Gui. This project allows for the creation of UIs that run on Windows, Linux and Mac. You can even run terminals in shells like Azure Cloud Shell.

Overview

The TUI Designer is a console application based on Terminal.Gui. You can download the designer from our downloads page. To create a GUI, open the designer application by launching Terminal.Gui.Designer.
The TUI designer is broken into 4 sections. On the left, you have the following.
    Toolbox - Contains available controls that can be added to the window
    Properties - Allows for editing for selected controls
    Controls - Contains a list of controls defined in the Window
The right side of the designer is the design surface and displays the current window and any controls that are added to it.

Designing a TUI

To design a TUI, you take advantage of the sections defined above. To add new controls, double click on the control listed in the Toolbox and it will be added to the form.
Adding a control
Once the control has been added, it will appear within the designer window and within the list of Controls. Some default properties will be set for the control. You can move the control around the window by clicking and dragging it. When moving a control like this, it will set the absolute positioning of the control.
Moving a control
When you select a control, the Properties view will update with all the available properties that you can set for the control. Some properties have special dialogs that will open to allow you to modify more complex objects. Properties like sizes and positioning can be used to create calculated layouts. You can also easily set text and IDs.
Setting Properties
Once you have completed designing your control, you can save the file as a PS1 file. The PS1 file will contain a PowerShell script that will display the same TUI.
Save a TUI

Running a TUI

To run a TUI, you will need to install the Microsoft.PowerShell.ConsoleGuiTools module. This module contains the Terminal.Gui assembly.
1
Install-Module Microsoft.PowerShell.ConsoleGuiTools
Copied!
Next, you will need to load the Terminal.Gui assembly and initialize the application.
1
$guiTools = (Get-Module Microsoft.PowerShell.ConsoleGuiTools -List).ModuleBase
2
Add-Type -Path (Join-path $guiTools Terminal.Gui.dll)
3
[Terminal.Gui.Application]::Init()
Copied!
The script that is generate with the TUI designer will return a Window object that you can use in your application. Invoke your script and add it to the application. Do not modify the script directly. It will be overridden if you use the designer again and the designer may not be able to load the script if you modify it.
1
$Window = .\tui.ps1
2
[Terminal.Gui.Application]::Top.Add($Window)
Copied!
Finally, you can start your application by calling Run.
1
[Terminal.Gui.Application]::Run()
Copied!

Adding Event Handlers

To add interaction to your TUI, you will need to add event handlers. You can learn about all the events the are available by visiting the Terminal.Gui documentation.
For example, if you want to add a click event to a button, you could do the following. Variables for each one of your controls will be defined based on their ID.
1
$View0.add_Clicked({[Terminal.Gui.MessageBox]::Query("Hello", "")})
Copied!
Event Handlers
Last modified 8mo ago