RSS

Web View Android Application

11 Jul

Jumpa lagi dengan saya Fairuz di kesempatan yang berbahagia ini #halahūüėÄ. Pada tutorial kali ini, saya akan membuat sebuah aplikasi android degan nama “Web View Android Application”. Yapp, sesuai dengan namanya, aplikasi ini akan menampilkan sebuah halaman web tertentu ketika kita menjalankan aplikasi tersebut. Yaa bisa dikatakn juga aplikasi ini merupakan sebuah bookmark dan juga shortcut bagi kita untuk memasuki sebuah halaman web. Jadi, kita tidak perlu lagi susah-susah untuk mengetikkan url halaman web yang kita ingin jelajahi. Kita hanya perlu meg-klik aplikasi ini dan kita kan langsung dibawanya menuju ke halaman web tertentu tersebut. Tapi, tentu saja kita membutuhkan koneksi internet untuk dapat menjalankan aplikasi ini.

Baiklah, tanpa memperpanjang kata kita mulai saja membuat aplikasi “Web View Android Application” iniūüôā.

    • Pertama-tama kita buat sebuah project dengan nama¬†WebView¬†lengkapnya seperti di bawah ini :
    • Kemudian kita rubah file¬†main.xml¬†nya seperti source code berikut :
      <?xml version="1.0" encoding="utf-8"?>
      <WebView  xmlns:android="http://schemas.android.com/apk/res/android"
        	android:id="@+id/webview"
        	android:layout_height="fill_parent"
        	android:layout_width="fill_parent"
      />
      
      
    • Setelah itu, kita edit juga file¬†AndroidManifest.xml¬†nya menjadi seperti di bawah ini :
      <?xml version="1.0" encoding="utf-8"?>
      <manifest xmlns:android="http://schemas.android.com/apk/res/android"
            package="com.fairuz.webview"
            android:versionCode="1"
            android:versionName="1.0">
          <uses-sdk android:minSdkVersion="8" />
          <uses-permission android:name="android.permission.INTERNET"></uses-permission>
      
          <application android:icon="@drawable/icon" android:label="@string/app_name">
              <activity android:name="HelloWebView"
                        android:label="@string/app_name"
                        android:theme="@android:style/Theme.NoTitleBar">
                  <intent-filter>
                      <action android:name="android.intent.action.MAIN" />
                      <category android:name="android.intent.category.LAUNCHER" />
                  </intent-filter>
              </activity>
      
          </application>
      </manifest>
      
      
    • Karena aplikasi ini membutuhkan akses internet, maka pada source code di atas, kita menambahkan tag <uses-permission android:name=”android.permission.INTERNET”></uses-permission> yang berfungsi agar mengizinkan user untuk menjalankan aplikasi ini dan terhubung dengan internet.
    • Kemudain kita buka file¬†HelloWebView.java¬†dan ubah source codenya menjadi seperti di bawah ini :
      package com.fairuz.webview;
      
      import android.app.Activity;
      import android.os.Bundle;
      import android.view.KeyEvent;
      import android.webkit.WebView;
      import android.webkit.WebViewClient;
      
      public class HelloWebView extends Activity {
      	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);
              mWebView.getSettings().setJavaScriptEnabled(true);
              mWebView.loadUrl("http://www.google.com");
              mWebView.setWebViewClient(new HelloWebViewClient());
          }
      
          private class HelloWebViewClient extends WebViewClient{
          	@Override
          	public boolean shouldOverrideUrlLoading(WebView view, String url) {
          		view.loadUrl(url);
          		return true;
          	}
          }
      
          @Override
          public boolean onKeyDown(int keyCode, KeyEvent event) {
          	if((keyCode == KeyEvent.KEYCODE_BACK) && mWebView.canGoBack()){
          		mWebView.goBack();
          		return true;
          	}
          	return super.onKeyDown(keyCode, event);
          }
      }
      
      
    • Pada mWebView.getSettings().setJavaScriptEnabled(true); berfungsi agar WebView bisa menampilkan text javascript pada halaman web yang dibuka, sedangkan pada baris¬†mWebView.loadUrl(“http://www.google.com&#8221;); adalah alamat web yg akan dibuka oleh aplikasi dalam hal ini kita menggunakan alamat website google.com. class¬†onKeyDown untuk menghadle perintah back/kembali
    • Kemudian¬†RUN¬†dan akan terlihat seperti gambar berikut ini :
Nah, mudahkan ??!! dengan aplikasi ini kita bisa membuat sebuah aplikasi sederhana yang berbasis web dengan coding yang tidak terlalu panjangūüôā
Baiklah, sekian tutorial kita kali ini, semoga bermanfaat untuk semua. Sampai jumpa di tutorial selanjutnyaūüôā
 
Leave a comment

Posted by on July 11, 2011 in Android, Java, Source Code

 

Tags: , , ,

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
%d bloggers like this: