Anko Library - Part 1

Apa itu Anko Library ?  merupakan library untuk mempermudah dalam membuat suatu tampilan UI dalam proses pembuatan aplikasi android , dengan adanya library ini , code code yang seharusnya banyak kita tulis dapat di bentuk menjadi lebih ringkas .

Sebelum kita membahas fitur - fitur apa saja yang dtawarkan oleh anko library ada baiknya kita tahu cara melakukan instalasi kedalam android studio terlebih dahulu . Pada android studio terdapat  build,gradle dan tambahkan beberapa code seperti gambar dibawah ini :

Jika dilihat lebih detail saya memasukan code  "ext.anko_version = '0.9.1' pada bagian buildscript. Ini akan membuat trigger agar android studio bisa mengambil depedency anko libary yang ada . jika sudah kita masuk ke bulid.gradle(app) , masukan code berikut seprti gambar dibawah ini :

Pada bagian ini kita masukan code di depedency yaitu :

• "org.jetbrains.anko:anko-sdk15:$anko_version"
• "org.jetbrains.anko:anko-support-v4:$anko_version"
• "org.jetbrains.anko:anko-appcompat-v7:0.9.1"

Jika sudah kita pada bagian gradle kita lakukan "sync" , ini untuk membuat anko bisa terinstal kedalam android studio sesuai dengan code code pada grdle yang sudah kita masukan .

Kemudian untuk mecoba anko pertama kali , kita akanm mempersiapkan file file berikut

• ids.xml                 : dibuat dalam folder values
• SignInActivity.kt : dibuat dalam folder java
• SignInView.kt      : dibuat dalam folder java

Pada file ids.xml berisi code seperti gambar dibawah ini :

Dalam file ini berisikan id yang akan di deklarasikan dan digunakan dalam activity-nya nanti , tanpa ada file ini kita tidak akan  bisa menggunakan id , hal ini akan terlihat pada file SignInView.kt nanti.

Jika sudah kita buat file SignInActivity.kt yang berisikan code seperti gambar dibawah ini :

Dalam file SignInActivity berisikan kode untuk menyatakan layout atau tampilan yang ada terdapat pada SignInView.kt . Hal itu terlihat pada code di baris 12

Kemudian kita buat file SignInView.kt yang berisikan code seperti gambar dibawah ini :

Dalam file SignInView berisikan beberapa hal yang akan saya jelaskan sebagai berikut :

• Pada baris ke -14 , terdapat AnkoComponent<SignInActivity>, ini yang akan menghubungkan  antara file SignView.kt dengan SignActivity.kt sehingg bisa berinteraksi satu sama lain


• Pada baris ke - 17 terdapat verticalLayout{}, dengan anko semudah ini kita membuat layout vertical dalam membuat code , jika kita mau atur heigh dan weight pada layout tinggal kita atur dengan menambahkan fungsi lparams() , ini dapat dilihat pada baris - 18


• Pada baris ke - 18 terdapat editText{}, dengan anko semudah ini kita membuat edit text , jika dilihat,terdapat beberapa attibute yaitu id, hintResource, dan textSize, dan kita hanya mengetikkan attribute yang ada dengan mudah seperti gambar di atas. Jika dilihat id pada edit text adalah hasil deklarasi pada file ids.xml


• Pada baris ke - 34 terdapat Button{}, dengan anko semudah ini kita membuat button ,dan sama seperti editText kita bisa menambahkan beberapa atribut pada buttn seperti gambar diatas

Oh iya satu lagi , kita ada tambah code pada file MainActivity.kt , dapat dilihat pada gambar dibawah ini:

Dalam file MainActivity.kt , jika dilihat pada baris ke - 15, terdapat startActivity(Intent(this,
SignInActivity::class.java)), artinya MainActivity.kt akan langsung menuju file SignInActivty.kt.
Jadi cara kerja aplikasi ini sebagai berikut :

• MainActivity.kt akan langsung berpindah ke activity lainnya yaitu SignInActivity.kt
• Lalu SignInActivty.kt akan me-render SignInView.kt sebagai tampilan UI nya tersebutJika sudah dan kita "run" aplikasi yang kita buat maka akan keluar output seperti ini :

Selamat kita udah behasil membuat aplikasi menggunakan Anko Librray , Mudah bukan ?,
selanjutnya saya akan membahas ada fitur apa saja yang terdapat di anko  pada part berikutnya

Referensi

• https://medium.com/@v.souhrada/introduction-to-anko-for-android-part-1-6178d536cbe6
• https://medium.com/@v.souhrada/introduction-to-anko-for-android-part-2-9ba043baf9c0
• https://medium.com/@v.souhrada/introduction-to-anko-for-android-part-3-a14ddcd7c1ae
• https://github.com/Kotlin/anko/wiki