0 comments

ANDROID WIDGET

1 comments

Widget adalah komponen dalam bahasa pemrograman Android yang dapat digunakan untuk menampilkan user interface dan menerima interaksi terhadap user.Pada pembahasan kali ini, penulis akan membahas beberapa hal dasar yang berkaitan dengan widget seperti:
-  XML Layout
- Layout Width
- Layout Height
- Gravity

XML Layout
Android XML Layout secara default terletak pada bagianres/layout/main.xml. saat kita membuat project baru kurang lebih isinya akan seperti berikut ini:

<?
xmlversion="1.0"encoding="utf-8"?>
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent"
<TextView
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"
android:text = "@string/hello"
/>
</LinearLayout>



Arti dari kode program di atas adalah layout Widget diatur dalam berkas XML dan menggunaka jenis layout LinearLayout. SedangkanWidget Textview berada di dalam LinearLayout Karena setiap widgetharus berada di dalam layout tertentu

LAYOUT WIDTH dan HEIGHT

Layout width dan heigth di dalam Android, terdapat 2 macam yaitu:
-      Fill Parent
-      Wrap Content
Jika layout_width di set fill_parent maka lebar dari komponen Widget tersebut akan memenuhi  layar monitor Device Mobile. Sedangkan jika layout_height yang diset fill_parent


maka tinggi dari Widget tersebut akan memenuhi layar monitor device mobile. Berbeda dengan layout_width jika diset wrap_content, maka lebar dari komponen widget tersebut  akan menyesuaikan content yang ada di dalamnya. Misalnya teks pada button. Lebar button akan menyesuaikan lebar teks dalam button tersebut. Hal ini berlaku juga untuk layout_height.



GRAVITY

Selanjutnya adalah gravity, gravity merupakan perataan teks pada komponen widget. Misalnya sebuah button di set gravity = right, maka posisi teks pada button tersebut akan menjadi rata kanan. Secaradefault, gravity bernilai left.Untuk mecoba XML Layout, Layout Width dan Height serta Gravity kita dapat langsung melanjutkan padapembahasan praktek kita.



ANDROID IN ACTION!

Saatnya kita mencobanya di Android Pembaca ikuti langkah-langkah berikut ini yak:

1.Buka IDE Eclipse yang sudah didownload dan tersetting Android.

2.File > New > Other atau dengan shortcut (CTRL + N)

Pilih Android > Android Project > Next



3.Isikan Property isian seperti pada Gambar di bawah ini, kemudian tekan Finish




4. Buka src > res > layout > main.xml



5. Kemudian pilih main.xml

6. Kode Program akan menjadi berikut ini :
<?
Xml version = "1.0" encoding = "utf - 8" ?>
< LinearLayout
xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent"
< TextView
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"
android:text = "@string/hello"
/>
</LinearLayout>



7. Jalankan aplikasi Android dengan cara klik kanan AndroidWidget01Basic  Run As > Android Application .Akan muncul Emulator, memang biasanya agak lama. Jadi harus bersabar Ada baiknya emulator dijalankan terlebih dahulu (caranya ada pada tutorial sebelum ini).

8. Sambil menunggu bisa tekan Window > Show View > Console. Jika tampilan nya masih seperti  ini, ma ka kita harus menunggu Emulator selesai Loading Home.


9. Jika sudah berjalan dan sukses akan muncul seperti di bawah ini:


10. Kemudian kita cek Emulatornya, jika muncul seperti Gambar di bawah, tekan MENU di
tombol Emulator.



11.Jika tidak ada error, maka akan muncul berikut ini di Emulator:


12. Selanjutnya kita akan mencoba membuat button pada tampilan.Ubah kode main.xml
menjadi berikut ini:

<? xml version = "1.0" encoding = "utf - 8" ?>
< LinearLayout
xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent"
<Button
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"
android:text = "@string/hello"
/>
</LinearLayout>


13. Jalankan kembali projectnya, dan akan didapatkan tampilan seperti berikut ini


14. Untuk mengetahui perbedaan fill_parent dan wrap_content, kita ganti dalam layout tersebut dengan cara membuat layout_width menjadiwrap_content .Kode program menjadi seperti berikut ini:


15. Jalankan kembali dan akan dapatkan hasil seperti berikut ini :



16.Selanjutnya, coba kita tambahkan dua button lagi, edit main.xmlsehingga menjadi seperti berikut ini:

<? xml version = "1.0" encoding = "utf - 8" ?>
<LinearLayout
xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent"
<Button
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"
android:text = "@string/hello"
/>
<Button
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"
android:text = "@string/hello"
/>
<Button
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"
android:text = "@string/hello"
/>
</LinearLayout>


17. Kita coba running kembali, dan akan didapatkan tampilan seperti berikut ini:


18. Untuk mencoba Gravity, kita ubah - ubah kode program main.xmlmenjadi seperti berikut ini:
<? xml version = "1.0" encoding = "utf - 8" ?>
<LinearLayout
xmlns:android = "http://schemas.android.com/apk/res/android"
android:orientation = "vertical"
android:layout_width = "fill_parent"
android:layout_height = "fill_parent"
<Button
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"
android:text = "@string/hello"
android:gravity = "left"
/>
<Button
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"
android:text = "@string/hello"
android:gravity = "right"
/>
<Button
android:layout_width = "fill_parent"
android:layout_height = "wrap_content"
android:text = "@string/hello"
android:gravity = "center"
/>
</LinearLayout>


19. Gravity akan menentukan alignment dari suatu teks pada widget, Maka hasilnya akan menjadi seperti berikut ini




20. Perhatikan berkas main.xml, property android:layout_width, android:layout_height serta
fill_parent dan wrap_content. Tak luput pula tentang Gravity, jika pembaca memahami apa
yang maksud dari penggunaan tersebut . Selamat!!! Anda telah berhasil belajar dasar widget pada Android.

Kesimpulan
Dari tutorial ini, dapat penulis simpulkan beberapa poin penting berikut ini:
1.Terdapat berkas main.xml yang berguna untuk mendesain komponen Widget.
2.android: layout_width digunakan untuk menentukan lebarkomponen sedangkan android:layout_height digunakan untuk menentukan tinggi komponen widget.
3. Nilai fill_parent artinya komponen akan di resize penuh sesuai dengan ukuran layar.
4.Nilai wrap_content artinya kompo nen akan diresize sesuai dengan lebar atau tinggi teks.
5.android:gravity terdiri dari left, right dan center yang dapat digunakan untuk menentukan alignment atau perataan teks pada suatu komponen widget.



Sumber :


http://javaclopedia.com/wp-content/uploads/2012/02/Pemrograman-Android-Widget-01-Basic.pdf

APP INVENTOR

0 comments

APP Inventor adalah sebuah aplikasi builder untuk membuat aplikasi yang berjalan di sistem operasi Android yang disediakan oleh googlelabs. Jadi kalian harus punya account google dulu untuk bisa masuk ke home app inventor. App Inventor ini sedikit berbeda dengan app builder lain seperti (sebut saja e**ipse). Dengan App Inventor kita tidak pernah menemui kasus para developer uring-uringan gara-gara aplikasi yang dibuat nggak jalan, dan ternyata itu hanya karena kesalahan sintak kurang tanda semicolon (;). App Inventor ini menggunakan teknik visual programming, berbentuk seperti susunan puzzle-puzzle yang memiliki logika tertentu. Kalian bisa baca-baca tutorial dan contoh-contoh apilkasi nya di page Explore.

Pada lingkungan kerja App Inventor ini terdapat beberapa komponen yang terdiri dari :

1.  Komponen Desainer, Komponen desainer berjalan pada browser yang digunakan untuk memilih komponen yang dibutuhkan dan mengatur property nya. Pada komponen desainer sendiri terdapat 5 bagian, yaitu palette, viewer, component, media dan properties, seperti terlihat pada gambar di atas.
  • Palette : list komponen yang bisa digunakan
  • Viewer : untuk menempatkan komponen dan mengaturnya sesuai tampilan yang  diinginkan
  • Component : tempat list komponen yang dipakai pada project kita
  • Media : mengambil media audi atau gambar untuk project kita
  • Properties : mengatur properties komponen yang digunakan, seperti width, height, name, dll
2.  Block Editor, Block Editor berjalan di luar browser dan digunakan untuk membuat dan mengatur behaviour dari komponen-komponen yang kita pilih dari komponen desainer. Nah, berhubung block editor ini basisnya java, jadi lepi kalian sebelumnya harus uda ada jdk sama jre nya ya. Contoh tampilan Block Editor terlihat seperti gambar di bawah ini :

3.  Emulator, Emulator digunakan untuk menjalankan dan mengetest project yang telah kita buat. Jadi yang blom punya android pun tetep bisa belajar karna app inventor menyediakan emulatornya juga.


Instalasi App Inventor Pengaturan untuk Windows

Instalasi Setup App Inventor untuk Windows memiliki dua bagian:

-> Instalasi App Inventor Setup paket software. Langkah ini adalah sama untuk semua perangkat Android, dan sama untuk Windows XP, Vista, dan 7.
-> Menginstal driver Windows untuk ponsel Android Anda.

Instalasi App Inventor Setup paket software

Kami menyarankan Anda melakukan instalasi dari account yang memiliki hak administrator. Ini akan menginstal perangkat lunak untuk semua pengguna dari mesin. Jika Anda tidak memiliki hak administrator, instalasi masih harus bekerja, tapi App Inventor akan digunakan hanya dari akun yang Anda gunakan saat Anda menginstal.

1. Unduh installer.
2. Cari file AppInventor_Setup_Installer_v_1_2.exe (~ 92 MB) dalam file Download atau   Desktop Anda. Lokasi download pada komputer Anda tergantung pada bagaimana browser Anda dikonfigurasi.
3. Buka file tersebut.
4. Klik melalui langkah-langkah dari installer. Jangan mengubah lokasi instalasi tetapi merekam direktori instalasi, karena Anda mungkin perlu untuk memeriksa pengemudi. Direktori akan berbeda tergantung pada versi Windows dan apakah atau tidak Anda login sebagai administrator.

Mencari perangkat lunak Pengaturan

Dalam kebanyakan kasus, App Inventor harus dapat menemukan software setup sendiri. Tetapi jika meminta lokasi perangkat lunak, jalan masuk adalah C: \ Program Files \ Appinventor \ perintah-untuk-Appinventor . Jika Anda menggunakan mesin 64-bit, Anda harus mengetik Program Files (x86) bukan Program Files. Juga, jika Anda tidak menginstal perangkat lunak sebagai administrator, itu dipasang di direktori lokal Anda daripada di C: \ Program Files. Anda harus mencarinya untuk menemukan pathname yang benar.

Telepon driver

App Inventor pengaturan perangkat lunak termasuk driver untuk ponsel ini Android yang umum:

- T-Mobile G1 * / ADP1
- T-Mobile myTouch 3G * / Google Ion / ADP2
- Verizon Droid (tidak Droid X)
- Nexus One 
- Nexus S 

Telepon tidak tercantum di sini akan meminta Anda untuk mendapatkan dan menginstal driver secara manual . Dalam beberapa kasus, driver Windows tidak selalu menginstal otomatis, dalam hal ini Anda harus melakukan instalasi driver pengguna .

sumber: 
http://no-fuun.blogspot.com/