Skip to content

Popup Placement

Jan-Niklas Schäfer edited this page Sep 20, 2016 · 1 revision

The location for each step's popup can be defined in XAML using attached properties of the class TourHelper. The properties can be attached to any UIElement.

The following code example marks a TabItem to be usable by the FeatureTour component:

<TabItem Header="Variables"
    tour:TourHelper.ElementID="Variables"
    tour:TourHelper.Placement="BottomCenter">
    <!--Content -->
</TabItem>`

ElementID attaches an ID to the UIElement. That ID is used by the FeatureTour component to identify an UIElement for a specific step.

The Placement property defines the placement of the popup relative to the associated UIElement.

Supported placements are:

Center (popup is displayed without arrows)
TopLeft, TopCenter, TopRight
LeftTop, LeftCenter, LeftBottom
BottomLeft, BottomCenter, BottomRight
RightTop, RightCenter, RightBottom
Clone this wiki locally