xamarin.ios - Xamarin Forms - IOS , Scripts and styles are not calling -
i working on xamarin forms ios application calling html pages, styles , scripts using hybrid webview. not able render styles , scripts , code
hybridwebviewrenderer.cs
protected override void onelementchanged (elementchangedeventargs<hybridwebview> e) { base.onelementchanged (e); if (control == null) { usercontroller = new wkusercontentcontroller (); var script = new wkuserscript (new nsstring (javascriptfunction), wkuserscriptinjectiontime.atdocumentend, false); usercontroller.adduserscript (script); usercontroller.addscriptmessagehandler (this, "invokeaction"); var config = new wkwebviewconfiguration { usercontentcontroller = usercontroller }; var webview = new wkwebview (frame, config); setnativecontrol (webview); } if (e.oldelement != null) { usercontroller.removealluserscripts (); usercontroller.removescriptmessagehandler ("invokeaction"); var hybridwebview = e.oldelement hybridwebview; hybridwebview.cleanup (); } if (e.newelement != null) { string filename = path.combine (nsbundle.mainbundle.bundlepath, string.format ("content/{0}", element.uri)); //filename = "/var/containers/bundle/application/2dc89563-d118-4092-b7a5-4549af07f3b2/stoneapplication.ios.app/content/index.html" control.loadrequest (new nsurlrequest (new nsurl (filename, false))); } } public void didreceivescriptmessage (wkusercontentcontroller usercontentcontroller, wkscriptmessage message) { element.invokeaction (message.body.tostring ()); }
and index.html, here calling scripts, images , styles
<html> <head> <title>stoneapp template</title> <!--scripts--> <script src="/scripts/angular.min.js"></script> <script src="/scripts/jquery.min.js"></script> <script src="/scripts/bootstrap.js"></script> <script src="/scripts/fileserver.js"></script> <script src="/scripts/fileupload.js"></script> <script src="/scripts/ng-cordova.js"></script> <script src="/scripts/app.js"></script> <!--styles--> <link href="/styles/bootstrap.css" rel="stylesheet"/> <link href="/styles/main.css" rel="stylesheet"/> </head> <body ng-app="stoneapp" style="background-color: #ffffff;"> <div ng-controller="templatectrl"> <div id="header" style="background-color:#293846;min-height:50px"> <table style="width:100%;padding-top:5px;padding-left:5px;padding-right:5px"> <tr> <td align="center" width="5%" valign="middle" ng-if="jobview == true" ng-click="showactlist()"> <img src="/images/arrow-back.png" alt="" style="height:50px;width:50px"/> </td> <td align="center" width="5%" valign="middle"> <img src="/images/wifi_on.png" alt="" style="height:50px;width:50px" ng-click="showwifisettings()"/> </td> <td align="center" width="5%" valign="middle" ng-click="showtabsettings()"> <img src="/images/settings.png" alt="" style="height:50px;width:50px" ng-if="loginview == false"/> </td> <td width="5%" valign="middle" ng-if="activityview == true"></td> <td width="60%" valign="middle"></td> <td width="20%" valign="middle" align="right"> <span style="color:white" ng-if="loginview == false">{{username}} !</span> </td> <td width="5%" align="right" valign="middle" ng-click="logout()" > <img src="/images/power_button.png" style="height:50px;width:50px" ng-if="loginview == false"/> </td> </tr> </table> </div> </div> </body>
i gave build action bundle resource styles , scripts though not able call styles , scripts , program structure attached image.
i using ios 10.2 tablet. so, please issue , me make call scripts styles , images links given in html page. in advance.
you can't control.loadrequest
you're problem can't define baseurl webview method , no other method let define it. when index.html loaded webview, webview can't retrieve script or css because baseurl not defined , doesn't know load them.
a workaround use loadhtmlstring (string htmlcontent, nsurl baseurl)
where htmlcontent
index.html content loaded var , baseurl nsurl baseurl = new nsurl(nsbundle.mainbundle.bundlepath, true);
Comments
Post a Comment