Modifikasi Title Jendela Alert pada Control WebView Android

Pada posting sebelumnya sudah dibahas tentang bagaimana agar aplikasi hybrid (gabungan aplikasi native dengan web, dengan menggunakan kontrol WebView) dapat terlihat se-native mungkin, dengan akal-akalan agar setiap ada perpindahan dari satu halaman ke halaman lain ditampilkan Progress Dialog, seperti yang bisa dibaca kembali pada link berikut http://www.rezafaisal.net/?p=1041. Dan hasilnya tidak mengecewakan.

blog1

Bukan hanya itu, karena pada form tersebut di atas terdapat fitur untuk upload file, maka juga perlu dilakukan modifikasi agar WebView dapat melakukan hal tersebut. Selain agar memang aplikasi hybrid yang dibuat tetap “terlihat” native. Sehingga dapat terlihat seperti gambar di bawah ini.

blog2

Cakep! Memang ide hebat dari sang ninja untuk hal ini :)

Nah berikutnya adalah kasus berikut ini.

Karena WebView adalah control yang “isi”-nya adalah halaman web, maka banyak prilaku yang bisa ditampilkan pada web browser juga dapat ditampilkan termasuk jendela Alert dari JavaScript. Secara default jendela Alert dapat ditampilkan pada WebView dengan tampilan seperti berikut :

blog3

Nah pada title jendela Alert tersebut akan langsung ketahuan ternyata “isi” aplikasi ini adalah halaman web, oleh karena itu kita harus lakukan modifikasi sedikit agar title jendela tersebut tidak menunjukkan alamat web atau alamat IP seperti pada gambar tersebut. Yang perlu dilakukan adalah cukup menggunakan kode  untuk melakukan override seperti berikut :

webView.setWebChromeClient(new WebChromeClient() {

            

    @Override

    public boolean onJsAlert(WebView view, String url, String message, final android.webkit.JsResult result)

    {

        new AlertDialog.Builder(activity)

        .setTitle("Petunjuk")

        .setMessage(message)

        .setPositiveButton(android.R.string.ok, new AlertDialog.OnClickListener()

        {

            @Override

            public void onClick(DialogInterface arg0, int arg1) {

                result.confirm();

            }

        }).setCancelable(false).create().show();

        return true;

    }

});

Hasilnya bisa dilihat pada gambar berikut :

blog4

Gampang kan? Buat apa native kalau bisa hybrid #eh :)

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.