Tuesday 31 January 2017

Membuat Browser Android Sederhana dengan Android Studio

Browser merupakan aplikasi yang kita gunakan untuk menjelajah dunia internet, baik untuk mencari info sesuatu, atau mengakses alamat url yang sudah ditentukan. Kalo biasanya saya share tentang pemrograman web, kali ini saya akan memberikan tutorial bagaimana cara membuat browser android sederhana dengan menggunakan android studio. Sekali lagi, ini adalah contoh browser sederhana, sekedar untuk menampilkan halaman web yang sudah kita tentukan sebelumnya. Apabila anda ingin membuat lebih lanjut, anda bisa memodifikasinya sendiri. Sebelum melanjutkan ke tutorial, saya akan cerita sedikit mengapa saya membuat tutorial ini. Pada awalnya, saya telah memiliki aplikasi berbasis web yang sudah live dan sudah digunakan. Kemudian saya kepikiran untuk membuat versi androidnya, namun saya tidak begitu menguasai pemrograman android. Walaupun beberapa tahun yang lalu sempat sedikit mempelajarinya. Dari situlah suatu ide tercetus, bagaimana jika saya membuat browser yang ketika dibuka akan langsung membuka website yang sudah dibuat sebelumnya. Toh websitenya juga sudah support tampilan mobile. Dengan begitu, akan "terlihat" seperti aplikasi android. he...he...he... 

Baiklah, kita mulai saja tutorial membuat browser android sederhana dengan menggunakan android studio. Sebelumnya, tentunya anda harus sudah menginstall android studio di laptop atau PC anda. Selanjutnya, ikuti langkah langkah berikut ini.
1.  Pertama buatlah project baru pada android studio dengan memilih File >> New Project , kemudian isi nama project sesuai keinginan Anda.
2. Selanjutnya, kita buka terlebih dahulu file AndroidManifest.xml untuk memodifikasinya dengan menambahkan kode sebagai berikut :

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

Sehingga file AndroidManifest Anda menjadi seperti ini

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.xxx.myapplication">
    <uses-permission android:name="android.permission.INTERNET" />
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="Launcher"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <meta-data
            android:name="com.google.android.gms.version"
            android:value="@integer/google_play_services_version" />
    </application>
</manifest>
Hali ini bertujuan agar aplikasi Anda memiliki akses untuk membuka internet atau halaman web.

3. Selanjutnya kita buat file layoutnya, (saya membuat file main_activity.xml unutk tampilannya) mejadi seperti berikut :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.bri.myapplication.MainActivity">

    <WebView  xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/webview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        />
</RelativeLayout>
Jika dilihat, disitu terdapat Tag <WebView/> tag inilah yang akan menampilkan halaman web yang sudah kita tentukan. Janan lupa untuk memberi id pada tag <WebView> ini. Karena id inilah yang akan kita panggil/gunakan di Activity.

4.  Kemudian, kita buka file MainActivity.java nya. kita buat seperti ini.
package com.example.xxx.myapplication;

import android.annotation.SuppressLint;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.Menu;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {
    WebView myWebView;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.browser_layout);
    }

    @SuppressLint("SetJavaScriptEnabled") @Override
    public boolean onCreateOptionsMenu(Menu menu) {

        myWebView = (WebView) findViewById(R.id.webview);
        myWebView.getSettings().setJavaScriptEnabled(true);
        WebSettings settings = myWebView.getSettings();
        settings.setDomStorageEnabled(true);
        settings.setJavaScriptEnabled(true);
        myWebView.requestFocusFromTouch();
        myWebView.setWebChromeClient(new WebChromeClient());
        myWebView.setWebViewClient(new WebViewClient());
        myWebView.loadUrl("http://caksamid.com");
        return true;
    }
}
5.  Terakhir, untuk melihat hasilnya silahkan klik 'Run' atau tekan Ctrl+f10. Anda bisa menggunakan hp atau menggunakan emulator untuk melihat hasilnya. Dan jangan lupa, HP atau emulator anda harus terhubung dengan internet untuk melihat hasilnya, karena kita akan mengakses alamat web yang sudah kita tentukan.
Demikian tutorial membuat browser sederhana dengan android studio ini. Anda tentu bisa menambahkan / memodifikasinya untuk mendapatkan hasil yang Anda inginkan. Selamat mencoba...

Hasil :
Sumber :
http://www.mybloggertricks.com/2013/11/create-android-web-browsing-app.html

1 comment: