Tutorial Cara Mendapatkan Input Menggunakan EditText
Assalamualaikum Warahmatullahi Wabarakatuh. Pada tutorial dasar kali ini, saya akan mengajarkan pada kalian cara menggunakan komponen EditText di Android Studio, komponen ini digunakan untuk menerima input berupa Text dari User.
Ada bermacam-macam jenis text yang dapat diterima oleh user, yaitu: Text Biasa, Password, Nomor Telepon, Email, Number, URL dan lain-lain. kita dapat menyesuaikan jenis textnya sesuai dengan kita inginkan.
A. Jenis-Jenis Text Input pada EditText
Ada banyak sekali berbagai jenis text inputan yang bisa kalian gunakan dalam EditText diantaranya yang sudah saya sebutkan tadi, sebelum itu dalam pembuatan EditText ada beberapa atribut penting yang perlu kalian gunakan dan ketahui yaitu:
- android:inputType: Untuk menentukan jenis text input yang akan digunakan.
- android:hint: Untuk memberitahu user, apa yang harus di Inputkan.
Sekarang kita akan membuat contoh sederhana menggunakan EditText, pada contoh kali ini kita akan membuat beberapa EditText dengan berbagai macam type inputan, agar kalian bisa melihat perbedaanya.
Pertama buat project baru pada android studio, jika sudah, buka file activity_main.xml pada project yang kalian buat, lalu masukan kode berikut ini:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:layout_margin="18dp"
android:orientation="vertical"
tools:context="android.cianjur.developer.net.basicandroid.MainActivity">
<EditText
android:id="@+id/nama"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Masukan Nama"
android:inputType="textPersonName" />
<EditText
android:id="@+id/password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Password"
android:inputType="textPassword" />
<EditText
android:id="@+id/email"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Email"
android:inputType="textEmailAddress" />
<EditText
android:id="@+id/phone"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Nomor Telepon"
android:inputType="phone" />
<EditText
android:id="@+id/editText5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="URL Website"
android:inputType="textUri" />
</LinearLayout>
Untuk membuat EditText cukup menambahkan tag <EditText> serta beberapa atribut didalamnya atau kalian juga bisa langsung mendrag/dropnya, jika kita lihat hasilnya akan seperti ini:
Sekarang coba kalian jalankan project tersebut, lalu masukan input pada masing-masing EditText, maka hasilnya akan terlihat seperti ini:
B. Mendapatkan Input dan Mengeluarkan Output
Program kedua yang akan kita buat adalah, pada aplikasi tersebut user bisa menginputkan data melalui EditText dan mengeluarkan Outputnya melalui pesan dialog sederhana (Toast), untuk membuat program ini kita membuatuhkan satu widget EditText dan satu Button, Button tersebut akan kita gunakan untuk mengeksekusi perintah.
Baca Juga:
Sekarang coba kalian jalankan project tersebut, lalu masukan input pada masing-masing EditText, maka hasilnya akan terlihat seperti ini:
B. Mendapatkan Input dan Mengeluarkan Output
Program kedua yang akan kita buat adalah, pada aplikasi tersebut user bisa menginputkan data melalui EditText dan mengeluarkan Outputnya melalui pesan dialog sederhana (Toast), untuk membuat program ini kita membuatuhkan satu widget EditText dan satu Button, Button tersebut akan kita gunakan untuk mengeksekusi perintah.
Baca Juga:
- Tutorial Cara Membuat Button Pada Android Studio
- Tutorial Cara Membuat TextInputLayout Material Design
Sekarang kembali ke project yang kalian buat, buka kembali file activity_main.xml tersebut lalu ubah menjadi seperti ini:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:layout_margin="18dp"
android:gravity="center"
android:orientation="vertical"
tools:context="android.cianjur.developer.net.basicandroid.MainActivity">
<EditText
android:id="@+id/nama"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Masukan Nama"
android:inputType="textPersonName" />
<Button
android:id="@+id/confirm"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Konfirmasi" />
</LinearLayout>
Berikut ini merupakan tampilan dari layout tersbut:
selanjutnya buka file MainActivity.java kalian, lalu masukan source code berikut ini:
selanjutnya buka file MainActivity.java kalian, lalu masukan source code berikut ini:
package android.cianjur.developer.net.basicandroid;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity{
EditText Input_Nama;
Button Confirm;
String Nama;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Input_Nama = findViewById(R.id.nama);
Confirm = findViewById(R.id.confirm);
Confirm.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Nama = Input_Nama.getText().toString(); // Mendapatkan Input dan Memasukannya pada Variable Nama
// Mengeluarkan Output yang didapat dari User
Toast.makeText(getApplicationContext(), "Perkenalkan Nama Saya "+Nama, Toast.LENGTH_SHORT).show();
}
});
}
}
Sekarang coba kalian jalankan project tersebut, maka lihatlah hasilnya.
Sekian dari saya, mohon maaf bila ada kesalahan, jika ada yang ingin ditanyakan silakan isi komentar dibawah. Wassalamualaikum Warahmatullahi Wabarakatuh.