Memahami Input/Output dengan GetText dan SetText Pada Android Studio

Baringin
By -
2



Pendahuluan

    Tentu sebuah program yang baik adalah terjadi interaksi antara User dengan aplikasi. User tidak hanya menikmati tampilan sebuah aplikasi namun user juga dapat berinteraksi seperti menginputkan data. 

    Memahami kebutuhan tersebut maka di android studio membangun sebuah metode yang disebut getText dan setText. Metode ini memungkinkan user berinteraksi lebih dalam lagi dengan sistem.


Pengertian GetText dan SetText

    Android Studio memudahkan pengguna dengan membangun GUI atau user interface. . GUI yang di bangan bertujuan agar terjadi interaksi user dengan sistem. User diberikan kewenangan untuk melakukan perubahan terhadap nilai suatu variabel. 

    Ada dua metode yang digunakan agar user bisa berinteraksi dengan GUI yang dibangun. Metode tersebut adalah GetTeks dan SetTexs.

    GetTexs merupakan metode pengambilan nilai dari suatu variabel. Nilai tersebut akan ditampung dalam variabel lain. Pengambilan nilai pada GUI berdasarkan input dari user saat user berinteraksi dengan sistem. Contoh Saat user mengimputkan nama "Abu Bakar", maka sistem akan mengambil nilai tersebut dan menyimpannya ke dalam variabel lain.  

    Sedangkan SetText adalah metode mengembalikan nilai yang ada didalam variabel ke dalam suatu komponen. 


Membuat Desain I/O

    Sebelum masuk ke program kita terlebih dahulu membuat desain UI android di halaman activity_main.xml. Jadi silahkan buat projek baru dengan

  •     activity : Empty Activity
  •     name Projek : Latihan_App
  •     language: java/Kotlin

Masuk ke halaman activity_main.xml dan tambahkan komponen EditText, Button dan TextView. Beri atribut android:id="" pada komponen TextView dan EditText. Berikut bentuk codenya

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">

<EditText
android:id="@+id/txtNama"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Input Nama"
android:inputType="text" />

<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="44dp"
android:layout_marginEnd="64dp"
android:text="Simpan"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="@+id/txtNama"
android:onClick="Simpan"/>

<TextView
android:id="@+id/lblNama"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="76dp"
android:text="NAMA :"
android:textSize="28dp"
app:layout_constraintTop_toBottomOf="@+id/button"
tools:layout_editor_absoluteX="0dp" />

</androidx.constraintlayout.widget.ConstraintLayout>

    ID pada komponen TextView adalah ID= txtNama, dan pada EditText adalah id=lblNama. Id ini dibutuhkan saat membuat program di halaman Activit_Main.java. Sedangkan pada Button kita berikan sebuah action onClik="Simpan".

    EditText merupakan form Input bagi user. User dapat mengimputkan data pada komponen ini. Sedangkan TextView merupakan output dari apapun yang diinputkan oleh user di EditText.


Metode Get dan Set

    Setelah selesai membuat UI sebagai I/O maka saatnya kita ngoding. Halaman untuk ngoding adalah MainActivity.java. Jadi silahkan masuk ke halaman tersebut. Tambahkan sebuah method di bawah method utama tapi tetap dalam class. Berikut method yang ditambahkan.

public void Simpan(View view) {
//Code program
}

Sedangkan di kotlin:

fun Simpan(view: View) {

}   

 

    Nama method sama dengan nama onClick pada button di xml. Method ini akan dieksekusi jika terjadi aksi klik pada button simpan.

    Buat variable "Nama" dan "setNama" untuk menampung id dari komponen xml. id yang ditampung adalah id dari TextView dan EditText.

public void Simpan(View view) {
EditText Nama = findViewById(R.id.txtNama); //Muhammad
TextView setNama = findViewById(R.id.lblNama);
}


Kotlin:

fun Simpan(view: View) {
val Nama = findViewById<EditText>(R.id.txtNama)
val setNama=findViewById<TextView>(R.id.lblNama)
}

    Tambahkan variable untuk menangkap karakter yang di input dari komponen EditText. getText memiliki fungsi untuk merekam setiap karakter yang dimiliki oleh komponen. Karakter tersebut disimpan dalam sebuah variable. Kita beri nama variabel tersebut dengan "getNama".

String getNama = Nama.getText().toString();

Kotlin:

val getNama= Nama.getText().toString()

    Terakhir keluarkan isi dari variable name ke TextView. setText berfungsi sebagai pengembalian nilai. Nilai yang ditampung oleh variable nama dikembalikan ke komponen TextView.

    
setNama.setText(getNama);

Kotlin:

setNama.setText(getNama)

Berikut program utuhnya:

package com.example.latihan_app;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.EditText;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
public void Simpan(View view) {
EditText Nama = findViewById(R.id.txtNama);
TextView setNama = findViewById(R.id.lblNama);
//mengambil nilai
String getNama = Nama.getText().toString();

//mengeluarkan nilai
setNama.setText(getNama);
}
}


Sedangkan pada kotlin:

fun Simpan(view: View) {
val Nama = findViewById<EditText>(R.id.txtNama)
val setNama=findViewById<TextView>(R.id.lblNama)

val getNama= Nama.getText().toString()
setNama.setText(getNama)
}

Jalankan projek yang anda buat. Coba lakukan interaksi dengan sistem anda.   

 Berikut Tampilan di Emulator:



    Sampai di sini kita telah selesai membahas tentang tekni SetText dan getText. Terimakasih telah mengunjungi situs kami.


Latihan:

    Kerjakan latihan dibawah ini:

    1. Buatlah GUI seperti Berikut:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">

<EditText
android:id="@+id/txtNo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Input Nomor"
android:inputType="number" />

<EditText
android:id="@+id/txtNama"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Input Nama"
android:inputType="text"
app:layout_constraintTop_toBottomOf="@+id/txtNo"
tools:layout_editor_absoluteX="0dp" />

<EditText
android:id="@+id/txtAlamat"
android:layout_width="match_parent"
android:layout_height="120dp"
android:layout_marginTop="4dp"
android:hint="Input alamt"
android:inputType="text|textMultiLine"
android:gravity="top"
app:layout_constraintTop_toBottomOf="@+id/txtNama"
tools:layout_editor_absoluteX="0dp" />

<EditText
android:id="@+id/txtTelp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Input No.Telp"
android:inputType="phone"
app:layout_constraintTop_toBottomOf="@+id/txtAlamat"
tools:layout_editor_absoluteX="16dp" />

<EditText
android:id="@+id/txtEmail"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Input Email"
android:inputType="textEmailAddress"
app:layout_constraintTop_toBottomOf="@+id/txtTelp"
tools:layout_editor_absoluteX="0dp" />

<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="36dp"
android:layout_marginEnd="60dp"
android:onClick="Simpan"
android:text="Simpan"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="@+id/txtEmail" />

<TextView
android:id="@+id/lblNo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="36dp"
android:text="No. :"
android:textSize="28dp"
app:layout_constraintTop_toBottomOf="@+id/button"
tools:layout_editor_absoluteX="0dp" />

<TextView
android:id="@+id/lblNama"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="76dp"
android:text="NAMA :"
android:textSize="28dp"
app:layout_constraintTop_toBottomOf="@+id/button"
tools:layout_editor_absoluteX="0dp" />

<TextView
android:id="@+id/Alamat"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="124dp"
android:text="Alamat :"
android:textSize="28dp"
app:layout_constraintTop_toBottomOf="@+id/button"
tools:layout_editor_absoluteX="16dp" />

<TextView
android:id="@+id/lblTelp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="172dp"
android:text="No.Telp :"
android:textSize="28dp"
app:layout_constraintTop_toBottomOf="@+id/button"
tools:layout_editor_absoluteX="0dp" />

<TextView
android:id="@+id/lblEmail"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="236dp"
android:text="Email :"
android:textSize="28dp"
app:layout_constraintTop_toBottomOf="@+id/button"
tools:layout_editor_absoluteX="0dp" />

</androidx.constraintlayout.widget.ConstraintLayout>


2. Buatlah program java/Kotlin untuk menampilkan Form isian ke dalam komponen label label.

3. Amati dan berikan komentar anda di kolom komentar.


Penutup

👍👍

Post a Comment

2Comments

Post a Comment