This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Koen Bok
Posted Nov 29 - Read on Facebook

Made a little example on how to do resistance for Aaron: http://codepen.io/koenbok/pen/AvGqn

You'll need the latest Framer for this because I found (and fixed) a little bug.

7 Comments

Aaron Carámbula

Wow, this is smooth. Thanks Koen! I would have never figured this out but this makes total sense.

I'm going to try to fork this and use normal JS so I can learn better what you did.

Aaron Carámbula

This also seems like a good way to tap into drags to have all sorts of other behaviors.

Koen Bok

I think you can just see the generated js at code pen.

Aaron Carámbula

Woah. I just clicked on the (Coffeescript) label and it switched to compiled preview. So great.

Aaron Carámbula

when dragger gets its revamp, it'd be awesome to be able to set resistance in addition to physics

Jason Najarro

Hi. I tried applying this to my project, but for some reason the draggable item slows to a stop as the speedx approaches .5 and then it reverses direction, picking up speed, as speedx goes below .5 and approaches zero. Any idea why this is happening?

boundRadius = 500
initX = 0
distance = 0

sidebar.on Events.DragStart, (event) ->
initX = event.x

sidebar.on Events.DragMove, (event) ->
distance = Math.abs(initX - event.x)
dragSpeed = 1 - Math.min(distance, boundRadius) / boundRadius
sidebar.draggable.speedX = dragSpeed

Peter Ng

did this the other day too, realized it was much simpler to resist around a circle than a square: distance = Math.abs( Math.sqrt((view.x - position.x) ** 2 + (view.y - position.y) ** 2) )

Read the entire post on Facebook