I have a responsive website which i tried adding in uiwebview. When testing in the simulator with iphone 5 it displays the website correctly, but when displaying on iphone 6 it leaves about 20px blank.
I have trief different solutions like here; UIWebView dones't resize correctly when orientation change?
But without result.
Is there anyone who can help me on the way?
Related
I noticed this with separate html code, but I can repeat the same issue using the following url example of an html web app view, such as would be used in a hybrid app. To make it easiest for someone reading this to reproduce the issue, I will include that url here (I don't need to use that url. I have my own code. But this url does the same thing, so is a good example for someone reading this to examine.)
https://framework7.io/examples/tab-bar
Image: These bottom nav bar items do not respond to touch on iPhone 6s or 6s Plus, but DO work on 5s and SE
To reproduce:
Create a simple iOS App with a wkwebview (you may already have one from a previous project)
Simply ensure the webview loads the above url, and you will be able to observe the issue.
If a wkwebview in a Swift app loads the above url in an iPhone 5s or lower within a full screen wkwebview, the bottom tab menu (with choices for information, inbox, upload, and photos) will work. But if opened in iPhone 6s or 6s Plus, the bottom tab menu will not work. You can tap on choices, and nothing will happen.
Important: This is not in Safari. This happens in the context the link being opened in a wkwebview within a Swift app. This is repeatable.
I have checked the layer debugger, and nothing is in the way of the bottom tab.
Thank you very much.
I was going to just delete this, but you never know. Someone else may have the same question later. Maybe this will help them.
So here is the answer which I have just figured out:
I hadn't added auto constraints to ensure the webview would stay the same size as the window. That is why it worked on the smaller phones like the 5s and SE (because the webview happened to aready be big enough.) Meanwhile, the bigger screens of the 6s and 6s Plus were beyond the size of the webview.
I saw it in storyboard and added constraints to ensure the webview would stretch to however big the screen was, and everything started working. The lower nav bar was no longer out of reach of my taps.
I do think it's odd that the content displayed on the entire screen, but only the area which detected touches did not extend to the screen, but that is an opportunity for me to examine the code and see how things are arranged.
The main issue has been solved.
I have a problem. Recently I noticed that my website has a problem showing the text with iPhone 6 and 6+. the text is little bit out of margin in right. with the other phones it automatically resizes the screen and I am able to see the text fully. But in iPhone 6 I need to add some sort of code to the css file of my html5 website.can any one help me with this issue?
I found Intel's App-Framework to be light-weight and fast. However, I am facing a problem that I just can't seems to overcome. In the framework, one can display a navbar that 'stick' to the bottom of the screen. This work fine on the browser, WebView in Android and UIWebView in IOS - except on iPhone with 3.5" screen - the navbar just didn't show up. It appears that the screen is too short to show it.
I have tried playing with "viewport" meta tag by setting various 'height' and disabling & changing OS theme. Nothing works. Anyone has experience on this? How do I adjust the navbar position?
As it turns out, it is not the problem of App-Framework; it is the way UIWebView is placed on the view. After correctly setting UIWebView's top and bottom constraints, I am able to see the navbar correctly set at the bottom of the screen.
I have an iOS 5 + app I am getting ready for iOS 7.
I have a standard TabBar based app loading in viewcontrollers, one of which loads in a webView.
This webview has a landscape and portrait mode as the app can be rotated, this works fine on all devices except iPad running iOS 7.
The issue being the webview is always displayed as landscape on iPad on iOS 7 irrespective of the orientation, iOS 7 gets rid of the 2x button that you used to get with iPhone apps running on an iPad so it is faux full screen.
The app opens in portrait mode, if I rotate the iPad everything else rotates - all other views adjust and reposition - except the html in the webview - it is stuck on landscape.
This happens on device and simulator
The question I suppose is why? has anyone else had experience of this?
Many thanks
Try setting constraints on the UIWebView. In the storyboard, look for the menu icons on the bottom right, and select the one that looks like a tie fighter. Then select 'Add Missing Constraints' or 'Reset to Suggested Constraints'. then when your View changes (orientation), the space constraints will adjust.
I am building a website using the twitter bootstrap base so that i can have a site that works on the ipad and also touch phone devices.
So far my site looks great in all browsers, PC ipad and phone however ipad only works fine in portrait. When in portrait it has the lovely button in the corner which opens the expanding menu.
I want this to work on the landscape one too but can't seem to get it to work.
Could someone please advise me whereabouts in the CSS I need to look and also if possible what screen size I am looking for to make the collapse bar appear in landscape.
Answering my own question.
Just incase anyone else has the same problem:
iPad screen resolution is 1024 x 768 so in landscape mode it renders like a full web page.
There are ways to overcome this by detecting the device's browser user agent.
For more information see this:Checking iPad user agent