Iklan diatas header

Loading...

Cara Menampilkan Website Localhost di Android Studio

Webview : Cara Menampilkan Website Localhost di Android Studio
Cara Menampilkan Website Localhost di Android Studio | Webview adalah adalah cara menampilkan website di Android dengan bantuan aplikasi android studio. nah kali ini kita akan membahas Cara Menampilkan Website Localhost di Android Studio. 

jika kamu memiliki sebuah sistem atau aplikasi berbasis web kamu bisa memasukkannya menjadi aplikasi berbasis android dengan bantuan android studi. caranya cukup mudah, kamu tinggal masukkan folder sistem kamu ke directory tertentu di android studio dan nanti sistem intu akan menjadi aplikasi android dengan bantuan android studio. ga percaya? yuk kita ikuti caranya dibawah ini.

Baca Juga: Cara Membuat Aplikasi Favorite Song dengan Android Studio

Di setiap device Android pasti memiliki Android System Webview atau TampilanWeb Sistem Android. Mungkin kamu tidak melihatnya di deretan aplikasi, tapi kamu akan selalu diminta untuk mengupdate aplikasi yang satu ini di playstore.

Bila kamu memperhatikan deskripsi dari aplikasi ini di Google Playstore, pastinya mereka menjelaskan seperti berikut:

“Android Webview adalah sistem komponen dari Chrome yang memungkinkan aplikasi Android dapat menampilkan konten web. Komponen ini pre-installed pada perangkat anda dan selalu up to date agar memiliki keamanan terbaru serta perbaikan bug lainnya”

Namun singkatnya, Fungsi dari Android System Webview ialah menampilkan konten web secara langsung dari aplikasi pihak ke-3 apapun yang menggunakan komponen Chrome tanpa harus membuka aplikasi browser terlebih dahulu.

Implementasi dari komponen yang satu ini dapat kamu lihat dari semua aplikasi yang ada di playstore termasuk Facebook, Line, BBM dan lain-lain yang mana bila ada link yang memuat konten web nantinya akan di tampilkan In-App tanpa harus ke browser.

Sejarahnya sendiri, Android System Webview pertama kali hadir di Android 4.4 a.k.a KitKat yang awalnya menggunakan basis open source dari Google Chrome dan sejak di Android 5.0 (Lolipop) dijadikan sebuah aplikasi terpisah sehingga dapat terus di perbarui di Google Playstore tanpa memerlukan update firmware terbaru. Jadi untuk versi Android 4.3 (Jellybean) dan di bawahnya, masih menggunakan source code dari WebKit Apple seperti yang ada pada browser Safari.

Untuk itu, pastikan kamu selalu memperbarui aplikasi ini karena apabila ada web konten dari aplikasi favorit kamu hanya menampilkan halaman blank putih tapi koneksi tetap stabil, itu tandanya kamu harus segera memperbarui aplikasi tersebut.(Source: Droidpoin)

Webview : Cara Menampilkan Website Localhost di Android Studio :
1. Buat Project Baru, kemudian kasi nama project sesuai aplikasi yang akan kamu buat, lalu klik Next.
Webview : Cara Menampilkan Website Localhost di Android Studio

2. Selanjutnya pilih perangkat yang bisa menjalankan aplikasi yang kamu buat. Disini kita membuat aplikasi untuk phone dan tablet. Jadi silahkan pilih Phone dan tablet. Jangan lupa pilih API atau minimum SDK yang dapat menjalankan palikasi mu, saran saya pilih versi paling bawah. Jika sudah kamu bisa klik Next.
Webview : Cara Menampilkan Website Localhost di Android Studio

3. Kemudian pilih activity pada mobile.activity ini harus kamu sesuaikan dengan aplikasi yang akan kamu buat, karena kita mau buat apllikasi webview kita pilih saja yang Empty activity. Jika sudah klik Next.
Webview : Cara Menampilkan Website Localhost di Android Studio

4. Selnjutnya, isi nama activity sesuai keinginan mu, atau biarkan default. Lalu klik Next.
Webview : Cara Menampilkan Website Localhost di Android Studio

5. Jika sudah, sekarang kita desain tampilan aplikasinya. Silahkan kamu masukkan komponen berikut:
Webview : Cara Menampilkan Website Localhost di Android Studio

6. Susun komponen tersebut seprti ini:
Webview : Cara Menampilkan Website Localhost di Android Studio

10. Anda juga bisa mendesain tamilan melalu koding caranya klik tab TEXT yang berada di bawah atau di saping DESIGN. Lalu ketikkan lah koding berikut:

7. Buatlah sebuah folder ( directory ) baru. caranya klik kanan pada folder app, kemudian pilih “new>>android resource directory”.
Webview : Cara Menampilkan Website Localhost di Android Studio

8. Kemudian kamu isi nama directory nya dengan nama “assets”. Lalu klik OK.
Webview : Cara Menampilkan Website Localhost di Android Studio

9. Sekarag kamu bisa copy file/folder project website kamu ke dalam directory assets tersebut. Cara copypaste nya seprti biasa saja. Kamu tinggal paste di folder assets tadi.
Webview : Cara Menampilkan Website Localhost di Android Studio

10.  Sekarang kita beralih ke file .Java. pada file MainActivity.java kamu tambahkan perintah seprti dibawah ini:
Webview : Cara Menampilkan Website Localhost di Android Studio

11. Jika kurang jelas, berikut saya lampirkan script codingan nya. Note: usahakan di ketik manual biar ingat dan Jago atau jika ingin copas, copy lah dengan Package nya sekalian biar tidak error.

15. Sekarang coba RUN kan Program anda, jika sukses hasilnya akan seperti ini:
Webview : Cara Menampilkan Website Localhost di Android Studio

Webview : Cara Menampilkan Website Localhost di Android Studio

Bagaimana? Mudah bukan?. Sekarang kamu bisa membuat aplikasi web kamu menjadi aplikasi android. Nah itu tadi sedikit tutorial dari saya, jika ada kekurangan saya mohon maaf. dan jika ada kesalahan silahkan komentar dibawah agar segera saya koreksi. Dan jangan lupa SHARE artikel ini jika bermanfaat menurut kalian, supaya lebih banyak lagi orang yang tau. Sekian dari saya. Terimakasih, Salam Bacacoding.

2 Responses to "Cara Menampilkan Website Localhost di Android Studio"

  1. gan,,,ane file index.php gak running ya...kenapa tuh?

    ReplyDelete
    Replies
    1. Hallo Mas Ahmad!
      klw index.php harus ada localserver seperti xampp baru bisa runing karna extensionnya .php. sedangkan ini saya mencontohkan web dengan format .html. semoga bisa mencerahkan :D

      Delete

= > Silahkan berkomentar sesuai artikel diatas
= > Berkomentar dengan url ( mati / hidup ) tidak akan di publish

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel