#868 – A Popup Stays Open By Default

You make a Popup control visible by setting its IsOpen property to true.  By default, the popup will then stay open until you set the IsOpen property back to false.

You can also set the popup’s StaysOpen property to false, which causes the popup to close as soon as the user clicks anywhere else in the application (outside of the popup’s boundaries).

In the example below, we set IsOpen to true in a MouseEnter event handler.  But we’ve set StaysOpen to false so that the popup automatically closes whenever we click on something outside of the popup’s boundaries.

    <StackPanel Margin="15" Orientation="Horizontal">
        <Button Content="Learn About Caesar"
            Margin="5" Padding="10,5"
            VerticalAlignment="Center"/>
        <TextBlock Text="?" FontWeight="Bold" FontSize="24"
               VerticalAlignment="Center"
               MouseEnter="question_MouseEnter"/>
        <Popup Name="popCaesar" IsOpen="False" StaysOpen="False">
            <Border BorderBrush="Blue" BorderThickness="1"
                Background="AliceBlue">
                <StackPanel Orientation="Horizontal">
                    <Image Source="Caesar.jpg" Height="100"/>
                    <TextBlock Text="Julius Caesar was a Roman emperor who lived from 100 BC to 44 BC"
                            Margin="10"
                            Width="150" TextWrapping="Wrap"/>
                </StackPanel>
            </Border>
        </Popup>
    </StackPanel>

868-001
868-002

About Sean
Software developer in the Twin Cities area, passionate about .NET technologies. Equally passionate about my own personal projects related to family history and preservation of family stories and photos.

3 Responses to #868 – A Popup Stays Open By Default

  1. Pingback: Dew Drop – July 22, 2013 (#1,589) | Alvin Ashcraft's Morning Dew

  2. Pingback: Promoting Dev Skills Featured In The Daily Six Pack: July 23, 2013

  3. Rohail Iqbal says:

    Very nice tutorial. Thanks

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: