Hay varias formas para que webview interactúe con html5
Todos los principiantes en Android deberían conocer el componente webView. Lo entendí brevemente antes, pero cuando tuve que usar webview en un proyecto, descubrí el poder de webview. Hoy compartiré algunas experiencias sobre el uso de webview.
1. Primero, comprenda la vista web.
El texto original de webview es el siguiente: Una Vista que muestra páginas web. Esta clase es la base sobre la cual puede ejecutar su propio navegador web o simplemente mostrar algún contenido en línea dentro de su Actividad. Motor de renderizado WebKit para mostrar páginas web e incluye métodos para navegar hacia adelante y hacia atrás a través de un historial, acercar y alejar, realizar búsquedas de texto y más.
De lo anterior debes entender la función básica, que es mostrar páginas web. La razón por la que digo que webview es poderosa es porque es muy conveniente interactuar con js y se puede implementar fácilmente.
2. ¿Qué puede hacer la vista web?
① webView puede usar html para el diseño de la interfaz. Aunque relativamente pocas personas lo usan actualmente, creo que definitivamente funcionará cuando algunos clientes necesiten gráficos y texto complejos (tanto los gráficos como el texto se generan dinámicamente). buena elección.
② Muestra directamente la página web. Esta función es, por supuesto, su función más básica.
③Interactuar con js. (Si su base js es mejor que su base java, entonces usar este método para realizar un procesamiento complejo es una buena opción).
3. ¿Cómo utilizar la vista web?
Aquí usamos directamente una demostración eliminada de svn, primero instalamos la demostración y luego explicamos.
El diagrama de estructura de la demostración es el siguiente:
WebViewDemo.java
paquete com.google.android.webviewdemo;
import android.app.Activity;
importar android.os.Bundle;
importar android.os.Handler;
importar android.util.Log;
importar android.webkit.JsResult;
importar android.webkit.WebChromeClient;
importar android.webkit.WebSettings;
importar android.webkit.WebView;
/**
* Demuestra cómo incrustar un WebView en su actividad. También demuestra cómo
* tener javascript en la llamada de WebView en la actividad y cómo. la actividad
* puede invocar javascript.
*
* En este ejemplo, al hacer clic en Android en WebView se generará una llamada a
* el código de actividades en {@link DemoJavaScriptInterface#clickOnAndroid()}. Este código
* dará la vuelta e invocará javascript usando {@link WebView#loadUrl(String)}
* método.
*
* Obviamente, todo esto podría haberse logrado sin llamar a la actividad
* y luego volver a javascript, pero este código tiene como objetivo mostrar cómo configurar las
* rutas de código para este tipo de comunicación.
*
* /
clase pública WebViewDemo extiende Actividad {
cadena final estática privada LOG_TAG = "WebViewDemo";
WebView privada mWebView;
privada Handler mHandler = new Handler();
@Override
public void onCreate(Bundle icicle) {
super.onCreate(icicle);
conjunto
ContentView(R.layout.main);
mWebView = (WebView) findViewById(R.id.webview);
WebSettings webSettings = mWebView.getSettings();
webSettings.setSavePassword(false);
webSettings.setSaveFormData(false);
webSettings.setJavaScriptEnabled(true);
webSettings.setSupportZoom(false); );
mWebView.setWebChromeClient(nuevo MyWebChromeClient());
mWebView.addJavascriptInterface(nuevo DemoJavaScriptInterface(), "demostración");
mWebView.loadUrl ("file:///android_asset/demo.html");
}
clase final DemoJavaScriptInterface {
DemoJavaScriptInterface() {
}
/**
* Esto no se llama en el hilo de la interfaz de usuario. Publicar un ejecutable para invocar
* loadUrl en el hilo de la interfaz de usuario.
*/
public void clickOnAndroid() {
mHandler.post(new Runnable() {
public void run() {
mWebView.loadUrl("javascript:wave()");
}
});
}
}
/**
* Proporciona un enlace para llamar a "alerta" desde javascript. Útil para
* depurar su javascript.
*/
clase final MyWebChromeClient extiende WebChromeClient {
@Override
público booleano onJsAlert (vista WebView, URL de cadena, mensaje de cadena, resultado de JsResult ) {
Registro.d(LOG_TAG, m
mensaje);
resultado.confirm();
devuelve verdadero;
}
}
}
demo.html
>
main.xml
android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_width="fill_parent" android:layout_height="wrap_content" android: text="@string/intro" android:padding="4dip" android:textSize="16sp" /> android:id="@+id/webview" android:layout_width="fill_parent" android:layout_height="0dip" android:layout_weight="1" />
4.
①Cómo Android llama a js.
Formulario de llamada:
mWebView.loadUrl("javascript:wave()");
Donde wave() es un método en js, por supuesto que Este método se puede cambiar a otros métodos, es decir, Android llama a otros métodos.
②¿Cómo llama js a android?
Formulario de llamada:
La "demostración" en el código se especifica en la llamada de Android nombre, es decir
mWebView.addJavascriptInterface(new DemoJavaScriptInterface(), "demo");
clickOnAndroid() en el código es el objeto correspondiente a "demo": new DemoJavaScriptInterface( ) uno de los métodos.
③Interacción bidireccional.
Por supuesto, simplemente combina los dos métodos anteriores.
5. Explica la demostración.
Ahora debes entender la interacción entre android y js. Es hora de analizar algunas demostraciones. Según lo que dije anteriormente, debería tener una comprensión más clara. El proceso de interacción específico es el siguiente:
① Haga clic en la imagen y el método clickOnAndroid () en Android se llama directamente en el lado js
②El método clickOnAndroid (); (usando hilos) llama al método js.
③El js llamado por ② controla directamente el html.
Resumen personal: al usar webView, a veces el diseño de la interfaz de usuario se puede convertir al código html correspondiente, existen herramientas poderosas como DW para estilos de diseño html y hay muchos códigos fuente en Internet. piezas de código. Ahorrará mucho tiempo en la interfaz de usuario y los efectos visuales, y no tiene sentido reinventar la rueda.