How to: Position a Popup
This set of examples shows how to use the placement properties to specify the position of a Popup control.
Example
You can determine the position of a Popup control by using the following properties:
The first four properties define a two-dimensional coordinate on the screen. The fifth property, Placement, positions the Popup and also defines its behavior if its content overlaps the screen boundaries.
Use a PlacementMode enumeration value to set the Placement property. For more information about the enumeration values for PlacementMode, see How to: Set the Placement Property for a Popup or Tooltip.
The following illustrations show how the placement properties work together to position a Popup control.
Popup placement by using the Placement property
.png)
Popup placement by using the Placement and PlacementRectangle properties
.png)
Popup placement by using the Placement, PlacementRectangle, and Offset properties
.png)
The following example shows how to set these Popup properties. For the complete sample, see Popup Position Sample.
<Popup Name="myPopup"
PlacementTarget="{Binding ElementName = myEllipse}"
PlacementRectangle="0,0,30,50"
VerticalOffset="20"
HorizontalOffset="20"
Placement="Bottom"
PopupAnimation="Fade"
AllowsTransparency="True">
<TextBlock Name="PopupContent"
Background="Beige"
FontSize="12"
Width="75"
TextWrapping="Wrap">
Popup Text
</TextBlock>
</Popup>
Popup myPopup = new Popup();
myPopup.PlacementTarget = myEllipse;
myPopup.PlacementRectangle = new Rect(0, 0, 30, 50);
myPopup.VerticalOffset = 20;
myPopup.HorizontalOffset = 20;
myPopup.Placement = PlacementMode.Bottom;
myPopup.PopupAnimation = PopupAnimation.Fade;
myPopup.AllowsTransparency = true;
TextBlock popupText = new TextBlock();
popupText.Background = Brushes.Beige;
popupText.FontSize = 12;
popupText.Width = 75;
popupText.TextWrapping = TextWrapping.Wrap;
myPopup.Child = popupText;
See Also
Tasks
How to: Set the Placement Property for a Popup or Tooltip