NativeScript Vue Pager issues with spacing, peaking and disable swipe

[dangrima90]

trafficstars

Hi I'm using the Pager in a NativeScript Vue application but I'm facing some problems with some of the component's properties. So far I've been testing on Android - using version 13.0.37.

1. Setting spacing and/or peaking does not render items properly on load

   <Pager
     for="item in list"
     height="100%"
     spacing="5%"
     peaking="10%"
     :showIndicator="true"
     :canGoRight="false"
     indicatorColor="white"
     indicatorSelectedColor="gray"
     :selectedIndex="selectedIndex"
   >
     <v-template>
       <StackLayout height="90%" :class="$index % 2 === 0 ? 'bg-yellow-300' : 'bg-forest-green-400'" />
     </v-template>
   </Pager>
   

   The above code sets spacing to 5% and peaking to 10%. Here's a video to show case the result - here the selected item is at index 2:

   https://user-images.githubusercontent.com/36479149/177291841-a7deaaae-cb10-4651-a6bf-175e5380e88a.mov

   You will notice that there is no space between the pager items - once you start swiping the space is then taken into consideration.

2. Setting canGoLeft / canGoRight to false doesn't seem to work

   The Pager in code and video show above has the canGoRight property set to false, however I am allowed to swipe to the right. Are there some other properties that should be set please?