TUTORIAL MEMBUAT APLIKASI SEDERHANA WEBVIEW DENGAN ANDROID STUDIO

TUTORIAL MEMBUAT APLIKASI SEDERHANA WEBVIEW DENGAN ANDROID STUDIO

Tutorial kali ini, saya akan membahas tentang WebView pada aplikasi Android Studio. WebView adalah sebuah class pada android yang menampilkan dan menjalankan aplikasi mobile yang berbasis web. Lebih simplenya, WebView itu seperti android browser,tetapi tidak mempunyai address bar untuk memasukkan URL, hal tersebut disebabkan karena URL sudah kita didefinisikan dalam aplikasi android tersebut. Oke tidak perlu lama-lama kita langsung saja Check It Out

1. Langkah pertama yaitu klik start a new Android Studio Project untuk membuat project android baru.

2. Langkah selanjutnya yaitu konfigurasikan penamaan aplikasi dan package.

3. Pada bagian penentuan build target, SDK minimum yang anda inginkan.

4. Saat pemilihan Add an activity to mobile,pilih blank activity.

5.Pada choose optional for your new file, klik Finish. Lalu tunggu agak lama untuk persiapan lembar project.

6. Lalu pilih Mode design, pilih WebView pada Palette.

click and drag webview dari Palette ke kanan bawah dari layar device,kemudian tarik webview hingga penuh di layar device.

7.Untuk membuat aplikasi android kita dapat mengakses internet kita harus membuat permission internet seperti berikut ini

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

pasangkan kode diatas kedalam AndroidManifest.xml.

8. Kemudian buka MainActivity.java,letakan kode berikut ini tepat dibawah setContentView(R.layout.activity_main);

String url = "http://teknorial.com/"; //Pendefinisian URLWebView view = (WebView) this.findViewById(R.id.webView); //sinkronisasi object berdasarkan idview.getSettings().setJavaScriptEnabled(true); //untuk mengaktifkan javascriptview.loadUrl(url); //agar URL terload saat dibuka aplikasi

*Jangan lupa import class webview agar webview terdefinisikan.

9. Aplikasi WebView kita sudah siap , saat nya untuk mencoba menjalankan aplikasi WebView, Klik RUN ‘app’

10. Lalu silahkan bulid aplikasi menjadi ‘app’

11. Setelah itu kirim aplikasi ke smartphone anda.

Dan akhirnya kita sudah berhasil membuat aplikasi android WebView dengan android studio. Sekian tutorial singkat dari saya, jangan lupa tinggalkan komentar.

TAMBAHAN

Untuk membuat aplikasi webview fullscreen, hapus kode berikut dari activity_main.xml

android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"

Untuk membuat aplikasi webview tidak redirect ke web browser saat di klik link , kita perlu menambah class WebViewClient dan override method tersebut. Letak kode berikut di MainActivity.java

import android.webkit.WebView; //import WebView class
import android.webkit.WebViewClient; //import WebViewClient class

public class MainActivity extends ActionBarActivity {

   @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        WebView view = (WebView) this.findViewById(R.id.webView); 
        view.getSettings().setJavaScriptEnabled(true);
        view.setWebViewClient(new MyBrowser());
        view.loadUrl("http://teknorial.com");
    }

   private class MyBrowser extends WebViewClient {
       @Override
        public  boolean shouldOverrideUrlLoading(WebView view, String url ){
            view.loadUrl(url);
            return true;
        }
    }

Untuk menambahkan fitur zoom di aplikasi webview, cukup menambahkan kode berikut di MainActivity.java

view.getSettings().setBuiltInZoomControls(true);
view.getSettings().setSupportZoom(true);

Untuk membuat kondisi saat disentuh tombol back dan kembali pada halaman sebelumnya, kita perlu menggunakan method goback() seperti berikut.

public boolean onKeyDown(int keyCode, KeyEvent event) {
        //ketika disentuh tombol back
        if ((keyCode == KeyEvent.KEYCODE_BACK) && view.canGoBack()) {
            view.goBack(); //method goback() dieksekusi untuk kembali pada halaman sebelumnya
            return true;
        }
        // Jika tidak ada history (Halaman yang sebelumnya dibuka)
        // maka akan keluar dari activity
        return super.onKeyDown(keyCode, event);
    }