Both iOS WebView types incorrectly setting 320px viewport size on iPhone 6 and 6+ (Xamarin app)

Question

I've been wrestling with this for a few hours now. Here's the repro scenario (Xamarin.iOS 8.10, iOS 8.2):

1. Created a (mostly) empty test web page (no stylesheet, just a width=100% on the body) with the following tag: <meta name="viewport" content="width=device-width, initial-scale=1.0">

2. Page loaded in both a UIWebView and WKWebView (preferred) in a thin-client app designed for portrait mode on iPhone

3. Debug via iOS Simulator, attach to WebView instance in Safari on parent Mac

4. Viewport width always shows 320px when simulating both iPhone 6 and 6+, making the web page appear scaled too large

5. Same page loaded and debugged via mobile Safari

6. Viewport width shows 414px (6+) and 375px (6), as expected

I've experimented with SizeToFit() and ScalesPagesToFit on the WebViews and AutoresizingMask on the parent ViewController, but they don't seem to have any effect on the reported viewport size.

Does anyone have any idea why the WebViews have the wrong viewport dimensions? This is the prescribed approach everywhere I look. Is it an iOS issue, a Xamarin issue, or something I'm missing or potentially not doing correctly in code?

Answer 1

It turns out that the necessary launch images for the higher-res iPhones were present but not properly included in the iOS project, causing the app to load at the lower resolution of previous iPhones. Once Default-667h@2x.png and Default-736h@3x.png files were referenced, the app loaded as expected. Leave it to Apple to make their app runtime resolutions dependent upon something like the presence or absence of particular image files!

Answer 2

Use a storyboard for iOS9+. Less hassle having to deal with all those images too.

https://developer.xamarin.com/guides/ios/application_fundamentals/working_with_images/launch-screens/

NOTE: The information in this section is provided for historical reference only. Starting with iOS 9, Launch Screens should be created with Storyboards instead of including specific Image Asset Launch Screens for all of the different iOS Device types. Please see the Managing Launch Screens with Storyboards section below for details.