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

What is Framer? Join the Community
Return to index
Greg Woods
Posted Jun 23 - Read on Facebook

Hello, I'm struggling with Sketch and importing layers. I hope you can help. Here are my grouped layers in sketch. As you can see, I have two artboards. When I import them, I only see the layered groups from wishlist2, ther 2nd artbaord. This is my first confusion - I thought it should default to showing only 'wishlist1' artboard. Secondly, to make a scrollable component where the imported sketch fle scrools within the superlayer I've used the following code:

pull = Framer.Importer.load "imported/pull-to-refresh"
Framer.Device.screen.backgroundColor = "white"
scroll = ScrollComponent.wrap(pull.wish1)

Where 'wish1' is an imported group layer from artboard 'wishlist1'

Again, this is not working. Can anyone offer any advice of where I'm going wrong. Thanks for your help
Greg Woods

4 Comments

Balraj Chana

Hey Greg, multiple artboards are stacked on top of each other and hidden except for the last one as explained here: http://framerjs.com/learn/import/sketch-tips/. To solve this, set pull.wishlist2.visibility = false and pull.wishlist1.visibility = true.

Regarding scrollable layers, have a look at the scrollable .zip file here: http://framerjs.com/learn/import/templates/. Make sure that your groups are set up the same as the layers list shown in the screen shot. Don't forget to remove the artboard as it's easily missed. Use a master group to hold all of the content and set the position to x:0, y:0 before you import it into Framer.

Greg Woods

Thanks Balraj, I'll give this a try.

Greg Woods

Hi Balraj, what I've found is key to getting this to work is that there needs to be a layer group of the content inside a 'content' layer, otherwise it does not work. It's worth the starter templates making this point clear to help others. Thanks again guys

Balraj Chana

The artboard is a common issue as it's easily overlooked :) Making a scrollable layer in sketch simply consists of removing the artboard, placing the scrollable content inside a subgroup and then applying a mask underneath. Any other way won't work so your group structure is essential: http://framerjs.com/static/images/learn/ss-scrollabletemplate.png

Read the entire post on Facebook