How to make SwipeNavigate scroll faster

How-to Discussions
1

Hello! How can I make SwipeNavigate scroll faster? In the following example the navigation is slow scrolling one by one and it takes forever to navigate to the last item.

<App>
  <JavaScript>

    var Observable = require("FuseJS/Observable");

    var items = new Observable();

    for (i = 2018; i > 1950; i--) {items.add({name : i});}

    module.exports = {
			items: items
    };

  </JavaScript>
  <Panel Background="Blue" Height="50%" ClipToBounds="True" Alignment="Bottom">
    <LinearNavigation>
			<NavigationMotion />
		</LinearNavigation>
		<SwipeNavigate SwipeDirection="Up" />
    <Each Items="{items}">
      <Panel Width="100%" Height="30" Background="Red" Alignment="Center" ux:Name="_option">
        <Text TextAlignment="Center" Alignment="Center">{name}</Text>
        <EnteringAnimation Scale="0.1">
          <Move Y="-10" RelativeTo="Size" Easing="QuadraticOut" />
        </EnteringAnimation>
        <ExitingAnimation Scale="0.1">
          <Move Y="10" RelativeTo="Size" Easing="QuadraticOut" />
        </ExitingAnimation>
        <WhileActive>
          <Change _option.Background="#FFFFFF" />
        </WhileActive>
      </Panel>
    </Each>
  </Panel>
</App>
2

Figured this one out by using a shorter LengthNode for the SwipeNavigate:

<App>
  <JavaScript>

    var Observable = require("FuseJS/Observable");

    var items = new Observable();

    for (i = 2018; i > 1950; i--) {items.add({name : i});}

    module.exports = {
			items: items
    };

  </JavaScript>
  <DockPanel Width="100%" Height="5%" ux:Name="lengthNode" />
  <DockPanel Width="100%" Height="100%">
    <Panel Background="Blue" Height="50%" ClipToBounds="True" Alignment="Bottom">
      <LinearNavigation>
  			<NavigationMotion />
  		</LinearNavigation>
  		<SwipeNavigate SwipeDirection="Up" LengthNode="lengthNode" />
      <Each Items="{items}">
        <Panel Width="100%" Height="30" Background="Red" Alignment="Center" ux:Name="_option">
          <Text TextAlignment="Center" Alignment="Center">{name}</Text>
          <EnteringAnimation Scale="0.1">
            <Move Y="-10" RelativeTo="Size" Easing="QuadraticOut" />
          </EnteringAnimation>
          <ExitingAnimation Scale="0.1">
            <Move Y="10" RelativeTo="Size" Easing="QuadraticOut" />
          </ExitingAnimation>
          <WhileActive>
            <Change _option.Background="#FFFFFF" />
          </WhileActive>
        </Panel>
      </Each>
    </Panel>
  </DockPanel>
</App>