Follow Me on Instagram Subscribe via RSS Feed

1st Day of Silverlight: Native Windows

December 11, 2011

Silverlight 5 has just been released and it’s a couple of weeks before Christmas, so what would be than to start a new blog series on the “12 Days of Silverlight”?  This series is an introduction to some of the new Silverlight 5 features that I find interesting.  This is by no means an exhaustive list, but it’s some of my favorites.

So without further rambling….

On the first day of Silverlight, the team delivered to me… native multi-window support.


In Silverlight 4

But wait, didn’t we have windows in SL 4?  The answer is yes, sort of.  SL 4 had two different “window” types.  The SDK included a Popup control and the Toolkit included a ChildWindow.  While these gave the look and feel of actual child windows, they were nothing more than simulated windows (ie some XAML that looked like a window).  The draw back to both of these is that they were contained within the main Silverlight window.  So if you drag the child window out of the bounds of the main window, it gets clipped.  This prohibited things like multi-monitor  applications.

nativewindows

SL5 still has both of these controls, but the team gave us our first gift of adding a new native window control.

Silverlight 5 Window Control

The new Window control enables true multi-window support on both Windows and Max OS. It will generate a native OS window that exists outside of the main Silverlight window.  This allows windows to be positioned on different monitors, independently minimized, and individually selected. 

There are some security requirements.  The Window control can only be used in out-of-browser mode with elevated trust.  If you try to launch a Window control without these conditions set, you will get a security error.  It’s important to remember that if you are writing an application that will be ran in and out of the browser.

So let’s take a look at using the new Window class in action.  Start by creating a new Silverlight 5 application.  For this case, we don’t need to create a web application to go with it.

image

Once your project is created, you need to enable it to be ran out-of-browser:

image

Select the “Out-of-Browser Settings” button to enable elevated trust:

image

Now we can get down to creating our multi-window application.  To begin with, let’s start off with a Hello World type of example.  In our MainPage.xaml, let’s add a button with a Click event handler so we can perform some work.

    <Grid x:Name="LayoutRoot" Background="White">
        <Button Content="New Window"
                Width="75"
                Height="25"
                x:Name="btnNew"
                Click="btnNew_Click"/>
    </Grid>

Adding a few lines of code behind and we can launch of new window:

private void btnNew_Click(object sender, RoutedEventArgs e)
{
    var win = new Window();

    win.Show();

}

If we run the code, click the button, you get a new native window.  Ok, that its, we’re done.  Ok maybe we can cover a few more things.  Smile

The Windows class has a few properties that are worth looking at.  Here is a list of them with a description of each.

Content Gets/sets the root visual of the window
Height Gets/sets the height of the window
IsActive Gets whether the child window is active
IsVisible Gets whether the child window is visible
Left Gets/sets the left edge of the window
Title Gets/sets the title of the window
Top Gets/sets the top edge of the window
TopMost Gets/sets whether is window is always in front of other windows
Visibility Gets/sets the visibility property of the window
Width Gets/sets the width of the window
WindowState Gets/sets the state of the window: maximized, minimized, or normal
WindowStyle Gets/sets value the determines the appearance of the window

Most of the properties are fairly straight forward to follow.  Of note, being able to use the TopMost property comes in handy if you want to force the window to stay in front of the others.  WindowState gives you control on the state of the window.  As you would expect, Content allows you to set what gets displayed in the window.

WindowStyle is an interesting one.  By setting the property to WindowStyle.None, you remove all of the chrome from the window.  You can then format your window however you see fit.

Go check out Pete Brown’s blog for an in depth look at creating custom chrome for your window.

So that’s my 1st day of Silverlight item.  I have a few more posts to write about using native windows in more depth, so make sure you come back to check them out.  On to the 2nd day of Silverlight…

Series Navigation2nd Day of Silverlight: DataContextChanged >>

Leave a Reply