Tutorial Membuat Aplikasi Input Text (EditText) Android Studio

Halo kawan, jumpa lagi untuk belajar bersama membuat aplikasi Android. Setelah kemarin kita belajar membuat tombol berfungsi saat di klik menggunakan fungsi Button OnClick, sekarang kita akan belajar bagaimana cara membuat aplikasi untuk input text dan menampilkan ke TextView atau label di Android Studio.

EditText merupakan salah satu Widget yang ada di android studio yang berfungsi untuk memasukkan dan mengedit text atau sebut saja untuk input data yang berbentuk kolom input. Contohnya seperti saat kita login pada aplikasi Facebook, Instagram, LINE, Twitter, akun Google dan sebagainya. Itulah EditText atau yang lebih mudah di sebut untuk input edit text.

Oke biar kamu lebih paham, sekarang mari kita mulai belajar membuat aplikasi untuk input text dan menampilkannya melalui TextView. Alur programnya seperti ini:

ALUR PROGRAM

1. Program dijalankan.
2. Menampilkan TextView, kolom input text, dan Tombol Tampilkan, Reset, Exit.
3. Memasukkan text ke dalam EditText.
4. Klik tombol Tampilkan – menampilkan text yang di input ke TextView.
5. Klik tombol Reset – Mengatur ulang EditText dan TextView menjadi kosong.
6. Klik tombol Exit – Keluar aplikasi.
7. Selesai.

Bagaimana? Anda tertarik dengan aplikasi sederhana ini? Jika iya, mari kita belajar bersama.

LANGKAH-LANGKAH

1. Buatlah project baru dengan nama AplikasiInputText - Lihat tutorial membuat project baru pada android studio di sini: Cara Membuat Project Baru Aplikasi pada Android Studio.

2. Setelah itu silahkan buka activity_main.xml, klik mode Text, lalu memasukkan listing kode berikut ke dalam file activity_main.xml.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.caratutorial.aplikasiinputtext.MainActivity">
 
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/textView"
        android:textStyle="normal|bold"
        android:textSize="14sp"
        android:layout_alignParentTop="true"
        android:textAlignment="center"
        android:padding="20dp"
        android:background="?attr/colorButtonNormal" />

    <Button
        android:text="RESET"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/btnReset"
        android:layout_below="@+id/btnTampil"
        android:layout_alignParentStart="true" />

    <Button
        android:text="Exit"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/btnReset"
        android:layout_centerHorizontal="true"
        android:id="@+id/btnExit" />

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="textPersonName"
        android:ems="10"
        android:id="@+id/editText"
        android:hint="Input Text..."
        android:layout_below="@+id/textView"
        android:layout_alignParentStart="true" />

    <Button
        android:text="TAMPILKAN"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/btnTampil"
        android:layout_below="@+id/editText"
        android:layout_alignParentStart="true" />
</RelativeLayout>

Setelah memasukkan kode diatas, maka desain layout pada activity_main.xml akan menjadi seperti gambar dibawah ini.

3. Sekarang selesai mendesain tampilan aplikasi kita, sekarang kita buka MainActivity.java dan masukkan listing kode di bawah ini:

package com.caratutorial.aplikasiinputtext;

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.TextView;

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    EditText inputText;
    TextView tampilText;
    Button btnTampil, btnReset, btnExit;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);
        inputText = (EditText) findViewById(R.id.editText);
        tampilText = (TextView) findViewById(R.id.textView);
        btnTampil = (Button) findViewById(R.id.btnTampil);
        btnReset = (Button) findViewById(R.id.btnReset);
        btnExit = (Button) findViewById(R.id.btnExit);
        btnTampil.setOnClickListener(this);
        btnReset.setOnClickListener(this);
        btnExit.setOnClickListener(this);
    }

    public void onClick(View v){
        switch(v.getId()){
            case R.id.btnTampil:
                tampilText.setText(inputText.getText().toString());
                break;
            case R.id.btnReset:
                tampilText.setText("");
                inputText.setText("");
                break;
            case R.id.btnExit:
                finish();
                break;
        }
    }
}

4. Simpan project Anda dan jalankan Aplikasi Anda dengan cara klik tombol Run atau melalui menu Run > Run ‘app’ kemudian memilih perangkat yang Anda gunakan. Anda bisa menggunakan Android Virtual Device (AVD) atau menggunakan ponsel Anda untuk Run app Anda. Silahkan lihat: Cara Membuat Android Virtual Device (AVD) Emulator Android Studio.

DEMO APLIKASI

Setelah aplikasi di jalankan, hasilnya akan seperti gambar screenshot dibawah ini:

Selesai. Kamu juga bisa membuat desain sesuai versi kamu, atau bisa juga mengganti tulisan keterangan sesuai dengan yang kamu inginkan. Bagaimana? Sudah paham kan? Jika belum paham, silahkan lihat tutorial video Nya di bawah ini.

Jika kamu mengalami masalah seperti ini: Session ‘app’: Error Installing APK, silahkan lihat solusi untuk mengatasi masalah tersebut pada tutorial ini: [FIX] Solved Session ‘app’: Error While Installing APK Android Studio Project. Selesai!

Tutorial Video YouTube Belajar Membuat Aplikasi Input Text (EditText) Android Studio

- Proses uploading…

Saya juga membagikan file project aplikasi ini yang bisa kamu download melalui link berikut:
DOWNLOAD PROJECT

Sekian tutorial tentang Membuat Aplikasi Input Text (EditText) di Android Studio. Silahkan di coba dan jika ada pertanyaan, silahkan tanyakan melalui kolom komentar.

Semoga bermanfaat…