Is the browser used in Android and iOS so different?

Question

I'm developing an android application and a colleague of mine is developing the same application for iOS. In this application is needed to load a 360 panorama which is located on internet. In the iOS application, a HTML5 string is used to wrap the URL of the panorama and the WebView loads it normally when I used the same String in an Android WebView, the url won't open. So my question is are the webiews between these two OS so different? should I enable some settings of my webview? I'll post you the code and the string just in case you can make something out of it.Thank you in advance

    webView2.getSettings().setJavaScriptEnabled(true);
    webView2.getSettings().setDomStorageEnabled(true);
String target = "<html>
                 <head> 
                 <style type=\"text/css\">
                 iframe {position:absolute; }
                 body {background-color:#000; margin:0;} 
                </style> 
                </head>  
                <body>
                <iframe width=\"100%%\" height=\"100%%\" 
                src=\"%http://360photo.gr/panorama/ipad/antalki/antalki_2.html\" frameborder=\"0\" allowfullscreen></iframe>        </body>        </html>" ;

I might be messing the String somewhere and haven't noticed this is the String that works in iOS

    NSString *videoHTML = [NSString stringWithFormat:@"\
                       <html>\
                       <head>\
                       <style type=\"text/css\">\
                       iframe {position:absolute; }\
                       body {background-color:#000; margin:0;}\
                       </style>\
                       </head>\
                       <body>\
                       <iframe width=\"100%%\" height=\"100%%\" src=\"%@\" frameborder=\"0\" allowfullscreen></iframe>\
                       </body>\
                       </html>", self.urlToPlay];

And this is how I load the Data:

webView2.loadData(target, "text/html", null);

Apurv · Accepted Answer · 2013-12-17T12:40:04.573

1

There is an extra "%" sign in the URL which you have prepared for Android. Just remove it from the value of "src" and it should get open for Android browser as well.

I simply put below code in sample.html file and loaded into webview. It worked well and loaded the image perfectly. It seems problems are with escape characters and extra "%" sign in width and height attributes of iframe.

<html>
     <head>
          <style type="text/css">
          iframe {position:absolute; }
          body {background-color:#000; margin:0;}
          </style>
     </head>

     <body>
          <iframe width="100%" height="100%"
               src="http://360photo.gr/panorama/ipad/antalki/antalki_2.html" frameborder="0" allowfullscreen>
          </iframe>
     </body>
</html>

edited Dec 17 '13 at 12:40

answered Dec 17 '13 at 08:49

Apurv

17,116
8
51
67

I've tried it it still didn't work.See that the original String contains "\" and the end of each tag, I removed them as I guessed there are escape characters, could that be the problem? – Libathos Dec 17 '13 at 09:02
Ideally you should create a resource file with filename.html. Then load the string from there only rather creating it in the code. – Apurv Dec 17 '13 at 09:08
in loadData mimeType should I put something different than "text/html"? is it html5 or something? – Libathos Dec 17 '13 at 09:17
and did you load it like that? "webView2.loadData(target, "text/html", null);" – Libathos Dec 17 '13 at 13:15
I created string variable using InputStreamReader. Then load it via loadDataWithBaseURL(null, htmlStringVariable, "text/html", "utf-8", null); – Apurv Dec 17 '13 at 13:20
You're right! it opens correctly! however this is not how it behaves in a browser? would you happen to know why it turns the picture instead of turning the camera? – Libathos Dec 17 '13 at 13:28
WebView is not the browser. It may have different behaviour. Not aware about that much. – Apurv Dec 17 '13 at 13:30

score 0 · Answer 2 · edited May 23 '17 at 12:19

0

So according to this link I can't do what I've set out to do, at least not for KitKat, is that correct or did I misread something?

edited May 23 '17 at 12:19

Community

1
1

answered Dec 17 '13 at 10:17

Libathos

3,340
5
36
61

Matt Gaunt · Answer 3 · 2013-12-18T10:36:28.827

Have you added the internet permission to your Android Manifest?

<manifest xlmns:android...>
 ...
 <uses-permission android:name="android.permission.INTERNET"></uses-permission>
</manifest>

EDIT

Had a crack at adding some more solid CSS to your page and got it working on an example app.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">

<title>Demo</title>

<style>
  html, body {
    padding: 0;
    margin: 0;
  }

  html {
    min-width: 100%;
    min-height: 100%;
  }

  body {
    width: 100%;
    height: 100%;
    background-color: red;
  }
</style>

</head>
<body>
  <iframe width="100%" height="100%"
               src="http://360photo.gr/panorama/ipad/antalki/antalki_2.html" frameborder="0" allowfullscreen>
          </iframe>
</body>
</html>

Is the browser used in Android and iOS so different?

3 Answers3