Latest News

  • Silverlight Online Chat
    Jul 24, 2010

    Today we launch the new Silverlight Live Chat application demonstrating the Liquid RichTextBox and Emoticon replacements.

  • New Super Shoot Em Up 2 Game
    Jun 29, 2010

    Added to the Games section is the new Super Shoot 'Em Up 2 game. Take control of your tank with the aim to defeat the computer controlled opponents. Features all new weapons, levels and Battle Mode!

  • Silverlight 4 Controls V5.3.2 Released
    Jun 28, 2010

    This release contains several fixes raised in the forums.

  • New Sandmania Puzzle Game
    Jun 18, 2010

    Sandmania is the latest game from vectorlight, the aim of this game is to guide sand from the top of the screen to the various colored containers below.

  • New Moon Tower Defense Game
    May 29, 2010

    Added to the Games section is the new Moon Tower Defense game. Defend the Moon from the circling Aliens and Humans.

User Controls and the Popup Dialog

There are instances when it is desirable to set the content of a dialog control to a custom User Control, in the example below we show how to first create a custom user control and secondly to set it as the content source for a popup dialog:


Creating the User Control

The XAML here creates a simple login form consisting of username and password fields.

<UserControl x:Class="DialogUserControl.myUserControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="300" Height="50">
    <Grid x:Name="LayoutRoot">
        <Grid.RowDefinitions>
            <RowDefinition Height="25" />
            <RowDefinition Height="25" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="70" />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <TextBlock Grid.Row="0" Grid.Column="0" Text="Username:" HorizontalAlignment="Right" VerticalAlignment="Center" />
        <TextBox Grid.Row="0" Grid.Column="1" Width="150" Height="20" HorizontalAlignment="Left" VerticalAlignment="Center" />
        <TextBlock Grid.Row="1" Grid.Column="0" Text="Password:" HorizontalAlignment="Right" VerticalAlignment="Center" />
        <PasswordBox Grid.Row="1" Grid.Column="1" Width="150" Height="20" HorizontalAlignment="Left" VerticalAlignment="Center" />
    </Grid>
</UserControl>


As this is a very simple example there is no C# to write, your application will of course be more complex.  So next we have the main control that contains the Popup Dialog which has it's content set to the custom user control we created earlier:

<UserControl x:Class="DialogUserControl.Page"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:liquid="clr-namespace:Liquid;assembly=Liquid"
    xmlns:my="clr-namespace:DialogUserControl"
    Width="500" Height="500">
    <Canvas x:Name="LayoutRoot" Background="White" Width="500" Height="500">
        <liquid:Dialog x:Name="popup" Width="230" Height="110" Buttons="OK,Cancel" Title="Login" IsOpen="True" IsResizable="False" IsMaximizeEnabled="False" IsMinimizeEnabled="False">
            <my:myUserControl />
        </liquid:Dialog>
    </Canvas>
</UserControl>


The important line above is xmlns:my="clr-namespace:DialogUserControl", this allows you to refer to the custom User Control anywhere in your XAML.

Example User Control in a Popup Dialog:

A User Control in a Popup Dialog

Rate this page: 

1 Star 2 Star 3 Star 4 Star 5 Star
16 Ratings / 3.7 Average

Ultimate Gamers

  • 1 stig
  • 2 Gh0sT
  • 3 dhoz
  • 4 janso
  • 5 gaaslin
  • 6 RadiateLogic
  • 7 dan
  • 8 Haroldo
  • 9 bigblue531
  • 10 oussama

  • See the full chart here!

Silverlight Controls

  • Rich TextBox

    Create and edit rich content with this slick and expandable Rich TextBox...

  • TreeView

    This easy to use TreeView comes with drag and drop, sorting, searching and much more...

  • Context Menu

    You too can have cool popup context menus in your Silverlight applications...

  • Resizable Dialog

    Draggable and resizable popup dialogs are what serious Silverlight developers need...

  • Spell Checker

    Real-time spell checking in Silverlight? We did it first here...