77342

ScrollViewer: Disable Snap (elastic band effect)

Question:

I have a ScrollViewer on my MainPage that contains all other elements (except the AppBars of course). Scrolling works fine, but I want to disable the snap behavior (you drag the whole page to the left, release it and it will snap back). See the image (Background of ScrollViewer: Black, Background of Grid: White). So how can I disable this behavior? Also known as overscroll or bounce effect.

I just found out about <em>IsScrollInertiaEnabled</em>, but setting this to false doesn't help.

<ScrollViewer VerticalScrollMode="Disabled" VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Visible" ZoomMode="Disabled" HorizontalSnapPointsType="None" VerticalSnapPointsType="None" ZoomSnapPointsType="None"> <VisualStateManager>...</VisualStatemanager> <Grid Style="{StaticResource LayoutRootStyle}"> <Grid.RowDefinitions> <RowDefinition Height="140"/> <RowDefinition Height="*"/> </Grid.RowDefinitions> <!-- Back button and page title --> ... <!-- My content grid --> </Grid> </ScrollViewer>

<img alt="enter image description here" class="b-lazy" data-src="https://i.stack.imgur.com/f1xvO.jpg" data-original="https://i.stack.imgur.com/f1xvO.jpg" src="https://etrip.eimg.top/images/2019/05/07/timg.gif" /><img alt="enter image description here" class="b-lazy" data-src="https://i.stack.imgur.com/YKpOM.jpg" data-original="https://i.stack.imgur.com/YKpOM.jpg" src="https://etrip.eimg.top/images/2019/05/07/timg.gif" />

Answer1:

Sorry misunderstood what you meant.. Post some additional xaml if you can.. scrollviewer container xaml might help

try something like this

<Grid Style="{StaticResource LayoutRootStyle}"> <Grid.RowDefinitions> <RowDefinition Height="140"/> <RowDefinition Height="*"/> </Grid.RowDefinitions> <!-- Back button and page title --> ... <!-- My content grid --> <ScrollViewer Grid.Row="1" VerticalScrollMode="Disabled" VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Visible" ZoomMode="Disabled" HorizontalSnapPointsType="None" VerticalSnapPointsType="None" ZoomSnapPointsType="None"> // put your content here directly or in a grid </ScrollViewer> <VisualStateManager>...</VisualStatemanager> </Grid>

Answer2:

To solve the problem set height of the object inside the scroll viewer, let say.. if you have a stack panel, set the Height="2000" or else... and DONE. Note: Don't put any height in scroll viewer.

Answer3:

I have other suggestion, i have faced similar problem, but i wanted to disable bounce, when only 1 element is in flipview.

So i did this:

Created a TemplatedControl:

CustomFlipView and it inherited from FlipView:

public sealed class CustomFlipView : FlipView

Next, i edited the FlipViewStyle to get the style code of FlipView ( yea, that big one ).

And copy-pasted into the Generic.xaml, into generated

<Style TargetType="local:CustomFlipView">

So this gives me an opportunity to add names to such xaml controls, that by default are not named.

I have added a name to ItemsPresenter:

<ScrollViewer x:Name="ScrollingHost" AutomationProperties.AccessibilityView="Raw" BringIntoViewOnFocusChange="{TemplateBinding ScrollViewer.BringIntoViewOnFocusChange}" HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}" HorizontalSnapPointsType="MandatorySingle" HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" IsTabStop="False" IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}" IsHorizontalScrollChainingEnabled="{TemplateBinding ScrollViewer.IsHorizontalScrollChainingEnabled}" IsVerticalScrollChainingEnabled="{TemplateBinding ScrollViewer.IsVerticalScrollChainingEnabled}" IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}" IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}" Padding="{TemplateBinding Padding}" TabNavigation="{TemplateBinding TabNavigation}" VerticalSnapPointsType="MandatorySingle" VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}" VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}" ZoomMode="Disabled"> <ItemsPresenter x:Name="FlipViewItemsPresenter"/> </ScrollViewer>

Next in the code of CustomFlipView i did this:

public sealed class CustomFlipView : FlipView //this line is indented. { private ItemsPresenter itemsPresenter; public CustomFlipView() { this.DefaultStyleKey = typeof(CustomFlipView); } protected override void OnApplyTemplate() { base.OnApplyTemplate(); itemsPresenter = GetTemplateChild("FlipViewItemsPresenter") as ItemsPresenter; FixateItems(); } protected override void OnItemsChanged(object e) { base.OnItemsChanged(e); FixateItems(); } private void FixateItems() { if (itemsPresenter != null) { if (this.Items.Count < 2) { itemsPresenter.ManipulationMode = ManipulationModes.None; } else { itemsPresenter.ManipulationMode = ManipulationModes.System; } } } }

Hope this could give you a hint.

Recommend

  • Lazy loading with wpf Data Grid
  • Error Handling in System.Net.HttpWebRequest::GetResponse()
  • Tkinter Grid Columnspan ignored
  • WPF ListBox scrollbar is not working
  • WPF c# Listbox external scrollbuttons
  • C# Windows Phone 7 ListBox Scrolling Up / Down event?
  • R add index column to data frame based on row values
  • How can I determine the author of a block of code programmatically in TFS?
  • How to start server for Selenium grid Java Maven setup
  • Allocating a 2D contiguous array within a function
  • How to convert WPF project so it can be used as a class library by a separate exe
  • Android Lock Screen C# .NET Replica
  • ckeditor and jquery UI dialog not working
  • Dynamically load css stylesheet and wait for it to load
  • Most efficient way to move table rows from one table to another
  • WP8.1 AppBarButton holding event
  • calculate gradient output for Theta update rule
  • How does document.ready work with angular element directives?
  • How do I alternate colors in Flat List (React Native)
  • Listbox within Listbox and scrolling trouble in Windows Phone 7 Silverlight
  • MongoDB in PHP using aggregate to group by _id is null not working
  • Lost migrations and Azure database is now out of sync
  • Display issues when we change from one jquery mobile page to another in firefox
  • Getting last autonumber in access
  • DotNetZip - Calculate final zip size before calling Save(stream)
  • Is there a amazon webstore API for customers?
  • How to limit post in wp_query
  • To display the title for the current loaction in map in iphone
  • jquery mobile loadPage not working
  • Do create extension work in single-user mode in postgres?
  • Warning: Can't call setState (or forceUpdate) on an unmounted component
  • Unanticipated behavior
  • AngularJs get employee from factory
  • trying to dynamically update Highchart column chart but series undefined
  • Load html files in TinyMce
  • Free memory of cv::Mat loaded using FileStorage API
  • Memory offsets in inline assembly
  • Can Visual Studio XAML designer handle font family names with spaces as a resource?
  • Turn off referential integrity in Derby? is it possible?
  • jQuery Masonry / Isotope and fluid images: Momentary overlap on window resize