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

What is Framer? Join the Community
Return to index
Mike Johnson
Posted Feb 18 - Read on Facebook

Here's a quick screencast showing the process of exporting a Framer studio project to an ipa file that can be installed on other peoples' devices through Cordova.

10 Comments

Mike Johnson

Also quick note, to get fix scaling issues you may have to edit the config.xml file

<preference name="EnableViewportScale" value="true" />

This defaults to false every time cordova run is called. Editing to true after running `cordova build` and before opening in xcode will fix most scale issues.

Nicolas Elizaga

Thanks for this! Your walkthrough helped me get Framer's "Welcome" examples running through Xcode =)

After some trial and error, I was also able to get a prototype running with modules by leaving this in index.html:

<script src="framer/framer.modules.js"></script>

This would be a perfect case for a helper build script: copy Framer files to deploy/www, modify index.html, compile all coffeescript to JS, run "cordova build", profit.

Mike Johnson

Yeah, the modules file is required if you are adding any modules, I wanted to show the bare minimum to getting it up and running.

Nicolas Elizaga

I wanted to get this working for a current project, so I threw together this build script so Gulp would do all the work for me: https://gist.github.com/hellonicolas/07817fe3d467b33c237b

For the most part it's fairly similar to the first part of your tutorial video, but then Gulp takes over copying files / updating the Cordova build / converting Coffeescript to JS / etc.

So far it's worked without any issues on a fairly complex existing Framer project (other than Xcode being an occasional pain in the ass).

Hopefully someone finds that useful : )

Mike Johnson

Nice!

Nicolas Elizaga

Hey Mike, have you run into any issues in the last few days (possibly related to Framer.js updates) with a Cordova project scrolling out of view whenever you touch & drag?

FYI, I've been using this setting to prevent overscrolling:
<preference name="DisallowOverscroll" value="true"/>

My imported Sketch files doesn't have artboards but has a lot of different groups laid out for different views so it looks like it's scrolling around in those bounds, but I'm baffled as to why that's happening all of a sudden.

Nicolas Elizaga

Unfortunately turns out it's something in the latest Framer.js update – reverting back fixes it. I'll post a screencap of the behavior shortly.

Mike Johnson

I haven't pushed any builds for a while, so I haven't seen this. :( Where are you seting the DisallowOverscroll? In the config xml?

Nicolas Elizaga

Yep, adding that to config.xml. This new behavior scrolls outside the bounds of the device if you have any off-screen assets imported (ScrollComponents, etc).

Nicolas Elizaga

This is runing in Simulator (only happens when packaged up as a native app unfortunately): http://d.pr/v/15aSH

Read the entire post on Facebook