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

What is Framer? Join the Community
Return to index
Adam Donkin
Posted Jul 19 - Read on Facebook

I'm new to Framer and have created an iOS prototype using the Flow Component. Is there a simple way to allow this to scale proportionately (not responsive) to fill any iPhone device? Will it break browser preview?

I've read and tried several techniques from this group. But none take into account the Flow Component. Thanks.

6 Comments

Adam Donkin

Adam Donkin

Is there a known issue with Framer.Device.screen.width for iPhone 7 Plus? It appears to be 1242. I expect it to be 828.

Derek Nguyen

You can try putting everything inside a wrapper that set to iphone 5 size for example. Then you can calculate the ratio between that and the current device and scale that wrapper up.

```
wrapper = new Layer
width: 320
height: 568
originX: 0
originY: 0
scale: Screen.width / 320
```

Adam Donkin

Thanks Derek Nguyen. That helps! I was using Framer.Device.screen.width, which was problematic.

How do you force the wrapper layer to always be the parent to all layers?

Adam Donkin

This totally works. My issue was using the Design view to lay out my screens. When I use Sketch Import, no problem. Thanks again.

Derek Nguyen

Hey Adam Donkin, glad it helps you! With Design view, you can do the same thing as well. Say you have an artboard called 'ip5', then after you turn on target for that artboard, in your code you can do:
```
ip5.width = 320
ip5.height = 568
ip5.originX = 0
ip5.originY = 0
ip5.scale = Screen.width / 320
```

Same thing basically, but you probably won't have to remember to put everything inside a wrapper.

Read the entire post on Facebook