วิธีใช้งานคลาส TextWatcher ใน Android

ภาพรวม

TextWatcher เป็น Interface สำหรับตรวจจับการเปลี่ยนแปลงข้อความใน EditText แบบ Real-time เหมาะสำหรับการ Validate Input, นับตัวอักษร, Auto-complete หรือ Filter รายการ

ขั้นตอนที่ 1: สร้างโปรเจกต์ใหม่

Android Studio → File → New Project → Empty Activity

ขั้นตอนที่ 2: จัดรูปแบบหน้าจอ (activity_main.xml)

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="https://schemas.android.com/apk/res/android"
    xmlns:tools="https://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Android Text Watcher"
        android:textSize="16sp"
        android:textStyle="bold"
        android:layout_marginTop="24sp"
        android:layout_centerHorizontal="true"
        android:layout_alignParentTop="true" />

    <EditText
        android:id="@+id/etInput"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_below="@id/text"
        android:maxLength="15"
        android:hint="Input" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textSize="24sp"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="12dp"
        android:layout_below="@id/etInput"/>

</RelativeLayout>

ขั้นตอนที่ 3: เขียนโค้ด MainActivity.java

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.text.Editable;
import android.text.TextWatcher;
import android.widget.EditText;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    private EditText input;
    private TextView output;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        input = findViewById(R.id.etInput);
        output = findViewById(R.id.textView);

        // ลงทะเบียน TextWatcher
        input.addTextChangedListener(textWatcher);
    }

    // สร้าง TextWatcher แบบ Anonymous Class
    private final TextWatcher textWatcher = new TextWatcher() {
        
        @Override
        public void beforeTextChanged(CharSequence s, int start, int count, int after) {
            // เรียกก่อนที่ข้อความจะเปลี่ยนแปลง
            // s = ข้อความเดิม, start = ตำแหน่งเริ่มต้น, count = จำนวนตัวอักษรที่จะถูกลบ, after = จำนวนตัวอักษรที่จะเพิ่มเข้ามา
        }

        @Override
        public void onTextChanged(CharSequence s, int start, int before, int count) {
            // เรียกขณะที่ข้อความกำลังเปลี่ยนแปลง
            // s = ข้อความใหม่, start = ตำแหน่งเริ่มต้น, before = จำนวนตัวอักษรเดิม, count = จำนวนตัวอักษรใหม่
            
            output.setText(s); // แสดงข้อความแบบ Real-time
            
            // ตัวอย่าง: แจ้งเตือนเมื่อพิมพ์ครบ 12 ตัวอักษร
            if (start == 12) {
                Toast.makeText(getApplicationContext(), "Maximum Limit Reached", Toast.LENGTH_SHORT).show();
            }
        }

        @Override
        public void afterTextChanged(Editable s) {
            // เรียกหลังจากข้อความเปลี่ยนแปลงเสร็จสิ้น
            // เหมาะสำหรับการ Format ข้อความ (เช่น เพิ่มคอมม่าในตัวเลข)
        }
    };
}

ขั้นตอนที่ 4: AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="https://schemas.android.com/apk/res/android"
    package="app.com.sample">

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">

        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>

    </application>
</manifest>

การทดสอบ

พิมพ์ข้อความในช่อง Input → ข้อความจะปรากฏใน TextView ด้านล่างทันที → เมื่อพิมพ์ครบ 12 ตัวอักษร จะขึ้น Toast แจ้งเตือน

กรณีใช้งานที่นิยม