Nessun risultato. Prova con un altro termine.
Guide
Notizie
Software
Tutorial
  • Lezione 21 di 97
  • livello avanzato
Indice lezioni

Visualizzare pagine Web: WebView

Come visualizzare pagine web all'interno della propria applicazione utilizzando le WebView.
Come visualizzare pagine web all'interno della propria applicazione utilizzando le WebView.
Link copiato negli appunti

Una WebView è un tipo di View che permette di visualizzare pagine web. La sua utilità principale è quella di permettere di integrare una web application o più in generale un sito web nella propria applicazione. Il motore della WebView risiede nella libreria WebKit già inclusa all'interno di Android per questo possiamo parlare di questo componente come di un browser vero e proprio in grado di eseguire Javascript e mostrare layout nella maniera più completa possibile.

Nella figura viene mostrato un semplicissimo esempio in cui il layout dell'Activity è costituito esclusivamente dalla WebView e la si è usata per visualizzare direttamente il contenuto della pagina https://www.html.it.

Per ottenere questo risultato si sono compiute tre semplici operazioni:

  1. si è creato un layout come il seguente:
    <WebView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/webview"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    />
  2. si è richiesto alla WebView, già nell'onCreate dell'Activity, di caricare l'indirizzo remoto:
    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            WebView myWebView = findViewById(R.id.webview);
            myWebView.loadUrl("https://www.html.it");
    }
  3. si è provveduto ad impostare nell'AndroidManifest.xml, all'interno direttamente del nodo <manifest>, la permission per il collegamento ad Internet:
    <manifest xmlns:android="http://schemas.android.com/apk/res/android"
    ...
    ...
    <uses-permission android:name="android.permission.INTERNET"/><application
    ...
    ...

Delle permission si è parlato già in questa guida. La permission
INTERNET è tuttavia una delle cosiddette permission normal che non deve essere accettata dall'utente a runtime.
In questo caso, la nostra applicazione vuole accedere ad Internet per mezzo della WebView e per questo deve dichiararlo, semplicemente inserendo tale direttiva nel manifest.

WebView e Javascript

Non si può parlare di Web al giorno d'oggi senza considerare Javascript. Di default, il suo uso in una WebView non è attivo. Per abilitare Javascript è sufficiente inserire queste righe di codice:

WebSettings webSettings = myWebView.getSettings();
webSettings.setJavaScriptEnabled(true);

Come si vede si è fatto uso delle WebSettings di WebView. Si tratta di un insieme di configurazioni che possono essere impostate per regolare tutti i comportamenti del componente quando si trova a fronteggiare le classiche problematiche da browser:

  • cache;
  • font e layout;
  • privacy e sicurezza.

La WebView può fare anche in modo che Javascript interagisca con il codice Java presente nell'applicazione. Per fare questo è necessario:

  • creare il codice Java che vogliamo richiamare in Javascript apponendo l'annotazione @JavascriptInterface sui metodi che devono essere visibili "da Javascript":
    public class WebAppInterface
    {
    ...
    ...@JavascriptInterface
    public void executeJavaCode()
    {
    /*
    Codice da attivare DA JAVASCRIPT
    */
    }
    }
  • registriamo presso la WebView il nostro oggetto Java, assegnandogli un'etichetta di nostra scelta, in questo caso AndroidObject:
    WebView myWebView = findViewById(R.id.webview);
    myWebView.addJavascriptInterface(new WebAppInterface(), "AndroidObject");

Dopo questi passi, da Javascript potremo invocare il metodo executeJavaCode sull'oggetto Java che sarà stato registrato nella WebView con l'etichetta AndroidObject. Ad esempio, nella pagina web che richiameremo dalla WebView potremo usare il seguente snippet Javascript:

<script type="text/javascript">
function interactWithAndroid()
{
AndroidObject.executeJavaCode();
}
</script>

Ti consigliamo anche