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

What is Framer? Join the Community
Return to index
Ed Lea
Posted Jun 09 - Read on Facebook

I wanted to have a paging effect, but not full bleed pages and I wanted to have smaller cards with the next/previous edges peeking out. I couldn't manage this with PageComponent as there was no contentInset or page margin values that I could see. Posting here incase a) there's a better solution or b) there isn't, and this will save someone some work =D http://share.framerjs.com/8e8shs1ooaaf/

8 Comments

Joon Won Lee

By the way, how to record the window in mac

Ed Lea

Joon Won Lee use QuickTime Player and File > New Screen Recording

Justin Glaeser

Ed, There does seem to be something weird going on with the contentInset with a page control but I was able to do this: http://share.framerjs.com/u5bq7boeq4gh/

Justin Glaeser

This is based off of this example: http://share.framerjs.com/x0li6cnk4pc4/

Justin Glaeser

contentInset: {left:32, top:100, right: 32} doesn't behave how I would expect but contentInset: {top:100, right: 32} and added 32 to the x value in the loop works. Still not ideal.

Chris Camargo

Ed, Justin, no need for contentInset. Just shrink your PageComponent to match the size of your cards and turn off clipping. You'll be able to swipe on the visible cards, since the container will no longer clip them.

Chris Camargo

Although, I believe you can use both techniques and let contentInset do the spacing math for you.

Ed Lea

Interesting stuff, thanks guys. When I didn't see contentInset mentioned in the docs for PageComponent I figured it didn't exist http://framerjs.com/docs/#page.pagecomponent

Read the entire post on Facebook