Search code examples
wpftelerikpopupsurface-pro

Telerik RadRibbonView pops up RadRibbonTab nested objects to the left in Surface Pro


Got an interesting issue that only affects the code on a Surface Pro 3. When running a telerik control for a RadRibbonView and then having it minimized the popup will open to the very left of the screen. This behavior does not happen on a desktop and works just clipping below the RadRibbonTab. On a Surface Pro 3 it works fine when the View is not minimized but when minimized it behaves badly. I was thinking of investigating more on what could be causing this and was following some of the tutorials on Telerik: https://docs.telerik.com/devtools/wpf/controls/radribbonview/features/ribbon-controls/ribbon-window-wpf. In my example XAML shown it is using their RadRibbonWindow but a Window top level will create this problem as well. I will most likely contact Telerik as well but was curious if anyone on Stack Overflow has seen this and known how to deal with it.

<telerik:RadRibbonWindow x:Class="TelerikTesting.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:TelerikTesting"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <telerik:RadRibbonView x:Name="RibbonView" IsMinimizable="True" IsMinimized="True" MinimizeButtonVisibility="Visible" 
                           PopupOpened="RadRibbonView_PopupOpened">
        <telerik:RadRibbonView.Items>
            <telerik:RadRibbonTab Header="Home">
                <telerik:RadRibbonGroup Header="HomeContent" >
                </telerik:RadRibbonGroup>
            </telerik:RadRibbonTab>
            <telerik:RadRibbonTab Header="View" />
        </telerik:RadRibbonView.Items>
    </telerik:RadRibbonView>
</telerik:RadRibbonWindow>

Well this should not be happening.

enter image description here

Works fine when docked and not minimized enter image description here


Solution

  • Telerik posted a response and it is essentially the default behavior of Tablet Devices that is causing the problem. You can fix it by changing the OS behavior directly or in code that you hook up to fire on a constructor. Either way it seems to easily solve the issue on Surface Pro 3 and I am guessing other tablet devices as well.

    From Telerik:

    'The described behavior is caused by the settings of the window's popups. The popups in the Windows OS are rendered in different directions based on the Handedness setting. You can verify it by going to your Windows settings: ControlPanel->Tablet PC Settings. If the handedness is set to "Left-handed", which is the default value in the most version of the OS, the popup menus will be rendered from right to left of their target element. In other words, the popup with the RadRibbonView's content will be position correctly. On the other hand, the "Right-handed" setting will draw the popups from right to left.

    You can try changing the Handedness to "Left-handed" and see if this resolves the issue. Another workaround which can try is using code. Basically, you can change the value of the SystemParameters.MenuDropAlignment property. You can use the following method to achieve this:

    public static void SetAlignment()
    {
        var ifLeft = SystemParameters.MenuDropAlignment;
    
        if (ifLeft)
        {
            // change to false
            var t = typeof(SystemParameters);
            var field = t.GetField("_menuDropAlignment", BindingFlags.NonPublic | BindingFlags.Static);
            field.SetValue(null, false);
    
            ifLeft = SystemParameters.MenuDropAlignment;
        }
    }
    

    '

    I just hooked up the code method given to my constructor of the view in the code behind and it worked just fine.