# Swipe Gesture Help

**URL:** <https://forums.fusetools.com/t/swipe-gesture-help/5313>\
**Category:** How-to Discussions\
**Created:** [August 22, 2016, 7:08am UTC](https://forums.fusetools.com/t/swipe-gesture-help/5313 "2016-08-22T07:08:03Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![danbar](https://avatars.discourse-cdn.com/v4/letter/d/bc8723/32.png) [@danbar](https://forums.fusetools.com/u/danbar)\
**Post date:** [August 22, 2016, 7:08am UTC](https://forums.fusetools.com/t/swipe-gesture-help/5313/1 "2016-08-22T07:08:03Z")

</div>

Ok, so I have a situation here. Here’s what I got. (I’ve trimmed out most of the code)

```auto
<JavaScript>
  var Observable = require('FuseJS/Observable');
  var items = Observable(
    { title: 'Foo' },
    { title: 'Bar' },
    { title: 'Baz' }
  );

  module.exports = {
    items: items
  };
</JavaScript>

<ScrollView>
  <StackPanel>
    <Each Items="{items}">
      <Panel ux:Name="itemNode" Color="#fff" Padding="10">
        <!-- Swipe -->
        <SwipeGesture ux:Name="swipeItem" Direction="Left" LengthNode="itemNode" Type="Active" />
        <SwipingAnimation Source="swipeItem">
          <Move X="-0.8" RelativeTo="Size" Duration="0.5" />
        </SwipingAnimation>

        <Panel Alignment="VerticalCenter">
          <Text Value="{title}" FontSize="13" TextColor="#555" />
        </Panel>
      </Panel>
    </Each>
  </StackPanel>
</ScrollView>

```

  
Oh yeah! Swiping works as expected.  
  
Oh no! What I want to achieve is, when the user swipes another item, I want the "previous swiped" item to close back. How do I go about doing this? I greatly appreciate anyone who can help me with this. Thanks!

---

<div class="post-metadata">

**Author:** ![Remi\_Pedersen](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/remi_pedersen/32/432_2.png) [@Remi\_Pedersen](https://forums.fusetools.com/u/Remi_Pedersen)\
**Post date:** [August 23, 2016, 7:59am UTC](https://forums.fusetools.com/t/swipe-gesture-help/5313/2 "2016-08-23T07:59:29Z")

</div>

The swipe status is controlled by the `IsActive` property of the `SwipeGesture`, so you can manipulate that. Here I simply iterate over all the items and reset them all except the currently active one:

```auto
<App>
    <JavaScript>
      var Observable = require('FuseJS/Observable');
      var items = Observable(
        { title: 'Foo', active: Observable(false) },
        { title: 'Bar', active: Observable(false) },
        { title: 'Baz', active: Observable(false) }
      );

      function resetSwipe(arg){
        for(i=0; i<items.length; i++){
            e = items.getAt(i);
            if(e != arg.data) e.active.value = false;
        }
      }

      module.exports = {
        items: items, resetSwipe: resetSwipe
      };
    </JavaScript>

    <ScrollView>
      <StackPanel>
        <Each Items="{items}">
          <Panel ux:Name="itemNode" Color="#fff" Padding="10">
            <!-- Swipe -->
            <SwipeGesture ux:Name="swipeItem" Direction="Left" LengthNode="itemNode" Type="Active" IsActive="{active}"/>
            <SwipingAnimation Source="swipeItem">
                <Callback Handler="{resetSwipe}"/>
                <Move X="-0.8" RelativeTo="Size" Duration="0.5" />
            </SwipingAnimation>
            <Panel Alignment="VerticalCenter">
              <Text Value="{title}" FontSize="13" TextColor="#555" />
            </Panel>
          </Panel>
        </Each>
      </StackPanel>
    </ScrollView>
</App>

```

---

<div class="post-metadata">

**Author:** ![Costin\_Bereveanu](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/costin_bereveanu/32/628_2.png) [@Costin\_Bereveanu](https://forums.fusetools.com/u/Costin_Bereveanu)\
**Post date:** [August 23, 2016, 8:00am UTC](https://forums.fusetools.com/t/swipe-gesture-help/5313/3 "2016-08-23T08:00:57Z")

</div>

Damn, I was just testing that before posting 🙂  
Thanks, Remi, I was at the point where I needed to do this too.  
Works perfectly.

---

<div class="post-metadata">

**Author:** ![danbar](https://avatars.discourse-cdn.com/v4/letter/d/bc8723/32.png) [@danbar](https://forums.fusetools.com/u/danbar)\
**Post date:** [August 23, 2016, 2:04pm UTC](https://forums.fusetools.com/t/swipe-gesture-help/5313/4 "2016-08-23T14:04:23Z")

</div>

Awesome! Works like a charm. Thanks so much Remi!

---

<div class="post-metadata">

**Author:** ![Remi\_Pedersen](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/remi_pedersen/32/432_2.png) [@Remi\_Pedersen](https://forums.fusetools.com/u/Remi_Pedersen)\
**Post date:** [August 23, 2016, 5:59pm UTC](https://forums.fusetools.com/t/swipe-gesture-help/5313/5 "2016-08-23T17:59:08Z")

</div>

Happy to be of assistance. 🙂