Change the Menu Position
When used as a context menu, the default position of the RadRadialMenu is determined by the Point returned by the GetMenuPosition method of the RadialMenuTriggerBehavior class. To change the menu position you have to create a class that inherits from the RadialMenuTriggerBehavior class and override its methods to implement custom logic defining where the context menu will appear.
This example demonstrates how you can position the menu at custom location.
First, create a class that inherits from the RadialMenuTriggerBehavior class and override its GetMenuPosition method. You also have to set the AttachTriggers property to specify what event will attach the menu to the target element.
You can access the RadRadialMenu control through an alias pointing to the Telerik.UI.Xaml.Controls.Navigation namespace: xmlns:navigation="using:Telerik.UI.Xaml.Controls.Navigation"
Example 1: Custom RadialMenuTriggerBehavior
public class CustomPositionTriggerBehavior : RadialMenuTriggerBehavior
{
public CustomPositionTriggerBehavior()
{
this.AttachTriggers = RadialMenuAttachTriggers.PointerPressed;
}
protected override Windows.Foundation.Point GetMenuPosition(RadRadialMenu menu)
{
//get the left top point of the target element
var targetPosition = this.Owner.TransformToVisual(null).TransformPoint(new Point(this.Owner.ActualWidth, 0));
//calulate the desired menu position
var position = new Point(targetPosition.X - 120 + this.Owner.ActualWidth / 2, targetPosition.Y - 120);
return position;
}
}Then set the attached RadRadialContextMenu properties to the target element.
Example 2: Set the Behavior Property
<TextBlock Text="Some text">
<navigation:RadRadialContextMenu.Menu>
<navigation:RadRadialMenu Width="240"/>
</navigation:RadRadialContextMenu.Menu>
<navigation:RadRadialContextMenu.Behavior>
<local:CustomPositionTriggerBehavior/>
</navigation:RadRadialContextMenu.Behavior>
</TextBlock>This is the result:
