Kamis, 25 Juli 2013

7/25/2013
Bagi Anda yang baru belajar pemrograman Java khususnya Android, mungkin pembahasan kali ini akan terkesan menarik, kenapa... Sebab saya akan memberikan sedikit contoh pembuatan  aplikasi Android menggunakan javascript tetapi javascript tersebut dapat mengakses java library yang terdapat pada android itu sendiri. Sebagai contoh pada artikel ini saya memakai Toast dan AlertDialog.

Silahkan anda membuat project terlebih dahulu, disini saya menamakannya "JavaScriptInterfaceDemo" dengan peckage "com.didanurwanda.javascriptinterfacedemo"
kemudian buka res\layout\main.xml (Mungkin namanya akan berbeda) dan isi 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" />

Kemudian buka src/nama/peckage/anda dan buat class dengan nama MyJsInterface.java dan isi dengan script berikut.

package com.didanurwanda.javascriptinterfacedemo;

import android.content.Context;
import android.widget.Toast;
import android.app.AlertDialog;
import android.content.DialogInterface;

public class MyJsInterface
{
    Context context;
    
    MyJsInterface(Context context)
    {
        this.context = context;
    }
    
    public void toast(String toast, String length)
    {
        int toast_length;
        if(length.toString().equalsIgnoreCase("LONG"))
            toast_length = Toast.LENGTH_LONG;
        else
            toast_length = Toast.LENGTH_SHORT;
            
        Toast.makeText(context, toast, toast_length).show();
    }
    
    public void dialog(String message)
    {
        AlertDialog.Builder alert = new AlertDialog.Builder(context);
        alert.setMessage(message);
        alert.setCancelable(false);
        alert.setPositiveButton("Ok", new DialogInterface.OnClickListener(){
            @Override
            public void onClick(DialogInterface intface, int id)
            {
                toast("Anda menekan tombol pada dialog", "LONG");
            }
        });
        alert.show();
    }
}

Selanjutnya buka MainActivity.java dan isi juga seperti berikut.

package com.didanurwanda.javascriptinterfacedemo;

import android.app.Activity;
import android.os.Bundle;
import android.view.KeyEvent;
import android.view.Window;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;

public class MainActivity extends Activity
{
    WebView webview;
    WebSettings websettings;
    
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        this.requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.main);
        
        webview = (WebView) findViewById(R.id.webview);
        websettings = webview.getSettings();
        websettings.setJavaScriptEnabled(true);
        webview.setWebViewClient(new WebViewClient());
        webview.addJavascriptInterface(new MyJsInterface(this), "didanurwanda");
        webview.loadUrl("file:///android_asset/www/index.html");
    }
    
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event)
    {
        if((keyCode == KeyEvent.KEYCODE_BACK) && webview.canGoBack())
        {
            webview.goBack();
            return true;
        }
        return super.onKeyDown(keyCode, event);
    }
}

Setelah itu buka folder assets kemudian buat folder www, ini digunakan untuk menyimpan file html dan javascript. setelah itu buka folder www tadi dan tambahkan atau buat file index.html dan isi seperti berikut.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>JavaScript Interface Demo</title>
    <style type="text/css">
        body { text-align: center }
    </style>
    
    <script type="text/javascript">
        function tampil_toast()
        {
            didanurwanda.toast('Anda sedang menampilkan toast menggunakan javascript', 'LONG');
        }
        
        function tampil_dialog()
        {
            didanurwanda.dialog('Anda menampilkan dialog menggunakan javascript');
        }        
    </script>
</head>
<body>
    <h2>Demo JavaScript Interface pada Android</h2>
    <a href="http://didanurwanda.blogspot.com">http://didanurwanda.blogspot.com</a>
    <br />
    <button onClick="tampil_toast()">Tampilkan Toast</button>
    <br />
    <button onClick="tampil_dialog()">Tampilkan Dialog</button>
</body>
</html>

dan buka juga AndroidManifest.xml kemudian tambahkan

<uses-permission android:name="android.permission.INTERNET" /> 

Mudah bukan, hhehe. Untuk penjelasan sepertinya tidak perlu, sebab dengan melihat kodenya pasti anda sudah mengerti.

Berikut Penampakannya



Download
Password : didanurwanda.blogspot.com

0 komentar:

Posting Komentar

Pada komentar harap tidak mencantumkan Link yang bersifat promosi.