{"id":13361,"date":"2011-07-10T00:01:00","date_gmt":"2011-07-10T00:01:00","guid":{"rendered":"https:\/\/blogs.technet.microsoft.com\/heyscriptingguy\/2011\/07\/10\/use-showui-to-easily-create-graphical-interfaces-for-powershell\/"},"modified":"2011-07-10T00:01:00","modified_gmt":"2011-07-10T00:01:00","slug":"use-showui-to-easily-create-graphical-interfaces-for-powershell","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/scripting\/use-showui-to-easily-create-graphical-interfaces-for-powershell\/","title":{"rendered":"Use ShowUi to Easily Create Graphical Interfaces for PowerShell"},"content":{"rendered":"

Summary<\/strong>: Use ShowUi, a free Windows PowerShell module, to simplify creating graphical interfaces for scripts.\n \nMicrosoft Scripting Guy Ed Wilson here. Today, I have a guest article from my good friend James Brundage. Here is a little bit about him.  \nJames Brundage is the founder of Start-Automating<\/a>, a company dedicated to saving people time and money by helping them automate. Start-Automating offers Windows PowerShell training and custom Windows PowerShell and .NET Framework development. James formerly worked on the Windows PowerShell team at Microsoft. You can follow James on Twitter (@jamesbru) or on the Start-Automating company blog<\/a>.\nTake it away, James!\n \nSome people say I love Windows PowerShell a little too much.\nI strongly believe that a script a day keeps Dr. Scripto away. I easily spend more time scripting with PowerShell than any other recreation activity (except maybe Xbox), and I take any statement along the lines of “you can’t do that in Windows PowerShell” as a challenge.\nToday, I’m going to showcase an answer to one of those “you can’t do that in Windows PowerShell” lines.\nAn astoundingly large number of people don’t know that you can write user interfaces in Windows PowerShell. Some small technical changes in Windows PowerShell 2.0 enabled scripting of a really cool UI platform called Windows Presentation Foundation<\/a> (WPF).\nIn June 2011, scripting WPF reached a whole new level of easy with the release of ShowUI. ShowUI is a Windows PowerShell module that makes it simple to write UI in Windows PowerShell with WPF. You can download ShowUI at http:\/\/showui.codeplex.com\/<\/a>. Now, not only can you write user interfaces in Windows PowerShell, but they’re almost always a lot shorter.\nIn This Weekend Scripter article, I’ll show and explain a fun sample: How to Write a Drag-and-Drop Video Player in 12 Lines of Script<\/a>. Here’s the code:<\/p>\n

New-Window -AllowDrop -On_Drop {<\/p>\n

    $videoPlayer.Source = @($_.Data.GetFileDropList())[0]<\/p>\n

    $videoPlayer.Play()<\/p>\n

} -On_Loaded {<\/p>\n

    $videoPlayer.Source = Get-ChildItem -Path “$env:PublicVideosSample Videos” -Filter *.wmv |<\/p>\n

        Get-Random | Select-Object -ExpandProperty Fullname<\/p>\n

    $videoPlayer.Play()<\/p>\n

} -On_Closing {<\/p>\n

    $videoPlayer.Stop()<\/p>\n

} -Content {<\/p>\n

    New-MediaElement -Name VideoPlayer -LoadedBehavior Manual<\/p>\n

} –asjob<\/p>\n

 \nIt’s a pretty simple app. I create a window, and I allow it to accept dropped items. Whenever an item is dropped (On_Drop<\/b>), I look into that items data and get out the list of files. Then I select the first one, and make the video player’s source that item. Then, I start up the video player.\nWhenever a window is loaded, I go find all the sample videos, pick a random one, and make that the video player’s source. I then start the video player. Whenever the window is closing, I make sure to stop the video player as well, or else the media actually keeps playing in an invisible window. The window only has a little bit of content. That content is a media element called VideoPlayer<\/b>. This MediaElement<\/b> is what’s providing the value for $videoplayer<\/b> everywhere in the script. Because we want to be able to stop and play the video manually, I set LoadedBehavior<\/b> to Manual<\/b>. To make sure that I can watch the videos and script at the same time, I launch my UI in the background with –AsJob<\/b>.\nShowUI lets you build richer solutions than you ever thought possible with Windows PowerShell. Download it for yourself at http:\/\/showui.codeplex.com\/<\/a>, and keep watching our YouTube channel<\/a> for more videos. And the next time a colleague of yours doubts the power of Windows PowerShell, just say:\n“Hey, I’ve got a little video to show you.”\n \nSplatting and ShowUI<\/b>\nSplatting is a nifty technique that lets you use a hash table as the input for your scripts or cmdlets. I cover this in greater detail in A Series on Splatting (Part 1<\/a>, Part 2<\/a>, Part 3<\/a>, Part 4<\/a>, Part 5<\/a>).\nThis example shows how we can make a frontend for the world’s simplest function: Out-LastNameFirstName<\/b>. Watch the YouTube video<\/a>.<\/p>\n

Import-Module ShowUI<\/p>\n

 <\/p>\n

function Out-LastNameFirstName<\/p>\n

{<\/p>\n

    param($firstName,$lastName)<\/p>\n

   <\/p>\n

    “$lastName, $firstName”<\/p>\n

}<\/p>\n

 <\/p>\n

$in = New-UniformGrid  -Columns 2 -ControlName Get-FirstAndLastName -Children {<\/p>\n

    ‘First Name’<\/p>\n

    New-TextBox -Name FirstName<\/p>\n

    ‘Last Name’<\/p>\n

    New-TextBox -Name LastName<\/p>\n

    ‘ ‘<\/p>\n

    New-Button “OK” -IsDefault -On_Click {<\/p>\n

        $parent | Set-UIValue -passThru | Close-Control   <\/p>\n

    }<\/p>\n

} -show<\/p>\n

 <\/p>\n

Out-LastNameFirstName @in<\/p>\n

 \nThe function is simple enough. Out-LastAndFirstName<\/b> will simply print out a firstName<\/b> and lastName<\/b> packed together in lastName<\/b>, firstName<\/b> format. The UI is also really simple, because of the magic of ShowUI.\n$in<\/b> will set the window’s value when we close. A UniformGrid<\/b> is a control that will automatically put items in a uniformly arranged grid. By giving the grid two columns, I can guarantee that the odd-numbered items go on the left and the even-numbered items go on the right.\nThe grid has a ControlName<\/i>: Get-FirstAndLastName<\/b>. –ControlName<\/i> is a parameter in ShowUI that lets you anchor all of the values to a particular part of the UI. –ControlName<\/i> helps determine which variables are there in your event handler, and where the UI will get values.\n‘First Name’<\/b> is just a string, and, if you put a string inside a collection in ShowUI, it will automatically try to turn it into a label. The text box comes right after it, and will appear on the right side. By giving the text box a name, two things happen: <\/p>\n