Making your app responsive


#1

Hi ionic,

First of all thank you for your amazing framework. I just finished my first app and am about to begin building a second one. But there were a few questions I’d like to ask before starting this new project regarding some problems I experienced in my first app. Most of the problems came from responsiveness on the different screensizes: android small -> large -> tablet , iphone 5-> 7+ -> ipad. Most of my content just scales corresponding to the increased screensize rather then for example having the fontSize that I wanted.

What is the best way to make the app responsive for the different screensizes?

-In my first app I mostly used vh for heights and % for widths… this seems to work pretty good for making things fit, but maybe there is a better way?

-I also had alot of trouble finding the best way for making fontSizes adjust to the screens. How do you set fontSizes if pixels get upscaled on retina displays? Is there any way to define it in points instead of pixels? I think the ionic framework is genius but in a world of 1001 different devices I feel like I need to be able to control fontsize so that the font on an iphone 7+ won’t be twice as big as on an iphone 5. Also is it possible to enlarge text when a user has set his preferences to have large fonts?

-We also have images that need to change according to the display. For my previous app I used retina.js it changes the src depending on the pixel density of the screen, I think this is well enough but if there should be a better way I would be glad to hear it.

So basically a quick summary of my question would be: What is the best way to define heights,widths, fontsizes, images that will change appearance depending on the screen they are displayed on.

Thanks you for reading,
Can’t wait for ionic 2 to come out.

Pieter-Jan