Official StoreTekan tombol di atas untuk membeli semua alat dan bahan eksperimen di web ini

Seri Belajar Java For Android : Mengambil String dari Komponen EditText dan Menampilkannya ke Komponen TextView

Tutorial pemrograman Java for Android kali ini akan membahas tentang bagaimana melakukan handling pertukaran data antar komponen UI (User Interface) saat runtime. Komponen yang akan dibahas adalah komponen EditText (ada di Pallete ‘TextFields’ di  Eclipse), komponen TextView (Pallete ‘Form Widget’) dan komponen Button (Pallete ‘Form Widget’). Secara umum komponen EditText fungsi utamanya adalah ‘menangkap’ input yang diketikkan user, komponen TextView adalah untuk menampilkan sembarang teks di layar dan komponen Button adalah semacam tombol yang bisa diklik dan akan melakukan suatu ‘aksi’ sesuai event handler-nya.

Kali ini kita akan membuat sebuah program Android yang dapat mengambil data input user di komponen EditText dan menampilkannya di komponen TextView melalui event onClick komponen Button. Jadi mudahnya, kalau user meng-klik tombol Button, maka input (tulisan) yang ada di EditText akan berpindah ke TextView. Melalui program sederhana ini saya harapkan Anda dapat lebih mengerti tentang interaksi komponen UI (User Interface) dalam Android dan bagaimana cara meng-handle-nya.

Buka IDE (Integrated Development Environment) Eclipse Anda (bisa di-download di developer.android.com), dan buat project Android Application baru melalui menu File | New | Android Application Project. Jika tertampil jendela wizard pembuatan project baru, ikuti saja sampai selesai. Berikutnya klik tab ‘activity_main.xml’ di jendela tengah di Eclipse dan klik tab ‘Graphical Layout’ di pojok kiri bawah di jendela tengah tersebut. Untuk lebih jelasnya perhatikan gambar di bawah. 

Selanjutnya ambil (drag and drop) komponen TextView (di Pallete ‘Form Widget’), Button (Pallete ‘Form Widget’) dan EditText (Pallete ‘TextFields’) di Form Designer dan atur peletakannya sesuai gambar di atas. Double click komponen Button, dan tambahkan properti onClick untuk meng-handle event onClick dari user (perhatikan kode XML di bawah yang di-bold dan di-underline)

<Button

        android:id=“@+id/button1”

        android:layout_width=“wrap_content”

        android:layout_height=“wrap_content”

        android:layout_below=“@+id/textView1”

        android:layout_marginLeft=“14dp”

        android:layout_marginTop=“55dp”

        android:layout_toRightOf=“@+id/textView1”

        android:onClick=“tombolonclick”

        android:text=“Button” />

Kemudian klik tab ‘MainActivity.Java’ untuk mulai mengisikan program utamanya

Perhatikan baris 1 sampai dengan 19 adalah script yang otomatis dibuat oleh Eclipse (kecuali baris 5 s/d 7 harus ditambahkan sendiri) dan baris 21 sampai dengan 25 adalah script yang harus Anda tambahkan sendiri. Jadi script inilah (baris 21 s/d  25 yang sesungguhnya meng-handle aktivitas user, yakni jika tombol diklik maka tulisan dari kotak Edit (komponen EditText) akan berpindah ke tulisan TextView. Berikut penjelasannya :

Baris 21 : menciptakan procedure baru dengan nama ‘tombolonclick’ sesuai yang didefinisikan di file activity_main.xml

Baris 22 dan 23 : menciptakan instance baru dari object (komponen) EditText dan TextView. ‘teksedit’ adalah instance dari object EditText yang di-refer oleh komponen ‘editText1’ di file activity_main.xml dan ‘teks’ adalah instance dari object TextView yang di-refer oleh komponen ‘textView1’ di file activity_main.xml. Instance ini berikutnya dapat Anda manipulasi (dioperasikan) sesuai dengan tujuan pembuatan program. Perhatikan baris selanjutnya (baris ..). Pada baris ini instance ‘teks’ dan ‘teksedit’ dioperasikan sedemikian rupa supaya tulisan yang ada di kotak edit (instance ‘teksedit’) di-copy-kan (berpindah) ke instance ‘teks’ (yang merupakan turunan object TextView). Cara mendapatkan isi dari instance teksedit adalah dengan memanggil fuction ‘getText() dan berikutnya adalah langsung mengesetnya ke instance ‘teks’ (TextView) dengan memanggil fuction ‘setText()’. Efek dari pemanggilan kedua function tadi adalah sama seperti halnya ‘meng-copy’ dari kotak Edit ke TextView’. Berikut adalah script lengkapnya.

Berikutnya siapkan AVD (Android Virtual Device) atau device Android sesungguhnya untuk menjalankan program yang Anda buat tadi. Kalau untuk saya pribadi, saya lebih suka menggunakan device android yang riil karena lebih cepat dalam proses compile-run setiap program yang kita buat.

Jika berhasil run program, seharusnya dalam layar android Anda akan muncul tampilan seperti di bawah :

Saat pertama kali running 

Saat kotak edit diisi sembarang string 

Saat tombol Button diklik 

Semoga artikel ini bermanfaat buat Anda. Program selengkapnya dapat Anda download di sini, tapi saya sarankan untuk tetap membuat program sendiri karena akan lebih mengena di hati :). Ohya, jika masih bingung tentang event onClick komponen Button dapat membaca artikel saya sebelumnya di sini

Incoming search terms:

fungsi edit text, fungsi textview, menampilkan tulisan dari edit text di eclipse, cara fokus object android pemrograman eclipse, cara/menampilkan/hasil/pemrograman pada eclipse, Cara koding edittext di eclipse java, get text pada android studio, fungsi dari import di java android, manipulasi device android, fungsi palette textfield pada eclipse

Leave a Reply

33 Comments on "Seri Belajar Java For Android : Mengambil String dari Komponen EditText dan Menampilkannya ke Komponen TextView"

avatar
  Subscribe  
newest oldest most voted
Notify of
Ran
Guest

hmm mau tanya nih kx, saya bikin program client-server (antara android dan textpad) nah kalo mau ngambil tulisan trus nampilinnya di UI client gimana ya? Aku udh coba2 tpi blom bisa, mungkin kakk punya contohnya? boleh donk dishare.. makasih kx sbelumnya..

Didit Panji
Guest

Assalamuallaikum
mas mau tanya, kalau hasil output dari android langsung di parsing terus dikirim ke server memakai apa ya mas?
makasih

fendi pratama
Guest

mau nanya, gimana caranya misal kita input “aku” outputnya “gue”
if nya gmn ya?

Kiki
Guest

Kak utk menampilkan tulisan text view stlah kita klik button, gmn ya ka?

Kiki
Guest

Itu sama gk kak ky :

Misal ada game tebak2 an. Lalu kita menjawab dgn klik button jawaban yg salah.. Kemudian muncul textview ‘jawaban salah’
Tanpa mnggunakan edit text dulu

Mulia754
Guest

Mas, kalau tanpa klik button tulisanya langsung tampil gimana ya, mohon bantuanya..

error: Content is protected !!