C# wpf scrollviewer not working like windows store app

Question

I'm currently working on an application using WPF. And I can't but help to notice the difference in ScrollViewer functionality compared to the Windows Store App variant.

When I'm at the edge of the screen and the edge of a ScrollViewer and I want to slide so that I'd move away from the edge. I see the windows desktop or menubar (when at the bottom of the screen). Is there a solution to prevent this scroll behaviour from happening? It is rather annoying (and ugly!) when your scrolling till the edge of the screen and then get bumped back and see a bit of the windows platform underneath. This behaviour is fixed in the Windows Store App ScrollViewer..

I tried overwriting the ScrollChanged and checking if f.e. horizontalOffset == 0 && horizontalChange < 0 and return if this is the case. But this check doesn't seem to work (since then it's probably already too late). And I can't seem to find the way Windows Store Apps have fixed this.

enter image description here

Perhaps you guys have an idea?

EDIT: Reproduction for WPF projects in .NET 4.5.1

This piece of XAML re-creates my problem in WPF. However in Windows Store App the problem doesn't seem to exist.

How can I prevent this behaviour when scrolling to and/or over the edges of my application?

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525" ResizeMode="NoResize" WindowState="Maximized" WindowStyle="None">
    <Grid>
        <ScrollViewer HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Hidden" PanningMode="Both">
            <Rectangle Height="2500" Stroke="Black" Width="3500" HorizontalAlignment="Left" VerticalAlignment="Top">
                <Rectangle.Fill>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0,0.5">
                        <GradientStop Color="#FF00FF68" Offset="0"/>
                        <GradientStop Color="Red" Offset="1"/>
                        <GradientStop Color="#FF95FF00" Offset="0.506"/>
                    </LinearGradientBrush>
                </Rectangle.Fill>
            </Rectangle>
        </ScrollViewer>

    </Grid>
</Window>

Could you maybe provide a screenshot of the behaviour you describe? — Dutts
@Richard updated for clarification. To the left you see the edge of my application. And it automagically spawns this horrific menubar as well. Both behaviours are unwanted and both are only happening in WPF and not Windows Store Apps. — Totumus Maximus
Ah I see what you are talking about, what is the value of WindowState for your app? — Dutts
@Richard WindowsState = "Maximised" -- ResizeMode = "NoResize" -- WindowStyle = "None" — Totumus Maximus
@Sheridan That is not the issue here. It's not even the TaskBar that is the issue (it's not even on autohide on my OS). The ScrollViewer of WPF cause these to show when you are scrolling of your application. Look at the left side of the image. You see the edge of my application and a light blue bar (the actual edge) and to the left of that is (a part of) the windows desktop that I'm using. — Totumus Maximus

Etienne Maheu Etienne Maheu · Accepted Answer · 2014-03-26T16:17:57

This is the default Windows 8 behavior related to scrolling. Your entire app will "bounce" when hitting the edge of a scroll-able view. This happens in every single cases and is part of the system animations. You can see it, for instance, in the Windows Explorer when in a long list of folders. This only happens when scrolling through touch and, if I remember correctly, on non full-screen applications. I do not currently have access to a Windows 8 machine to test this claim ~~and there might very well be no way to disable this behavior~~.

The Modern environment is a completely separate application environment and does not handle touch gestures in the same way at all. This is why this behavior does not exists in a WinRT application.

EDIT : This effect is called the Manipulation Boundary Feedback. It triggers when a manipulation event goes beyond the limits of its container. You can disable it overriding the OnManipulationBoundaryFeedback(ManipulationBoundaryFeedbackEventArgs) method on the affected UIElement like so:

class NoTouchFeedbackWindow : Window
{
    protected override void OnManipulationBoundaryFeedback(ManipulationBoundaryFeedbackEventArgs e)
    {
        e.Handled = true;
    }
}

This could also be done directly on your ScrollViewer or any control up the chain.

You can find more information about this behavior on:

Hopefully, this should solve your issue.

C# wpf scrollviewer not working like windows store app

1 Answers