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

What is Framer? Join the Community
Return to index
Simon Lessing
Posted Mar 25 - Read on Facebook

Hey, semi-n00b here, loving framer! ;)
I'm currently trying to get it to play nicely with paper.js. It's working OK in Framer Studio but when I try it on iOS there seems to be a problem with the events. Paper wants them in a certain format, but neither TouchMove or DragMove seems to do it. Is there a way to convert the events or how do I do this?
Thanks Benjamin Den Boer & Kai Oliver Reuter for getting me started.

10 Comments

Benjamin Den Boer

Hey Simon, for the draggable / drawing layer to work on iOS you need to use the "Events.touchEvent(event).clientX" (and y) instead of the "event.x" (and y) on DragMove or TouchMove within path.add. :)

Koen Bok

Also, I'm not sure what you are using Paper for specifically but we are working on path animations in Framer.

Harsha Vardhan R

Simon Lessing Can you let us know how you got them to work together? Total noob here :) Koen Bok amazing...Look forward to path animations!

Giovanni Caruso

Thanks Benjamin Den Boer. I was looking for this solution as well.

Tisho Georgiev

Harsha Vardhan R, you can play with the build that supports path animations by downloading it from here: https://github.com/koenbok/Framer/pull/151

Harsha Vardhan R

Cheers! Tisho Georgiev

Simon Lessing

Thank you Benjamin Den Boer, as I've seen e.g. Joshua Tucker and others mention, that event handling is a bit tricky - it really threw me off.

Koen Bok & Tisho Georgiev very excited about the paths, I can't really decipher the code but it looks like I should be able to capture pointer events to build and SVG path in pretty much the same way, right?

Harsha Vardhan R here's a screenshot-tutorial that has everything you need, as you can see it's really quite simple to integrate a canvas-based JS framework like Paper in Framer.
I have a very shallow understanding of the browser and how everything runs in it, so that was a very nice surprise with Framer and something that makes me invest more and more in this tool, having used both Keynote, Quartz Composer, Pixate & more fairly extensively for prototyping in the past.

Harsha Vardhan R

Woop! Thanks Simon Lessing ... can't wait to try this now.

Andrew Nalband

Thank you for all this! I was able to get this up and running pretty fast, but I can't seem to figure out how to get the drawing to stop after the touch ends. Any ideas what I'm doing wrong? http://share.framerjs.com/17t6x1eml7bv/

Andrew Nalband

This seemed to do the trick for drawing new lines - was able to get a simple drawing interface going pretty quickly: (note - positioning of touch only works on the iphone) http://share.framerjs.com/7uvv1wt7hekz/

Read the entire post on Facebook