XAML - Popup



A Popup displays content on top of existing content, within the bounds of the application window. It is a temporarily display on other content. The hierarchical inheritance of Popup class is as follows −

Popup Hierarchy

Properties

Sr.No. Property & Description
1

Child

Gets or sets the content to be hosted in the popup.

2

ChildProperty

Gets the identifier for the Child dependency property.

3

ChildTransitions

Gets or sets the collection of Transition style elements that apply to child content of a Popup.

4

ChildTransitionsProperty

Identifies the ChildTransitions dependency property.

5

HorizontalOffset

Gets or sets the distance between the left side of the application window and the left side of the popup.

6

HorizontalOffsetProperty

Gets the identifier for the HorizontalOffset dependency property.

7

IsLightDismissEnabled

Gets or sets a value that determines how the Popup can be dismissed.

8

IsLightDismissEnabledProperty

Identifies the IsLightDismissEnabled dependency property.

9

IsOpen

Gets or sets whether the popup is currently displayed on the screen.

10

IsOpenProperty

Gets the identifier for the IsOpen dependency property.

11

VerticalOffset

Gets or sets the distance between the top of the application window and the top of the popup.

12

VerticalOffsetProperty

Gets the identifier for the VerticalOffset dependency property.

Events

Sr.No. Event & Description
1

Closed

Fires when the IsOpen property is set to false.

2

Opened

Fires when the IsOpen property is set to true.

Example

The following example shows how to use Popup control. Given below is the XAML code to create and iniliaze a Popup control and a CheckBox. When the user checks the CheckBox, it displays a Popup.

<Window x:Class = "XAMLPopup.MainWindow" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml"
   Title = "MainWindow" Height = "350" Width = "604">
	
   <Grid>
      <StackPanel> 
         <CheckBox Name = "PCheckBox" Margin = "10,10,484,500" Content = "Checked Me" Height = "18"/> 
			
         <Popup IsOpen = "{Binding ElementName = PCheckBox,Path = IsChecked}" 
            PlacementTarget = "{Binding ElementName = PCheckBox}"
            AllowsTransparency = "True" PopupAnimation = "Slide"
            HorizontalOffset = "150" VerticalOffset = "100">
			
            <Canvas Width = "100" Height = "100" Background = "LightGray" Margin = "5">
               <Canvas.RenderTransform> 
                  <RotateTransform x:Name = "theTransform" />
               </Canvas.RenderTransform> 
			
               <TextBlock TextWrapping = "Wrap" Foreground = "Blue" Text = "Hi, this is Popup"/>
            </Canvas> 
         </Popup>
      </StackPanel>
   </Grid> 
   
</Window>

When you compile and execute the above code, it will produce the following output −

Popup Output

We recommend you to execute the above example code and experiment with some other properties and events.

xaml_controls.htm
Advertisements