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

What is Framer? Join the Community
Return to index
Danke Alamien
Posted Apr 23 - Read on Facebook

Hey guys, I'm new to framer js. Is there any way we can simulate android lockscreen?
a couple of things :
- how to make a button draggable but come back to its original position when released?
- I want to make the button 'nudge' another button and have it animate.

I tried using pixate but I don't think it's possible.
any help would be appreciated. Thanks!


Benjamin Den Boer

Hey Danke Alamien - I've created a prototype of the Android Lollipop Lockscreen on the Nexus 9 a while back. I just updated it with the latest Draggable for you:

1. You can check the dragging distance, and you haven't passed a certain value, snap back to its original position on DragEnd.

2. You can pass values around with Utils.Modulate. For instance, in this example I'm mapping the dragging distance to scale the lock icon a little bit.

Danke Alamien

Wow thanks! This sounds perfect. But I can't seem to drag the unlock button, try it out both on the browser and in framer studio, did I miss something? I'll try opening it on my phone.

Benjamin Den Boer

You can drag the entire screen - but you have to drag upwards ;)

Nick Bewley

Can anyone comment on why people use this syntax: "bg.Canvas.on Events.DragMove, (event) ->" ? Why do you need to include "event" with the function? Thanks for any ideas

Read the entire post on Facebook