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

What is Framer? Join the Community
Return to index
Katie Wu
Posted Jul 24 - Read on Facebook

After an event, I change the x positions of pages in a PageComponent such that it reaches PAST the original PageComponent.content, but the pages are clipped because the PageContent has the original dimensions and position. I tried changing the PageContent's position but it moves all the pages too :( Any ideas?

18 Comments

Chris Camargo

Have you tried PageComponent.updateContent() ?

Katie Wu

that's not a function for PageComponent :(

Chris Camargo

Does that mean you tried it and it failed?

Katie Wu

it's a function for ScrollComponent

Chris Camargo

That wasn't the question. :) If I recall correctly, PageComponent extends ScrollComponent, so its reasonable to assume the method is still intact.

Chris Camargo

(Sorry, not at my desk ATM, otherwise I'd try it for you)

Katie Wu

Ah I didn't know that it extended ScrollComponent - but it doesn't work in that it doesn't clip off the excess empty space leftover from moving page positions

Chris Camargo

So is the idea that you want to move these pages so that they peek outside of the bounds of your scrollComponent?

Katie Wu

I have pages A, B, C arranged horizontally, and I'm currently on page B. I perform an event and then I want to rearrange the pages so that the order goes B, A, C. If I simply swap A and B's positions, I will currently be looking at page A now, which I DONT want. So what I'm doing is keeping page B where it is, and moving A and C to it's right. But now page C sticks outside the PageComponent content area, which causes this issue. I guess the key point that I want is that once the event is performed, the user is STILL looking at page B, but the pages around it have changed. When I call updateContent(), this makes the PageComponent jump to another page, which I don't want either. :(

Chris Camargo

So does your solution work otherwise? Is it fair to say that the only problem you have now is that your content is getting clipped when it moves outside of the PageComponent's bounds?

Katie Wu

Yes! Which is why I tried to manually change the size of the PageContent area. Calling updateContent() seems to be farther from a solution than my current one, since that moves the user away from page B. But it's good to know that that function exists!

Chris Camargo

Have you tried setting the clip to false for PageComponent?

Katie Wu

Page C is still outside the bounds of PageContent, and it doesn't let me swipe there or snap there

Chris Camargo

I think I may need to see a simplified example to really dig into this. I've had success disabling clip on PageComponents, but I don't think I mixed that with manipulating the position of pages in the component.

Katie Wu

I'll make one and share it!

Katie Wu

And thanks so much for your help! :)

Chris Camargo

Just trying to keep the community awesome. :)

Katie Wu

http://share.framerjs.com/nrkiqaqho57g/ Clicking the black square is the event that triggers it

Read the entire post on Facebook