How to make SwipeNavigate more sensitive/tolerance and make closer to ScrollBar behavior?

How-to Discussions
1
Several issues:
  • On iOS device swipe from bottom to down not work properly relative from down to bottom;
  • I can’t swipe several items with large swipe velocity. MaxPages and VelocityThreshold not helped.
  • I can’t control swipe’s tolerance / sensetive. Move SwipeNavigate to child for refer NodeLength to child’s bound not helps because I want affect scroll touch on over the panel area, not only for children.
Code for example:
<Panel HitTestMode="LocalBoundsAndChildren" Color="#356">
    <LinearNavigation>
        <NavigationMotion
            GotoDuration="0.15"
            Overflow="Elastic"
            OverflowExtent="20"
            GotoType="SmoothSnap"
            SnapType="SmoothSnap"
        />
    </LinearNavigation>
    <SwipeNavigate ForwardDirection="Down" AllowedDirections="Both" MaxPages="10" VelocityThreshold="0"/>
        <Each Count="10">
            <Rectangle
                CornerRadius="10"
                Height="190"
                Width="190"
                Color="#ec9">
                <EnteringAnimation Scale="0.5">
                    <Scale Factor="0.5"/>
            	    <Move Y="-2" RelativeTo="Size"/>
            	</EnteringAnimation>
            	<ExitingAnimation Scale="0.5">
                    <Scale Factor="0.5"/>
            		<Move Y="2" RelativeTo="Size"/>
            	</ExitingAnimation>
            </Rectangle>
        </Each>
</Panel>
2

Up

3

  • Is a particular swipe direction not working for you? Is that what you first commnt means?

  • Swiping through multiple items only works if the user swipes far enough. The velocity, after pointer release, will not keep scrolling through items. This type of behaviour is something we still need to work on.

  • SwipeNavigate.LengthNode should not alter where the pointer is being captured. You should be able to put the SwipeNavigate in a parent not and set LengthNode to a child.

4

About first point. On iOS device sometimes swipes from bottom to up not triggered, especially if we do it fast. But opposite direction works properly. It happens only on device.

“SwipeNavigate.LengthNode should not alter where the pointer is being captured. You should be able to put the SwipeNavigate in a parent not and set LengthNode to a child.”

It’s not works for this code. Nothing happens

<LinearNavigation/>
<SwipeNavigate ForwardDirection="Down" LengthNode="{resource}" AllowedDirections="Both" MaxPages="10"/>
<Each Items="{Property Items}">
   <Deferred>
      <Panel
         ux:Name="{resource}"
         Width="180"
         Height="180"
      >
            <!-- Custom transform animation for EnteringAnimation/ExitingAnimation-->
      </Panel>
   </Deferred>
</Each>
5

I’ll look into the upward swipe on iOS.

For the LengthNode you can’t refer to nodes within an Each block this way. The node must have a ux:Name to be referenced. But since you’re using a fixed height, you can create some arbitrary panel with the same height and use it as the LengthNode.

6

Did you mean this approach?

<SwipeNavigate LengthNode="refSwipeNode"/>
<Panel Width="180" Height="180" ux:Name="refSwipeNode">
<Each Items="{Property Items}">
   <Deferred>
      <Panel
         ux:Name="{resource}"
         Width="180"
         Height="180"
      >
      </Panel>
   </Deferred>
</Each>