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

What is Framer? Join the Community
Return to index
Junu Joseph Yang
Posted Apr 25 - Read on Facebook

Hi framer experts!
I had a quick question about draggable constraints. Is it possible to use isBeyondConstraints to disable/enable the constraints? I want to make a layer move to a new position if it is dragged beyond its constraint. I've tried a simple onDragEnd with a if/then(without using constraints), but it's buggy with maybe overlap of animation call event with post-drag inertia from dragging.

Code below:

layerA = new Layer
layerA.width = Framer.Device.screen.width
layerA.height = Framer.Device.screen.height

layerA.draggable.enabled=true
layerA.draggable.horizontal = false
layerA.draggable.constraints =
x: 0
y: 0
width: layerA.width
height: 300

layerA.states.add
moveOffScreen:
y: 2000

layerA.onDragEnd ->
if layerA.isBeyondConstraints = true
layerA.states.switch ("moveOffScreen")
layerA.draggable.constraints = null
print("off")

3 Comments

Steve Ruiz

Hey, you'll need to check layerA.draggable.isBeyondConstraints (your code is missing the draggable bit). Something like this should work:

layerA = new Layer

layerA.states.offScreen =
x: Screen.width

layerA.draggable.props =
enabled: true
constraints: {x: 0, y:0}

layerA.onDragEnd ->
if layerA.draggable.isBeyondConstraints
layerA.animate('offScreen')

Junu Joseph Yang

Steve Ruiz Duh. Thanks for catching that! It still seems to snap back into it's original position after it moves offscreen. Any ideas on it?

Steve Ruiz

Got it - the bug is in the line 'layerA.states.switch ("moveOffScreen")'. There is no states.switch method - rather, the method you want is stateSwitch. Try using layerA.animate('moveOffScreen') or layerA.stateSwitch('moveOffScreen') instead.

Read the entire post on Facebook