Menampilkan Situs dengan Webview Android

PEMROGRAMAN ANDROID : MENAMPILKAN HALAMAN WEB DENGAN WEBVIEW


Menampilkan Situs dengan Webview Android

Selamat Datang di Blog Orang IT . Untuk menambah tulisan artikel pada label Android kali ini saya akan Share Tutorial Pemrograman Android bagaimana cara menampilkan halaman suatu website kedalam aplikasi android dengan menggunakan webview. Untuk pembuatanya saya menggunakan Software Eclipse atau anda juga bisa menggunaka Android Studio silahkan pilih mana yang menurut anda mudah

Pengenalan WebView

Web view merupakan object yang dapat menampilkan halaman web seperti layaknya web browser. Web view dapat digunakan untuk menampilkan halaman web yang terdapat di internet ataupun halaman web yang terdapat di dalam aplikasi

Pada aplikasi webview kali ini saya akan menampilkan Url Situs Blog Orang IT : http://helmykkediri.blogspot.co.id dan Blog saya yang lain tentang Blog Misteri jika anda sudah paham atau bingung langsung saja kita menuju Tutorial nya :

Cara Membuat WebView Sederhana Pemrograman Android :

1. Buat lah sebuah Project baru di Eclipse  terserah mau anda beri nama apa . Pilih File - New - Android Apllication Project

Menampilkan Situs dengan Webview Android
Buat Project BAru
Beri nama project anda terserah , sesuka hati kalian . Gunakan minimal versi android Ginger beard API 11

Menampilkan Situs dengan Webview Android
Buat Project
2. Kita buat User Interface atau tampilanya , masuk pada res / layout buka activity_main.xml

Edit Activity Main XML

Kemudian pastekan Script Berikut ini pada activity_main.xml dibagian XML


<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.Belajarmultibannerhelmy.MainActivity" >


// untuk menampilkan text view


<TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="HELMY KURNIAWAN"
        android:textAppearance="?android:attr/textAppearanceMedium" />

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >


// untuk membuat button


<Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="Blog Orang IT" />

<Button
           android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="Helmy Misteri" />

</LinearLayout>


// untuk menampilkan situs web


<WebView
        android:id="@+id/webView1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
/>

</LinearLayout>

Berikut Tampilanya dalam mode Activity_main.xml :

Menampilkan Situs dengan Webview Android
Mode XML

Berikut Tampilanya dalam mode Graphical Layout , sengaja saya buat sederhana :

Menampilkan Situs dengan Webview Android
Tampilan Graphic

 3. MEngedit Main_Activity.java , masuk src - com.example.blabla - MainActivity.java 

Buka dengan klik 2x otomatis akan terbuka pada jendela sebelah kanan, kemudian masukkan Script sebagai berikut :

package com.example.Belajarmultibannerhelmy;

import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.KeyEvent;
import android.view.View;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Button;

public class MainActivity extends ActionBarActivity {
    WebView webView;
    Button button1, button2;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
       
        webView = (WebView)findViewById(R.id.webView1);


        //Mengaktifkan kendali zoom in dan zoom out pada webview


        webView.getSettings().setBuiltInZoomControls(true);


        //Mengaktifkan java script pada halaman web yang dibuka


        webView.getSettings().setJavaScriptEnabled(true);
        button1 = (Button)findViewById(R.id.button1);
        button2 = (Button)findViewById(R.id.button2);
        button1.setOnClickListener(btnClick);
        button2.setOnClickListener(btnClick);
        }
        View.OnClickListener btnClick = new View.OnClickListener() {
            @Override
            public void onClick(View v) {


                //Load URL sesuai button yang di-klik


            switch(v.getId()){
            case R.id.button1 :
            webView.setWebViewClient(new ClientWebView());
            webView.loadUrl("http://helmykkediri.blogspot.co.id" );
           
            break;
            case R.id.button2 :
            webView.setWebViewClient(new ClientWebView());


            //load web page yang terdapat di terdapat di aplikasi android


            webView.loadUrl("http://mas-helmy.blogspot.co.id"); break;
            }
            }
            };


            //menampilkan halaman web sebelumnya bila ada (sesuai history browsing) apabila tombol back ditekan


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

            //memaksa untuk menampilkan halaman web yang dituju ke Web View, bukan ke browser bawaan Android


            private class ClientWebView extends WebViewClient{
               
                @Override
                public boolean shouldOverrideUrlLoading(WebView view, String url){
                return false;
                }
                }
                }


4. Tambahkan uses permission pada AndroidManifest.xml dengan menambahkan akses internet sebagai berikut : 
<uses-permission android:name="android.permission.INTERNET"/>

Menampilkan Situs dengan Webview Android
Akses Internet
5. Selesai , silahkan tancapkan USB SMartphone anda dan Running project yang telah di buat pada smartphone Klik kanan project - run as - android application

Menampilkan Situs dengan Webview Android
Jalankan Via USB



Hasil Dari WebView yang telah kita buat kurang lebih seperti ini hasilnya :

Menampilkan Situs dengan Webview Android
1
Menampilkan Situs dengan Webview Android
2

Jika anda ingin mendownload versi mentahan sebelum di compile kedalam file aplikasi android APK silahkan download melalui link dibawah ini :
Atau silahkan Download Project yang sudah di Compile kedalam APK tinggal anda jalankan saja HP Android Smartphone anda :


Demikian postingan Pemrograman Android Membuat Webview sederhana , semoga bermanfaat jika ada yang ingin ditanyakan silahkan ditanyakan pada kotak komentar . Postingan saya sebelumnya MEmbuat CRUD Jual Beli Pakaian pada Aplikasi Android. sekian dan terimakasih 


Follw Blog Orang IT dan Like Fanspage saya helmykkediri jangan lupa sedianya Klik Iklan untuk Blog ini untuk biaya Admin beli Kuota untuk Up Date Blog
loading...

1 Response to "Menampilkan Situs dengan Webview Android"

Terimakasih sudah berkunjung ke Blog Orang IT , aturan berkomentar yang baik :

1. Dilarang mencantumkan berbagai macam link aktif dikomentar blog

2. Jika ingin mendapatkan backlink komen dengan name/url yang telah disediakan

3. Link download mati silahkan berkomentar

4. Postingan dirasa outdate atau sudah tidak berguna lagi komen saja jangan sungkan

5. Komentar yang memerlukan jawaban dari admin jangan menggunakan anonymous

6. Berkomentarlah dengan relevans dan tinggalkan jejak diblog saya

7. Bantu jawab komentar ya

Terimakasih sudah mentaati rules aturan berkomentar yang baik