Belajar Membuat Aplikasi Berbasis Android Menggunakan B4A (Menampilkan Nama)

Logo B4A
Oke pada kali ini saya akan membuat aplikasi sederhana menggunakan aplikasi B4A, sebelum ke pembuatan aplikasi pastikan kalian sudah mempunyai dan memasangnya di komputer kalian masing-masing. Diantaranya:
  1. Java JDK
  2. Android SDK
Setelah kalian memasang kedua komponen tambahan dari B4A, selanjutnya kalian tinggal memasang Aplikasi B4A-nya. Tutorial pemasangan kedua komponen dan Aplikasi B4A dapat kalian lihat di situs resmi B4A disini.

Setelah semuanya terpasang di komputer kalian, sekarang saatnya kita belajar membuat aplikasi android yang sederhana.

Pertama-tama kita buka aplikasi B4A seperti gambar di bawah ini:
Tampilan awal B4A
Setelah tampilan awal terbuka, kita harus menyimpan project sebelum dapat menjalankan Designer .

Lalu kita klik Save dan buat folder baru dengan nama MyFirstProgram dan simpan project dengan nama MyFirstProgram.
Setelah menyimpan project maka kita tetapkan nama paketnya. Setiap program membutuhkan nama paket. Untuk mengaturnya di menu kita tekan Project lalu pilih Build Confoguration.



Maka akan tampil jedela seperti gambar di bawah ini.
Nama awal dari paket adalah b4a.example lalu kita ubah menjadi b4a.MyFirstProgram dan klik OK. Setelah itu kita set label dari aplikasinya. Di bagian atas tampilan layar kalian dapat melihat dua baris seperti di bawh ini.
Klik tanda + untuk meluaskan
Klik tanda - untuk menyiutkan

Jika kedua tanda + diklik maka akan tampil coding  seperti di bawah ini
Nama aslinya adalah B4A Example, tetapi kita bisa mengubahnya menjadi MyFirstProgram untuk penamaan yang konsisten.

Ubah baris ini:
#ApplicationLabel: B4A Example
menjadi
#ApplicationLabel: MyFirstProgram

Setelah itu hubungkan ke ponsel Android kalian dengan B4A-Bridge. Jika belum punya, kalian harus mengunduh aplikasi B4A-Bridge  terlebih dahulu di Play Store lalu memasangnya. Jika sudah terpasangan, pertama-tama nyalakan dahulu hotspot di ponsel kalian dan hubungkan komputer dengan hotspot yang ada di ponsel kalian. Lalu buka aplikasi B4A-Bridge dan klik START
Pada tampilan di atas aplikasi B4A-Bridge belum terhubung dengan komputer kita hal tersebut ditandai dengan simbol rantai yang terputus seperti terlihat di gambar
Setelah itu kita kembali ke aplikasi B4A di komputer dan klik tools, lalu klik B4A Bridge, lanjut klik connect dan klik IP Default Gateway yang didapatkan komputer kita dari hotspot yang tersambung dengan ponsel kita, kalian dapat melihat IP Default Gateway pada Wireless Network Connection Status.
Setelah terhubung maka pada aplikasi di ponsel akan ditandai dengan simbol rantai yang tersambung
Sedangkan pada aplikasi B4A di komputer akan ditandai dengan tulisan connected dibagian kiri bawah tampilan layar
Setelah aplikasi B4A di komputer dan di ponsel Android saling terhubung selanjutnya kita jalankan designer dengan cara klik Designer lalu klik Open Designer
Maka akan tampil jendela Designer seperti di bawah ini
Lalu kita klik Add View dibagian kiri atas jendela Designer dan Klik Label. Tambahkan lagi Label yang kedua, setelah itu tambahkan dua EditText dan satu Button. Setelah itu aturlah sesuai posisi yang kalian inginkan atau sesuai gambar di bawah ini
Oh iya, untuk melihat desain dari tampilan aplikasi yang kita buat secara langsung di ponsel Android, kita dapat menghubungkannya dengan cara klik WYSIWYG Designer lalu klik Connect
Tunggu sampai Designer dan perangkat terhubung. Ini bisa memakan waktu lama, jadi bersabarlah.

Setelah itu klik Label1 dan aturlah seperti gambar di bawah ini
Lalu klik Label2 dan aturlah seperti gambar di bawah ini
Klik EditText1 dan aturlah seperti gambar di bawah ini
Klik EditText2 dan aturlah seperti gambar di bawah ini
Klik Button1 dan aturlah seperti gambar di bawah ini
Setelah semua beres kemudian kita klik Tools di bagian atas lalu pilih Generate Members lalu aturlah seperti gambar berikut ini, kemudian klik Generate Members.
Setelah itu jangan lupa simpanlah desain layout yang telah dibuat dengan cara klik File lalu pilih Save maka akan tampil jedela seperti di bawah ini dan namailah Layout yang telah kita buat lalu klik OK.
Setelah itu tutuplah jendela Designer dan kita beralih ke Codingnya. Di jendela tampilan Coding kita klik Project > Add New Module > Activity Module lalu akan tampil jedela seperti di bawah ini. Lalu kita namai Modulnya "Tampilan" lalu klik OK 
Setelak klik OK maka akan ada dua "Modul" pada halaman Coding yaitu Modul "Main" dan Modul "Tampilan"
Saat Modul Tampilan Aktif yang ditandai dengan warna kuning seperti gambar di atas lalu kita klik Desainer > Open Desainer, maka akan tampil jendela Desainer lalu kita pilih File > New untuk mendesain Layout baru pada Modul "Tampilan" dengan langkah yang sama pada saat kita mendesain Layout "InputNama" pada Modul "Main". lalu aturlah seperti gambar di bawah ini
Setelah itu klik Label1 dan aturlah seperti gambar di bawah ini
Lalu klik Label2 dan aturlah seperti gambar di bawah ini
Klik Label3 dan aturlah seperti gambar di bawah ini
Klik Label 4 dan aturlah seperti gambar di bawah ini
Setelah semua beres kemudian kita klik Tools >Generate Members lalu aturlah seperti gambar berikut ini, kemudian klik Generate Members.
Setelah itu simpanlah desain layout yang telah dibuat dengan nama "OutputNama".
Lalu tutuplah jendela Desaigner dan kita beralih ke jendela Coding.
Pada Modul "Main" di bagian Sub Activity_Create tulislah coding seperti di bawah ini.
Lalu kita beralih ke Modul "Tampilan" dan membuat variabel yang dapat diakses dari Modul "Main", sehingga antara modul "Main" dan "Tampilan" saling terhubung. Pada modul "Tampilan" di bagian Sub Process_Globals kita tuliskan coding seperti di bawah ini.
Selanjutnya beralih lagi ke Modul "Main" dan tulislah coding berikut di bagian Sub BtnOK_Click
Berikutnya beralih lagi ke Modul "Tampilan" dan tulislah coding berikut di bagian Sub Activity_Create

Terakhir tinggal kita run aplikasinya dengan menekan tombol F5 atau klik icon berikut
Belajar Membuat Aplikasi Berbasis Android Menggunakan B4A (Menampilkan Nama) Belajar Membuat Aplikasi Berbasis Android Menggunakan B4A (Menampilkan Nama) Reviewed by Dwi Yuli Wibowo on October 09, 2017 Rating: 5

1 comment:

  1. IONQQ**COM
    agen terbesar dan terpercaya di indonesia
    segera daftar dan bergabung bersama kami.
    Whatshapp : +85515373217 :-* (f)

    ReplyDelete

Pembaca yang baik tinggalkan komentar yang baik

Powered by Blogger.