Sebelum berbicara Develop android kita harus mengetahui dari yang gampang dimengerti yaitu Layout. Layout atau Tampilan ialah konten yang akan ditampilkan pada layar Android. Lebih singkatnya adalah tampilan kotak pada layar yang menunjukan beberapa konten isi. Terdapat banyak komponen tampilan pada Android sehingga dari seluruh komponen tersebut jadilah sebuah Layout. Namun disini akan dijelaskan 3 Layout Widgets dasar yaitu Gambar (Image), Teks (Text) dan Tombol (Button). Dengan mempelajari Layout widgets terlebih dahulu akan mempermudah penjelasan selanjutnya mengenai Layout Android. Oh iya perlu diketahui, semua yang dapat dilihat/ditampilkan dilayar android disebut UI (User Interface).
Layout Widgets
- TextView (Teks)
Sekumpulan teks yang ditampilkan pada layar android. Berikut contoh penggunaan TextView:
- ImageView (Gambar)
Sebuah atau beberapa gambar yang ditampilkan pada layar android. Berikut Contoh penggunaan ImageView:
- Button (Tombol)
Sebuah tombol/beberapa tombol yang ditampilkan pada layar android. Berikut Contoh penggunaan Button:
[Sekedar informasi: Format penulisan seperti TextView, ImageView disebut Camel Case. Serta awal huruf dari Camel Case selalu huruf besar]
Seperti yang ditampilkan diatas, tampilan android terpecah dari bentukan tampilan individu. Dari setiap tamiplan individu tersebut dapat dikonfigurasi sesuai keinginan dan kebutuhan kita. Gambar diatas sudah merupakan konfigurasi tata letak layout yang cukup sederhana. Misalkan letak Icon ditengah bersama dengan Text "Welcome". Lalu konfigurasi Text Hint pada EditText (Edit Text Widgets akan dibahas dipost berikutnya) pada kolom edit "Username" dan "Password". Text input pada Button Sign In dan SignOut. Berikut ini ialah source nya, silahkan boleh dicoba dan jangan lupa dimodifikasi dan upgrade lebih bagus lagi.
[Cobalah untuk membuat suatu Error yang disengaja, lalu perbaiki]
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
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">
<LinearLayout
android:layout_width="368dp"
android:layout_height="wrap_content"
android:orientation="vertical"
tools:layout_editor_absoluteY="0dp"
tools:layout_editor_absoluteX="8dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="@drawable/inch"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:background="@color/colorPrimaryDark"
/>
<TextView
android:id="@+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Welcome!"
android:textSize="10dp"/>
<EditText android:id="@+id/username"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="@string/username"
android:layout_marginTop="36dp"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="@string/password"
android:layout_marginTop="36dp"/>
<Button
android:layout_width="368dp"
android:layout_height="wrap_content"
android:text="@string/sign_in"
android:layout_marginTop="36dp"
android:onClick="loginAction"/>
<TextView
android:textColor="@android:color/holo_red_dark"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="@string/haventAcc"
android:layout_marginTop="36dp"
/>
<Button
android:layout_width="368dp"
android:layout_height="wrap_content"
android:text="@string/signup"
android:onClick="signupAction"/>
</LinearLayout>
</android.support.constraint.ConstraintLayout>
Oke, setelah cukup tau tentang Layout Widgets. Pasti sudah ada gambaran bagaimana layout terbentuk dan apa saja instrumen yang membangun dari sebuah layout. Layout sendiri sebenarnya menampung widgets-widgets untuk mengkonfigurasi sedemikian rupa sehingga terbentuklah UI yang "Enak Dipandang". Jenis Layout terdiri dari beberapa jenis, Nah tentunya sebuah jenis layout memiliki karakter/kegunaan sendiri.
Melakukan Perbaikan Pada Error
Setiap developer pemula ataupun pro didalam menyelesaikan projectnya selalu menemui kendala. Itu pasti. Developer yang baik ialah developer yang selalu mencari jalan keluar dalam setiap error dan selalu begitu sampai project benar-benar selesai tuntas. Contohnya Google sang mesin pencarian. Dulunya Google hanya dapat melakukan pencarian dengan terbatas, namun setelah banyak pengalaman, membuat banyak pengulangan lalu improvisasi terus menerus jadilah Google yang hampir apa yang kita tanyakan pasti akan terjawab diGoogle. Lagi misalnya kita seorang pendaki gunung, project nya ialah menancapkan sebuah bendera dipuncak gunung. Pasti sebagai pendaki kita dihadapkan dengan rute yang berkelok, hadangan sebuah batu dan pohon atau bahkan sepatu kita jebol saat dijalan. Bagaimana sipendaki mengatasi hal-hal tersebut sama dengan tugas dan tanggung jawab seorang developer mengatasi sebuah masalah dalam project. Nah apa-apa saja yang harus dilakukan saat Error.
Pertama, Menyelidiki Error Message.
Misalkan pada source ini :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
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"
tools:context="com.example.myapplication.MainActivity"
android:layout_width="368dp"
android:layout_height="wrap_content"
android:orientation="vertical"
tools:layout_editor_absoluteY="0dp"
tools:layout_editor_absoluteX="8dp">
<TextView
android:layout_width="match_parent"
android:layout_height="warp_content"
android:text="Ogenki desuka?"
android:textAlignment="center"
android:textsize="20dp" />
<Button
android:id="@+id/button"
android:layout_width="match_parent"
android:layout_hegiht="wrap_content"
android:grafity="center"
android:text="hai genki desu"/>
</LinearLayout>
Nah pada gambar diatas terdapat kesalahan, otomatis ketika kita "run" program ini maka pada Message Gradle Build (Android Studio) muncul error kurang lebih seperti ini:
Coba perhatikan betul-betul apa yang terjadi pada kode tersebut. Jika dilihat foto tersebut tidak menjelaskan garis mana yang error. Tentunya akan menyulitkan. Untuk mempermudah menemukannya, khusus pengguna Android Studio coba perhatikan garis dibagian kanan pada gambar berikut :
Perhatikan gambar diatas terdapat panah yang menunjuk pada garis merah. Kegunaan dari garis tersebut ialah untuk menandakan pada garis tersebut telah terjadi kesalahan (error).
- Baris 16; pertama coba lihat line 16 disana terlihat jelas "warp content" Nah jika dilihat dengan detail penulisan syntax salah. Yang seharus nya wrap malah ditulis warp
- Baris 19; Ini bagian agak sulit namun sepele jika dilihat dengan detail dan hati-hati pasti syntax Error akan ditemukan. Ya disana terdapat syntax error karena "textsize" harusnya ditulis "textSize" (huruf S besar)
- Baris 24; Sebenarmya memang Attention ditujukan untuk baris 21 namun syntax yang error ada dibaris 24 kenapa demikian. Hal ini karena telah terjadi di<Button> Widget. Ya selalu detail dalam mendalami syntax disekitar Attention. Disana "height" syntax tidak tertulis dengan benar.
- Baris 25; Untuk menjadi seorang developer android atau menjadi programming handal dibutuhkan skill bahasa inggris yang cukup mumpuni. Seperti masalah dibagian ini. Ya Syntax error hanya gara-gara yang seharusnya huruf "v" untuk "gravity" malah ditulis "f" menjadi "grafity"
Ya itu saja untuk post kali ini. Kemungkinan besar blog ini kedepannya akan dipenuhi tentang Pemrograman Android. Seperti bagaimana mengoperasikan Android Studio, Java Programming untuk Android, XML untuk Layout UI dan berbagai permasalahannya. Sekian. Terima Kasih.
ConversionConversion EmoticonEmoticon