Belajar Android: Membuat Launcher Website/Blog

Untuk menambah kedekatan dengan pembaca setia website atau blog anda, khususnya jika blog anda cukup banyak diakses dari platform mobile (Android, Opera Mini, iPhone dll), layaknya anda pertimbangkan untuk mempraktikkan tutorial ini. Tutorial ini akan mempelajari bagaimana cara membuat launcher sederhana dari website/blog anda sehingga hadir (seolah-olah) native di handset pembaca.

Sebelum anda mengikuti tutorial ini, hendaknya anda sudah mengerti sedikit tentang Java, Android SDK, Eclipse.

Membuat Proyek Baru

Buka editor Eclipse. Untuk membuat project baru, silakan klik menu File -> New -> Android Application Project.



Isikan variabel untuk Application Name, Project Name dan Package Name. Pilih SDK minimum yang didukung (hendaknya Android 2.2 Froyo) dan pilih SDK target (hendaknya Android 2.3, edisi rata-rata android di Indonesia saat ini). Klik tombol Next.

Layout Dasar

Untuk membuat layout dasar dari aplikasi anda, silakan buka file /res/layout/activity_main.xml. Pilih tab Graphical Layout. Tambahkan elemen WebView (anda bisa temukan di bagian palette Composite).

Tambahkan Permission

Setiap aplikasi android mempunya permission (perijinan) nya sendiri. Untuk aplikasi launcher, setidaknya anda harus mengeset agar user memberikan permission untuk mengakses Internet (android.permission.INTERNET). Silakan buka file android_manifest.xml. Pilih tab Permission dan tambahkan Permission baru dengan tipe User Permission dan string permission android.permission.INTERNET.

Edit Script Utama

Inilah bagian utama dari aktivitas kita. Silakan edit file main activity anda dan tambahkan script untuk membuat dan mengisi elemen WebView yang sudah kita buat:

tambahkan pada method onCreate:

[sourcecode language="java"]
//load emka.web.id
WebView mywebview = (WebView) findViewById(R.id.webView1);
mywebview.loadUrl("https://emka.web.id");
[/sourcecode]

tambahkan library Webview dengan menuliskan

[code]import android.webkit.WebView;[/code]

Mengijinkan Javascript

Tentunya website anda sudah menggunakan javascript. Untuk mengeset browser WebView supaya dapat mengakses javascript, silakan tambahkan sourcecode berikut pada method onCreate:

[sourcecode language="java"]
WebSettings webSettings = mywebview.getSettings();
webSettings.setJavaScriptEnabled(true);
[/sourcecode]

Mengijinkan Pembaca Membuka Link pada Interface yang Sama

Jika anda ingin membuat pembaca selalu membuka link pada interface webview (launcher) anda, silakan tambahkan sourcecode berikut:

[sourcecode language="java"]
mywebview.setWebViewClient(new WebViewClient());
[/sourcecode]


Berikut adalah sourcecode lengkapnya. Sudah saya tambahkan kemampuan javascript, zoom, browsing klik dan toast selamat datang/loading:
[sourcecode language="java"]
package com.luthfiemka.emkawebidlauncher;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Toast;

public class MainActivity extends Activity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toast.makeText(getApplicationContext(), "Loading...", Toast.LENGTH_LONG).show();

//load emka.web.id
WebView mywebview = (WebView) findViewById(R.id.webView1);
mywebview.loadUrl("https://emka.web.id");

//enable javascript
WebSettings webSettings = mywebview.getSettings();
webSettings.setJavaScriptEnabled(true);

webSettings.setBuiltInZoomControls(true);

//handling clicks
mywebview.setWebViewClient(new WebViewClient());

}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.activity_main, menu);
return true;
}

@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
if ((keyCode == KeyEvent.KEYCODE_BACK) && mywebview1.canGoBack()) {
mywebview1.goBack();
return true;
}
return super.onKeyDown(keyCode, event);
}

}
[/sourcecode]

Download Sourcecode

Download full sourcecodenya disini: via SistemInformasi.biz.

Test dengan Eclipse. Selamat mencoba!