What is the webview of MUI Development app?

WebView (network view) can load a display page, which can be viewed as a browser.

When we use MUI Development Html5+app, is actually called the device's WebKit kernel, that is, the browser's call, the browser to implement the device interface to the device operation, the current implementation of html5+ can call camera, recording, GPS and other things such as the lower, For mobile browser cores, of course.

We can even use iostream, the application of file streams, is implemented in a browser-provided sandbox directory,

Currently 5+ to ensure the security of the application, the Plus.io API restricts access to the application sandbox only 4 public directories _www (read-only), _doc, _downloads, _documents, does not allow access to other directories, it is recommended to save the downloaded file to the above three writable directory.

Let me first talk about my understanding of webview. Let's make an analogy:

Apps developed with MUI, pure or HTML, open Web pages that are understood in the same way as traditional Web pages:

We understand the app as a browser , the WebView is understood as a browser under the different tab tab, each tab is a different page , browser browsing can be toggled in the tab, so as to achieve the different pages of the app to switch, Use Mui.openwindow to create a new tab label (WebView), each tab has its own ID, and tab can add new duplicates (CREATENEW)

Scenario One:

In Mainfest.json We configure the home page, such as login.html, and then we start app,login.html will be first presented on our screen, this is the first tab tag (called Launchwebview), if we close this tab, then the browser does not The other tab will be closed.

App is also a reason, only a webview case (assuming is Launchwebview, home), will be exited, can be used in the home login.html Plus.webview.getLaunchWebView () test, The app will exit directly!

Scenario Two:

The browser already has the first page tab, we create a new tab, and jump to the new tab

App,webview uses the Mui.openwindow () method, which passes some parameters, as the official saying:

mui.openwindow ({URL:New-page-URL, id:New-page-ID, styles:{top:newpage-top-position,//top position of new pageBottom:newage-bottom-position,//new Page Bottom positionWidth:newpage-width,//New page width, default is 100%Height:newpage-height,//New page height, default is 100%...}, extras:{ .....//custom extension parameters, which can be used to process the value of the page transfer}, CreateNew:false,//whether to repeat the creation of the same ID WebView, the default is false: Do not create duplicates, direct displayshow:{autoshow:true,//page loaded event occurs automatically, default is TrueAnishow:animationtype,//page display animation, the default is "Slide-in-right";Duration:animationtime//page animation duration, Android platform default 100 milliseconds, iOS platform default 200 milliseconds;}, waiting:{autoshow:true,//Auto Show Wait box, default to TrueTitle: ' Loading ... ',//wait for the prompt to appear on the dialog boxoptions:{width:waiting-DIALOG-WIDHT,//the width of the wait box background area, by default automatically calculates the appropriate width based on the contentHeight:waiting-dialog-height,//the height of the Wait box background area, by default automatically calculates the appropriate height according to the content        ......      } }})

Openwindow opened a new webview and jumped to the new webview, just like the browser to create a new tab and switch the past, but the switch process with parameters, the implementation of animation, and other complex phenomena, which is more powerful than the browser to access the page

Openwindow has two core parameters, one is the URL to open the HTML file, open tab also need to know the Web address, right? The other is the ID, this parameter is equivalent to the handle, after the search for this webview depends on it

Please note: There is a special parameter under Openwindow: CreateNew

If it is false, the use of Openwindow open a new window, will first determine whether there is a id,url webview, if there is a direct switch past, no words to create a new window, jump over!

If it is true, use Openwindow to open a new window, regardless of whether there is no same id tab, go back to create a new one, that is, may create duplicate webview, which is very painful, because it will cause the app to jump WebView, Different from the expected effect (jumping webview is not what you want)

Please try not to use unless special pages need to be created in more than one duplicate case

Note: I have encountered a custom trigger event (fire) resulting from the creation of a duplicate webview, and before returning, the DOM of the returned page has been modified to refresh, but the DOM has not been changed, in fact because of repeated webview, modified the other!

Scenario Three:

I want to close a page!

Method One: Trigger Mui.back () or return event, note that back is not like the browser history.go (-1) to return to the previous page, but the equivalent of the browser directly close the current tab, here is more special, do not use the browser understanding! That is, Mui.back () will close the current WebView and return to the previous webview, when we use Plus.webview.getWebviewById () to get the returned WebView is not found, Because WebView is turned off, the equivalent of a browser

Method Two: I do not return, I want to close the specified WebView, then I use Plus.webview.getWebviewById (). Close (), such as closing the current page, Plus.webview.currentWebview (). Close (), the effect of this method is the same as the Mui.back () drop

Method Three: Clean out directly, clean up the words will cause the page jump does not produce animation or display loading, because the page will be considered never opened, using: Plus.webview.getWebviewById (). Clear ()

Finalization method: If the home page I set up is login.html, and now my user is logged out, then I want to empty all the webview that he has opened, leaving no traces, using the following code:

Owner.tologin =function() {        varall =Plus.webview.all (); varLaunch = Plus.webview.getLaunchWebview ()//base, it can't be turned off.         for(vari = 0; i < all.length; i++) {            if(All[i] = = =launch)Continue;            All[i].close ();        All[i].clear (); }        //quit now .SetTimeout (function() {launch.show ();//do not reopen the Login,app dock is the login page, directly show out on the line}, 0); }

It is not rude to shut down all webview and empty, will cause the app to close, as long as only the last WebView is closed, the default app quit!

Scene Four:

Open a webview that has been opened and has not been close or clear:

Use: Plus.webview.getWebviewById (). Show ()

Use: Plus.webview.getWebviewById (). Hide ()//hidden

Note: Closed and emptied, the returned WebView will return null and cannot be manipulated!

Summarize the webview!

The plus object provided by the MUI encapsulates the operation of the WebView, and the variable under the object can be obtained by entering Plus.webview in Hbuilder

Here are three get methods to get WebView:

Get: Base (is the homepage), the current top page (actually is currently displayed), according to the ID to get WebView

The return is Webviewobject, and this object has the following:

And so on, see for yourself in Hbuilder!

What is the webview of MUI Development app?