Create GUI with WPF in PowerShell – Part III

In the previous article, we have created the first GUI with PowerShell XAML code and continuation to it, we will now expand more by adding a few controls like Button, TextBox, and label.

Open visual studio and start adding the mentioned controls.

Once you add the controls, these control codes will be reflected into <grid></grid> tab.

 <Button Content="Button" HorizontalAlignment="Left" Margin="421,72,0,0" VerticalAlignment="Top" Width="138" Height="37"/>
<TextBox HorizontalAlignment="Left" Height="37" Margin="137,72,0,0" TextWrapping="Wrap" Text="TextBox" VerticalAlignment="Top" Width="173"/>
<Label Content="Label" HorizontalAlignment="Left" Margin="191,166,0,0" VerticalAlignment="Top" Width="202" Height="32"/>

In the last article we have explained overall process of creating suitable code for PowerShell, if you have not gone through that article then it is highly recommended to visit there article by clicking below link.

Here, the final code is written with modification as we have already explained about different components in Part-II.

Add-Type -AssemblyName PresentationFramework
[XML]$form = @"
   <Window 
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <Button Content="Button" HorizontalAlignment="Left" Margin="421,72,0,0" VerticalAlignment="Top" Width="138" Height="37"/>
        <TextBox HorizontalAlignment="Left" Height="37" Margin="137,72,0,0" TextWrapping="Wrap" Text="TextBox" VerticalAlignment="Top" Width="173"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="191,166,0,0" VerticalAlignment="Top" Width="202" Height="32"/>
    </Grid>
    </Window>
"@

$NR = (New-Object System.Xml.XmlNodeReader $form)
$window = [Windows.Markup.XamlReader]::Load($NR)

$window.ShowDialog()

Once you execute the above command, GUI box will be appeared.

Add Controls to the GUI

You can decorate the above form using different properties that is displayed on the right-hand side of the screen in the Properties window. Now we are going to create our first input-output based simple GUI.

With the GUI shown above, we are going to take input from the textbox and when we click a button, the text of the input box should be displayed in label.

Once you create the above sample form, make sure you provide an identical name to the controls through the Name property because they are the ones that will be used for implementing their methods and retrieving properties.

The name property can be set for the as shown below. The below screenshot is for the Button property and similarly, you can set it for Textbox and label. We are only covering the properties required to fulfill our purpose.

Button Name property

Your code will look like as below after modification as mentioned earlier but once you add properties, there is another character x: is added after the name of the control like <Button x:name…./>, <TextBox x:Name….>. In that case remove the x: from the commands.

<Window 
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        Title="First GUI" Height="450" Width="800" Background="#FFA09797">
    <Grid>
        <Button Name="Submitbtn" Content="Button" HorizontalAlignment="Left" Margin="340,33,0,0" VerticalAlignment="Top" Width="138" Height="37" Background="#FF99B48C"/>
        <TextBox Name="Inputtext" HorizontalAlignment="Left" Height="37" Margin="55,33,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="240"/>
        <Label Name="outlabel" Content="Output " HorizontalAlignment="Left" Margin="137,110,0,0" VerticalAlignment="Top" Width="341" Height="32" Background="#FF9B3939"/>

    </Grid>
</Window>

Alright, we have code for the creating form, decorating it and adding controls is as below.

Add-Type -AssemblyName PresentationFramework
[XML]$form = @"
   <Window 
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        Title="First GUI" Height="450" Width="800" Background="#FFA09797">
    <Grid>
        <Button Name="Submitbtn" Content="Button" HorizontalAlignment="Left" Margin="340,33,0,0" VerticalAlignment="Top" Width="138" Height="37" Background="#FF99B48C"/>
        <TextBox Name="Inputtext" HorizontalAlignment="Left" Height="37" Margin="55,33,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="240"/>
        <Label Name="outlabel" Content="Output " HorizontalAlignment="Left" Margin="137,110,0,0" VerticalAlignment="Top" Width="341" Height="32" Background="#FF9B3939"/>

    </Grid>
   </Window>

"@

$NR = (New-Object System.Xml.XmlNodeReader $form)
$window = [Windows.Markup.XamlReader]::Load($NR)

$window.ShowDialog()

Click on below link to continue…