Une méthode facile pour passer d’une application (service) web, à une application native Android est l’utilisation d’une classe bien spéciale sous Android appelée WebView. Cette classe, qui hérite de la classe View offre la possibilité d’afficher une page web à l’intérieur d’une activité. On peut donc, à partir d’un site web (à peu près) optimisé pour les mobiles, créer une application dite native. Voyons comment ça marche.
- Ajouter le WebView au layout
C’est la première chose à faire. Cliquez donc sur votre fichier layout.xml ou une chose du genre, et ajouter les lignes suivantes :
1
2
3
4
5
6
|
<?xml version="1.0" encoding="utf-8"?>
<WebView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/webview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>
|
</p>
On y dit simplement que notre WebView (et donc notre page web) s’affichera de façon à occuper tout l’espace qui lui est offert par son élèment parent (fill_parent).
- Appeler le WebView dans votre activité
A prèsent dans votre activité principale, il vous suffit d’initialiser votre WebView et d’afficher le site, en utilisant la méthode loadUrl():
1
2
3
|
WebView myWebView = (WebView) findViewById(R.id.webview);
myWebView.loadUrl("http://m.charlesen.fr");
myWebView.setWebViewClient(new WebViewClient()); // Tous les liens s'ouvriront directement depuis la WebView
|
</p>
La dernière chose à faire est d’autoriser l’accès internet à votre application, en modifiant le fichier manifest :
1
2
3
4
|
<manifest ... >
<uses-permission android:name="android.permission.INTERNET" />
...
</manifest>
|
</p>
Voici un exemple complet, avec mon site web mobile développé à l’aide de jQuery Mobile, et porté sous Android :
|
Activité principale
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
|
package fr.charlesen.projets;
import android.app.Activity;
import android.os.Bundle;
import android.webkit.WebSettings;
import android.webkit.WebView;
public class charlesenmob extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
// Instanciation du WebView...
WebView wvSite = (WebView)findViewById(R.id.webview);
//...on active JavaScript...
WebSettings webSettings = wvSite.getSettings();
webSettings.setJavaScriptEnabled(true);
//...et on charge la page
wvSite.loadUrl("http://m.charlesen.fr");
}
}
|
|
main.xml
|
1
2
3
4
5
6
7
8
9
|
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="fill_parent">
<WebView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/webview" android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</LinearLayout>
|
|
strings.xml
|
1
2
3
4
5
6
7
|
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">charlesen.fr</string>
<string name="homepage">charlesen.fr - Version Mobile</string>
</resources>
|
|
Fichier manifest
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="fr.charlesen.projets" android:versionCode="1"
android:versionName="1.0">
<uses-permission android:name="android.permission.INTERNET" />
<uses-sdk android:minSdkVersion="9" />
<application android:icon="@drawable/icon" android:label="@string/app_name">
<activity android:name=".charlesenmob" android:label="@string/homepage">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
|
Ca donne ça avec l’émulateur :
WebView myWebView =(WebView) findViewById(R.id.webview);
myWebView.loadUrl("http://www.example.com");
</p>