Build GUI with PowerShell

Build GUI with PowerShell

Hello,

Maybe you’re a PowerShell user, but that’s not the case for every IT Pro. Some of them are very attached to GUI, and refuse to use PowerShell. Maybe your support teams need quick and easy access to automation. Maybe your client want you to build a GUI on top of your PowerShell script.

There are plenty of reasons to build GUI with PowerShell. A PowerShell MVP, Tobias Weltner wrote an awesome module named : IseSteroids. Recently he added support for Windows Presentation Framework (WPF). The best experience requires Visual Studio installed.

Build GUI with PowerShell

Hereunder some information about how using it :

First, you need to open a new tab in your ISE Steroids, right click anywhere, WPF, Create Windows in Visual Studio :

IseSteroids-WPF-1

Build GUI with PowerShell – Create a WPF Window

It will generate a bunch of XAML code :

IseSteroids-WPF-2

Build GUI with PowerShell – Initial Code

And open Visual Studio, you need to edit the XAML file yourself, for that, click on “Solution Explorer” on the bottom tight of your Visual Studio window :

IseSteroids-WPF-3

Build GUI with PowerShell – Solution Explorer

And then open “MainWindow.xaml” :

IseSteroids-WPF-4

Build GUI with PowerShell – MainWindow.xaml

IseSteroids-WPF-5

Build GUI with PowerShell – Start Customizations

You can now start customizing your GUI :

IseSteroids-WPF-6

Build GUI with PowerShell – Customized GUI

Once done, “ctrl+s” (save) and close Visual Studio.

Now, right click on your XAML code, WPF and “Add/Update Code Behind” :

IseSteroids-WPF-7

Build GUI with PowerShell – Add Code Behind

This will you add some PowerShell code to create a GUI from XAML code :

IseSteroids-WPF-8

Build GUI with PowerShell – Complete Code

You just need to add :

$window.ShowDialog()

At the end, and you can execute your code :

IseSteroids-WPF-9

Build GUI with PowerShell – Exemple

As you will notice, nothing happens when you hit the buttons. That’s expected, we didn’t add any events on them. To Add event, right click on your XAML code, WPF, “Attach Events” :

IseSteroids-WPF-10

Build GUI with PowerShell – Attach Event

Chose a GUI element from the drop-down list :

IseSteroids-WPF-11

Choose an event :

IseSteroids-WPF-12

It will generate some PowerShell code :

IseSteroids-WPF-13

You can then insert your custom code in this scriptblock, and create others for all your GUI elements :

$window.button.add_Click(
    {
        $window.close()
        [System.Object]$sender = $args[0]
        [System.Windows.RoutedEventArgs]$e = $args[1]
        
    }
)

$window.OK.add_Click(
    {
        $Window.TextBox.Text = $host.Version.Major
        [System.Object]$sender = $args[0]
        [System.Windows.RoutedEventArgs]$e = $args[1]
        
    }
)

Let’s run it now. When you click on “Ok”, the textbox will display your PowerShell version. when you click on “Cancel”, it will close the windows :

IseSteroids-WPF-14

That’s pretty useless, but that’s an example.

Hereunder the complete script :

function Convert-XAMLtoWindow
{
    param
    (
        [Parameter(Mandatory=$true)]
        [string]
        $XAML,
        
        [string[]]
        $NamedElements,
        
        [switch]
        $PassThru
    )
    
    Add-Type -AssemblyName PresentationFramework
    
    $reader = [System.XML.XMLReader]::Create([System.IO.StringReader]$XAML)
    $result = [System.Windows.Markup.XAMLReader]::Load($reader)
    foreach($Name in $NamedElements)
    {
        $result | Add-Member NoteProperty -Name $Name -Value $result.FindName($Name) -Force
    }
    
    if ($PassThru)
    {
        $result
    }
    else
    {
        $result.ShowDialog()
    }
}

$xaml = @'
<Window
   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"
   MinHeight="150"
   Width="312"
   SizeToContent="Height"
   Title="WPF build by PowerShell"
   Topmost="True" d:DesignHeight="175">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="22*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Button x:Name="OK" Width="80" Height="25" HorizontalAlignment="Right" Margin="0,0,10,10" VerticalAlignment="Bottom" Content="OK"/>
        <Label x:Name="label" HorizontalAlignment="Left" Margin="0,10,0,0" VerticalAlignment="Top" RenderTransformOrigin="-1.5,-3" Height="28" Width="130" Content="PowerShell version :" Grid.ColumnSpan="2"/>
        <Button x:Name="button" Content="Cancel" HorizontalAlignment="Left" Margin="134,0,0,10" VerticalAlignment="Bottom" Width="75" Height="25"/>
        <TextBox x:Name="textBox" TextWrapping="Wrap" Margin="10,38,174,81"/>
    </Grid>
</Window>
'@

$window = Convert-XAMLtoWindow -XAML $xaml -NamedElements 'OK', 'label', 'button', 'textBox' -PassThru

$window.button.add_Click(
    {
        $window.close()
        [System.Object]$sender = $args[0]
        [System.Windows.RoutedEventArgs]$e = $args[1]
        
    }
)

$window.OK.add_Click(
    {
        $Window.TextBox.Text = $host.Version.Major
        [System.Object]$sender = $args[0]
        [System.Windows.RoutedEventArgs]$e = $args[1]
        
    }
)

$window.ShowDialog()

Happy GUI building !

Note :

  • You can buy the tool here.
  • You can try it here.

3 thoughts on “Build GUI with PowerShell

  1. Pingback: Powershell und Skype – Merkbar.

  2. Pingback: Create Graphical User Interface PowerShell - It for DummiesIt for Dummies

Leave a Reply