# Page control - swipe only one slide at a time

**URL:** <https://forums.fusetools.com/t/page-control-swipe-only-one-slide-at-a-time/3213>\
**Category:** How-to Discussions\
**Created:** [October 18, 2017, 11:45am UTC](https://forums.fusetools.com/t/page-control-swipe-only-one-slide-at-a-time/3213 "2017-10-18T11:45:40Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![mircea](https://avatars.discourse-cdn.com/v4/letter/m/22d042/32.png) [@mircea](https://forums.fusetools.com/u/mircea)\
**Post date:** [October 18, 2017, 11:45am UTC](https://forums.fusetools.com/t/page-control-swipe-only-one-slide-at-a-time/3213/1 "2017-10-18T11:45:40Z")

</div>

Hi.  
I’m using a PageControl with multiple slides. Is there a way to force it to only swipe one item at a time?

Right now if someone swipes just the right (or wrong?) way, he can swipe two slides in one move.

---

<div class="post-metadata">

**Author:** ![Uldis](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/uldis/32/657_2.png) [@Uldis](https://forums.fusetools.com/u/Uldis)\
**Post date:** [October 18, 2017, 3:07pm UTC](https://forums.fusetools.com/t/page-control-swipe-only-one-slide-at-a-time/3213/2 "2017-10-18T15:07:47Z")

</div>

That should not be possible. You’ll need to show some code in a minimal reproduction.

---

<div class="post-metadata">

**Author:** ![mircea](https://avatars.discourse-cdn.com/v4/letter/m/22d042/32.png) [@mircea](https://forums.fusetools.com/u/mircea)\
**Post date:** [October 19, 2017, 11:46am UTC](https://forums.fusetools.com/t/page-control-swipe-only-one-slide-at-a-time/3213/3 "2017-10-19T11:46:43Z")

</div>

Here is a simple code that can be used to replicate the issue:

```auto
<App>
<JavaScript>
	var slides = [0,1,2,3,4,5,6,7];
	module.exports.slides = slides;
</JavaScript>
<DockPanel>
	<PageControl ClipToBounds="true">
		<Each Items="{slides}">
			<Panel>
				<Text FontSize="30" Alignment="Center" Value="{}"/>
				<Rectangle Layer="Background">
					<Stroke Width="2" Color="#f00"/>
				</Rectangle>
			</Panel>
		</Each>
	</PageControl>
</DockPanel>
</App>

```

But the problem seems to be with the interaction itself (drag a slide hard enough and the page control will swipe 2 slides or even more).  
Here is a video that hopefully illustrates the issue

[https://www.dropbox.com/s/p5d7nw8rzazq2ux/20171019\_124206.mp4?dl=0](https://www.dropbox.com/s/p5d7nw8rzazq2ux/20171019_124206.mp4?dl=0)

You can see me going from slide 1 to 3 in one single motion/swipe.

---

<div class="post-metadata">

**Author:** ![Uldis](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/uldis/32/657_2.png) [@Uldis](https://forums.fusetools.com/u/Uldis)\
**Post date:** [October 19, 2017, 1:00pm UTC](https://forums.fusetools.com/t/page-control-swipe-only-one-slide-at-a-time/3213/4 "2017-10-19T13:00:24Z")

</div>

Tried that code, couldn’t get it to overscroll a single page in one swipe motion. There is a bit of overflow if I scroll really enthusiastically, because that’s how the default `NavigationMotion` for a `PageControl` works.

You might try doing this, and then tweak the settings on [NavigationMotion](https://www.fusetools.com/docs/fuse/motion/navigationmotion) to make it behave exactly like you need:

```auto
<App>
<JavaScript>
    var slides = [0,1,2,3,4,5,6,7];
    module.exports.slides = slides;
</JavaScript>
<DockPanel>
    <PageControl ClipToBounds="true">
        <NavigationMotion GotoType="SmoothSnap" />
        <Each Items="{slides}">
            <Panel>
                <Text FontSize="30" Alignment="Center" Value="{}"/>
                <Rectangle Layer="Background">
                    <Stroke Width="2" Color="#f00"/>
                </Rectangle>
            </Panel>
        </Each>
    </PageControl>
</DockPanel>
</App>

```

Hope this helps!

---

<div class="post-metadata">

**Author:** ![mircea](https://avatars.discourse-cdn.com/v4/letter/m/22d042/32.png) [@mircea](https://forums.fusetools.com/u/mircea)\
**Post date:** [October 19, 2017, 1:28pm UTC](https://forums.fusetools.com/t/page-control-swipe-only-one-slide-at-a-time/3213/5 "2017-10-19T13:28:36Z")

</div>

`SmoothSnap` is what I already used in my full project and it didn’t prevent the issue (so I can stil replicate it even with using your code above). However I think I realized what the problem is: I have a very high sensitivity for my mouse, so when I test in the desktop emulator this is what might be causing the problem.

I tried previewing it now on a phone and it does not happen at all no matter how hard I swipe, so it looks like this is not a real problem.

---

<div class="post-metadata">

**Author:** ![Uldis](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/uldis/32/657_2.png) [@Uldis](https://forums.fusetools.com/u/Uldis)\
**Post date:** [October 19, 2017, 1:31pm UTC](https://forums.fusetools.com/t/page-control-swipe-only-one-slide-at-a-time/3213/6 "2017-10-19T13:31:15Z")

</div>

Alright, that might explain. Will mark this as resolved now 🙂