«

»

may 06 2012

Usando WebView en Android

A la hora de desarrollar nuestras apps podemos decantarnos por hacerlo en HTML y JavaScript buscando la compatibilidad multiplataforma, o simplemente dentro de nuestras apps queremos mostrar algun contenido web sin que la experiencia de usuario se vea decrementada al notar que salimos de la app. Tanto para uno como otro caso el elemento que hace esto posible es el WebView y hoy os vamos a enseñar como usarlo:

 

Una vez creado nuestro proyecto Android incluiremos en nuestro layout una vista del tio WebView y le añadiremos una etiqueta de identificación:

<?xml version="1.0" encoding="utf-8"?>

<WebView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:id="@+id/webview" />

 

Posteriormente desde el código de nuestra activity cambiaremos las settings del WebView si procede e indicaremos la url a cargar en el mismo:

public class MainActivity extends Activity {
    private WebView mWebView;
	
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        mWebView = (WebView) findViewById(R.id.webview);
       
        // Activo JavaScript
        mWebView.getSettings().setJavaScriptEnabled(true);
       
        // Cargamos la url que necesitamos    
        mWebView.loadUrl("http://www.ingens-networks.com/blog/");
    }

 

Como veis es muy sencillo y carece de misterio, tan solo tener en cuenta que para conectarnos a Internet necesitamos no olvidar indicar el permiso correspondiente en el manifiesto:

<uses-permission android:name=“android.permission.INTERNET” />

 

Otro detalle a tener en cuenta es que si dentro de nuestra app pulsamos un enlace se nos abrirá el navegador, si queremos evitar esto bastara con crearnos la siguiente clase:

private class verMiWeb extends WebViewClient {
	@Override
	public boolean shouldOverrideUrlLoading(WebView view, String url) {
		view.loadUrl(url);
		return true;
	}
}

 

Espero que os sea de utilidad, nosotros ya lo estamos usando.

 

vía | Ingens Blog

 

Acerca del autor

JMPergar

Mobile Developer at @BeRepublic & Founder of @AndroCode. Silver Speaker & Member of Core Team at @GDGBarcelona.

  • http://desandroid.com DesAndrOId

    No me queda muy claro lo de la clase “WebViewClient”, no veo como la vinculas al WebView.

    Lo mismo no hace falta, pero POR COMENTARLO!!!!!

    Salu2

    • http://www.linkedin.com/in/jmpergar JMPergar | Editor Jefe

      Tienes razon, debes asociarlo con el siguiente metodo:

      webview.setWebViewClient(WebViewClient wvc)

      Puedes ver un uso del mismo en el tutorial de inyectar JavaScript.

  • Miguel Angel

    Lo que pasa es que la clase WebViewClient es un poco limitada y a veces tienes que tirar de WebChromeClient para aspectos más avanzados como la geolocalización

  • ricardo

    El que no te habra el navegador al pulsar enlace no lo entiendo, creo una nueva clase (.java) y meto ese codigo y lo que pones en el comentario donde lo meto? Soy novato y nose muy bien donde va cada cosa aun, gracias.

    • http://www.linkedin.com/in/jmpergar JMPergar | Editor Jefe

      La clase te la creas como privada interna y en el onCreate la instancias y las asocias al WebView mediante el metodo del comentario, esto lo haces en el onCreate.

  • José Rubio

    Como habilito javascript en mi tablet? (con android 2.2 ) algunas aplicaciones y plataformas de e learning no me funcionan y me mandan un mensaje “debe habilitar javascript en el navegador” Estas aplicaciones son Messenger, Hotmail, y la e learning del sena.
    Si le es posible ayudarme se lo agradezco!!

    • http://www.linkedin.com/in/jmpergar JMPergar | Editor Jefe

      Primero comentarte que este no es el sitio para realizar este tipo de preguntas aunque no me importa reponderlas, te deberias de dirigir a AndroTalk nuestro blog generico sobre Android, preferiblemente mediante su cuenta de twitter o cualquiera de sus cuentas en otras de sus redes. Igualmente si prefieres preguntarnos a nosotros el lugar seria mediante estas redes.

      Respondiendo a tu pregunta el tema de habilitar el javascript dependera del navegador que uses.

  • apellizcos

    Gracias por tu aporte rapido y directo todo clarisimo

  • Manuel

    Esta muy bien la pagina la descubri hace poco y estoy viendo todos los articulos, he empezado hace poco con eclipse y con la programación, he echo una app con el webview pero queda mucho cache, y queria preguntarte si se puede borrar la cache al finalizar la aplicación. Gracias y seguir asi.

  • Nas

    Buenas noches estoy realizando un proyecto para mi carrera, y tengo algunas dudas acerca de ver datos de una url. Lo que intento hacer es que al hacer click en un botón de mi aplicación android se ve represente en una actividad el tiempo de una ciudad concreta. A través de la siguiente pagina:

    http://www.aemet.es/es/eltiempo/widgets/municipios/madrid-id28079

    obtengo un código que no se si existe alguna manera de poder incluirlo en mi aplicación android, es este:

    El Tiempo. Consulte la predicción de la AEMET para Madrid

    Un saludo y muchas gracias

  • http://gravatar.com/tonireina89 tonireina89

    A mi me sucede que pongo un boton para un webview(Maps) y otro para (calendar) y solo me abre el maps al pulsar el otro se cierra la app.

  • https://www.facebook.com/andres.gonzalezblanco Andrés González Blanco

    Puedes poner mas claramente, como quedan las clases para que no te salga el navegador por favor.

    Muchas Gracias, un saludo.

  • http://gravatar.com/scaflan Claw-Hammer

    Saludos, aquí un ejemplo de cómo evitar que se abra el navegador al hacer pulsar un link dentro de nuestra aplicación:

    
    public class MainActivity extends Activity {
    	
    	private Button adelante, atras;
    	private WebView pagina;
    
    	@SuppressLint("SetJavaScriptEnabled")
    	@Override
    	protected void onCreate(Bundle savedInstanceState) {
    		super.onCreate(savedInstanceState);
    		setContentView(R.layout.activity_main);
    		
    		pagina = (WebView) findViewById(R.id.wvpagina);
    		adelante = (Button) findViewById(R.id.btAdelante);
    		atras = (Button) findViewById(R.id.btAtras);
    		
    		pagina.getSettings().setJavaScriptEnabled(true);
    		pagina.loadUrl("http://www.google.com/");
    		pagina.setWebViewClient(new WebViewClient()
    		
    		{
    			
    		@Override
    		public boolean shouldOverrideUrlLoading(WebView view, String url)
    		
    		{
    			return false;
    		}
    		
    		});
    	}
    
    
    • Danny

      Gracias!! :D

  • http://gravatar.com/coroleu coroleu

    Hola. Tengo una web responsive y quiero convertirla en app. El webview me reconoce automaticamente el diseño responsive al mostrar la web? gracias!

  • http://gravatar.com/ebermania David

    Gracias JMPergar!!! Esto me sirve muchísimo! Voy a recomendar tu sitio.

  • http://gravatar.com/ectormendoza hector mendoza

    gracias por el ejemplo, muy bueno e ilustrtivo

  • Jose

    Gracias por la info, Y como se hace para abrir una url diferente según el idioma del usuario? Es que no doy con ello, Gracias.

  • junior

    amigo tengo una gran duda y he intetado resolverla espero me puedan ayudar,
    como hacer para insertar una publicidad admob y una webview y que ademas la webView al pulsar un link no abra el navegador

  • Ivan Aucancela

    hola saludos un consulta ……….. es posible… pasa un parametro a un webview desde un activity

  • System GCMX

    que tal tengo un sitio web donde un empleado inicia sesion para registrar su ubicacion,
    que se obtiene mediante un boto y una funcion javascript y funciona perfecto pero a la hora
    de mostrar mi sitio dentro de una aplicacion android en un webview me muestra un mensaje de que no es posible mostrar la ubicación, creo que ya coloque todos los permisos para javascript y Chrome y no me permite obtener la ubicación solamente que entre por medio de la aplicación de GoogleChrome
    codigo:
    myWebView.getSettings().setJavaScriptEnabled(true);
    myWebView.getSettings().setBuiltInZoomControls(true);
    myWebView.setWebViewClient(new myWebViewClient());
    myWebView.setWebChromeClient(new WebChromeClient());