Membuat Aplikasi Web Launcher Di Android
Seperti biasa, masih mengenai java, dari pada gak ada kerjaan (sebenarnya kerjaan banyak, apalagi ditambah sama ketua HMTI buat jadi panitia TO, jadi makin banyak & repot) lebih baik saya buat tutorial. Ditutorial kali ini saya akan membuat aplikasi android seperti judul diatas, Web Launcher. Apa itu web launcher, web launcher itu sebuah aplikasi kecil untuk masuk ke halaman web/blog kita tanpa perlu membuka web browser dan mengetikan URL. Aplikasi web launcher ada 2 macam, cara pertama cukup mudah, tinggal buat project lalu memasang WebView dengan width dan height diset fill-parent dan mengatur agar webView langsung load halaman web yang dimaksud saat pertama jalan. Selesai sudah..!! Tapi… dimana seninya, kalau cuma yang standar-standar gitu?
Ditutorial kali ini saya akan membuat web launcher yang bisa meload halaman berikutnya tetap di dalam launcher (tidak membuat web browser), bisa menampilkan progress bar, dan punya feature zoom-in/out, mirip seperti aplikasi facebook,dll. jadi baca sampai habis..!!
Berhubung web HMTI belum tersedia versi mobile, jadi mungkin halaman aplikasi kita kurang sempurna karena tampilannya, tapi tidak apa-apa, saya buat aplikasi ini untuk bahan belajar siapa tau ada yang perlu membuat web launcher untuk web/blog nya sekaligus memperkenalkan web resmi HMTI, agar siapa yang pakai aplikasi ini pasti tau HMTI (yayalah, la wong aplikasinya langsung masuk ke web HMTI), terima kasih untuk sesepuh HMTI sudah diberi izin untuk membuat web launcher nya, semoga amal ibadahmu diterima disisinya... hehee
Seperti biasa, kita buat project baru di IDE kesayangan kita (Eclipse), tak usah menerangkan bagaimana cara membuat project baru di eclipse untuk membuat aplikasi android, karena sangat melelahkan, sebaiknya cari tau sendiri saja :) . Lalu beri nama project tsb HMTI, setelah project selesai dibuat, sekarang saatnya kita rubah isi dari main.xml yang terletak di folder res/layout, hapus semua source code xml tsb dan rubah seperti berikut
<?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"
/>
Setelah selesai, sekarang kita buat file xml lagi, kita beri nama about.xml dan simpan satu folder bersama main.xml yaitu di folder res/layout. isi about.xml dengan source code berikut
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="10dip">
<TextView
android:id="@+id/about_content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/about_text" />
</ScrollView>
Kalau sudah jadi, akan nampak seperti ini
Selesai membuat semua file xml, sekarang kita rubah icon-icon default milik android, agar aplikasi kita mempunyai icon sesuai keinginan kita. Hapus dulu folder drawable-hdpi, drawable-mdpi dandrawable-ldpi yang ada di folder res. lalu download kumpulan icon berikut disini, extract dan masukan difolder res. lihat gambar
Setelah selesai, sekarang waktunya kita coding java....
Sekarang buka file hmti.java atau activity nya yang ada di folder src dan kita rubah seperti seperti ini
import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.Window;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
public class hmti extends Activity {
public static final int ABOUT = Menu.FIRST+1;
public static final int EXIT = Menu.FIRST+2;
//membuat option menu
@Override
public boolean onCreateOptionsMenu(Menu menu) {
menu
.add(Menu.NONE, ABOUT, Menu.NONE, "About")
.setIcon(R.drawable.hmti_about);
menu
.add(Menu.NONE, EXIT, Menu.NONE, "Exit")
.setIcon(R.drawable.hmti_exit);
return super.onCreateOptionsMenu(menu);
}
//aksi untuk option menu yg terpilih
@Override
public boolean onOptionsItemSelected(MenuItem item) {
// TODO Auto-generated method stub
switch (item.getItemId()) {
case ABOUT:
startActivity(new Intent(this, About.class));
return(true);
case EXIT:
finish();
return(true);
}
return(super.onOptionsItemSelected(item));
}
/** Called when the activity is first created. */
final Activity activity = this;
//aplikasi
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
this.getWindow().requestFeature(Window.FEATURE_PROGRESS);
setContentView(R.layout.main);
WebView webView = (WebView) findViewById(R.id.webview);
webView.getSettings().setJavaScriptEnabled(true);
webView.setWebChromeClient(new WebChromeClient() {
@Override
public void onProgressChanged(WebView view, int newProgress) {
activity.setTitle("Loading coy...");
activity.setProgress(newProgress * 100);
if (newProgress == 100) {
activity.setTheme(R.string.app_name);
activity.setTitle("HMTI");
}
}
});
webView.setWebViewClient(new WebViewClient() {
@Override
public void onReceivedError(WebView view, int errorCode,
String description, String failingUrl) {
super.onReceivedError(view, errorCode, description, failingUrl);
}
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
view.loadUrl(url);
return true;
}
});
webView.loadUrl("http://www.hmtibansal.org");
}
}
Setelah selesai, masih difolder yang sama, di src , kita buat file java baru bernama about.java , file ini berfungsi untuk option menu, aplikasi kalau tidak ada option menu rasanya kurang lengkap.
Setelah selesai membuat file, sekarang isi about.java dengan source code berikut
package com.hmti.main;
import android.app.Activity;
import android.os.Bundle;
public class About extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.about);
}
}
Setelah selesai coding java nya, sekarang kembali ke xml, kita rubah lagi file AndroidManifest.xml sekaligus menambahkan permission internet agar aplikasi kita diperbolehkan membuka halaman web juga menambahkan akses activity untuk menu option, rubah source codenya seperti berikut
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.hmti.main" android:versionCode="1" android:versionName="1.0">
<application android:icon="@drawable/icon" android:label="@string/app_name">
<activity android:name=".hmti" android:label="@string/app_name">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity android:name="About"
android:theme="@android:style/Theme.Dialog" android:label="@string/about_title"></activity>
</application>
<uses-sdk android:minSdkVersion="4" />
<uses-permission android:name="android.permission.INTERNET"></uses-permission>
</manifest>
Langkah terkahir sekarang kita ubah file strings.xml yang ada di folder res/values seperti berikut
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">HMTI</string>
<string name="about_label">About</string>
<string name="about_title">HMTI Launcher</string>
<string name="about_text">software by : <b>Umbara</b>
</string>
<string name="main_title">HMTI</string>
</resources>
Sekarang selesai sudah pembuatan aplikasinya, saat kita compile dan jalankan, kalau tidak ada error aplikasi akan berjalan seperti ini
Sampai disini kita telah sukses membuat aplikasi android.
Sekian dari saya Wassalammualaikum wr wb.
