Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member
Silverlight provides several windowing solutions. In this movie I'll look at the ChildWindow class. Later you'll see how to create a native operating system window. For this demonstration, I'm using Visual Studio in a project called ShowingChildWindows. Adding a child window to a project is easy. I'll go to my project and right- click on it in the Solution Explorer and choose Add > New Item. Then I'll select Silverlight Child Window, and I think I'm going to call this one PrintDialog. The idea is that would ask the user for the number of copies they want to print. Click Add.
You can see that I get a title bar, a Close button in the upper right-hand corner, and an OK and a Cancel button. And I also get an area where I can add any Silverlight content that I would like. Now to show this dialog, I need to write two lines of code. I'll do that in MainPage.xaml, in this Show Child Window button. I'll double-click on this button to stub in the code, and then I'm going to say var child = new PrintDialog, which is the class I just created.
And then to show the Child window, I say child.Show. I said it was easy. Now let's run the application and see what it looks like. I'll press F5, and then I'll click on this button, and there's my PrintDialog. The Child Window floats over the existing Silverlight application. It is contained within the boundaries of the application. If I unmaximize this window and drag the dialog around, now you can see that it is inside the boundaries of the Silverlight application. I'll maximize it.
It is also modal, which means that I cannot change focus to the main window without dismissing the child Window. If I try to click on these buttons, I'm not permitted to do that. I have to dismiss the dialog by clicking on the Close button or the OK or Cancel button. There are a few properties that are interesting to look at. I'll go back to PrintDialog.xaml and then up here in the controls area, I'm going to add some properties. I'm going to clean up my code layout a little bit. I'll do a Ctrl+K, Ctrl+D to rearrange my XAML according to the formatting rules, and then here I'll say OverlayBrush =. I'm going to choose an Orange brush.
This is the color of the overlay that's between my child window and the Silverlight application. And then I can choose the transparency level of this overlay with the OverlayOpacity and do .7 for 70%. I can also customize the title. Currently, it's a string. I'll show you in a few minutes how to customize it with your own elements. Press F5 to run the application, and now you can see I have a fairly opaque orange background. For customization purposes, I already have this FinishedChildWindow example.
In my XAML, you can see that I'm using the property element syntax ChildWindow.Title to define a customized header. Within my header I have a Stackpanel with an image and a text block. I'm also no longer hard- coding the opacity level. I'm doing the binding to another element on this page which is called the overlayslider, here. It looks like this. Here's my nice header, and then I can control how opaque or transparent is the overlay.
This kind of shows you the range of colors that you can have for the background. The child window has all the basics for showing a dialog. If you want to customize the return values--in other words you don't want to just have an OK or Cancel and you want to read these information here like these radio button values--you need to add your own properties. That's the topic of the next movie.
Get unlimited access to all courses for just $25/month.Become a member
82 Video lessons · 101382 Viewers
61 Video lessons · 88140 Viewers
71 Video lessons · 71971 Viewers
56 Video lessons · 103796 Viewers
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.
Your file was successfully uploaded.