วิธาสร้างลิงก์ที่คลิกได้ใน TextView บน Android

บทความนี้สาธิตวิธีทำให้ข้อความใน TextView เป็นลิงก์ที่คลิกได้ โดยใช้ HTML anchor tag และ LinkMovementMethod

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

Android Studio → File → New Project

ขั้นตอนที่ 2: Layout (activity_main.xml)

TextView เรียบง่าย อ้างอิง string resource:

<?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/textViewLink"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:textSize="24sp"
        android:textStyle="bold"
        android:gravity="center"
        android:text="@string/messageWithLink" />

</RelativeLayout>

ขั้นตอนที่ 3: กำหนดสตริงพร้อมลิงก์ (strings.xml)

ใช้ HTML anchor tag <a href="..."> ใน res/values/strings.xml:

<resources>
    <string name="app_name">Sample</string>
    <string name="messageWithLink"><a href="https://www.google.com/">Tap here to open Link</a></string>
</resources>

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

สำคัญ: ต้องเซ็ต LinkMovementMethod ไม่อย่างนั้นลิงก์จะไม่ทำงาน

package app.com.sample;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.text.method.LinkMovementMethod;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {
    TextView textView;

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

        textView = findViewById(R.id.textViewLink);
        // บรรทัดนี้สำคัญมาก - ทำให้ลิงก์คลิกได้
        textView.setMovementMethod(LinkMovementMethod.getInstance());
    }
}

วิธีทางเลือก: ใช้ autoLink ใน XML

ไม่ต้องเขียนโค้ด Java เพิ่ม ใส่ใน TextView XML:

<TextView
    android:id="@+id/textViewLink"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:autoLink="web"
    android:text="Visit https://www.google.com" />

autoLink options: web, email, phone, map, all

การปรับแต่งสีลิงก์ (Customization)

// ใน styles.xml หรือ theme
<item name="android:textColorLink">#FF0000</item> <!-- สีลิงก์ -->
<item name="android:textColorHighlight">#FFEB3B</item> <!-- สีเมื่อกด -->

การใช้ SpannableString (ขั้นสูง)

สำหรับการควบคุมรายละเอียดมากขึ้น (เช่น click listener เฉพาะส่วน):

SpannableString spannable = new SpannableString("Click here");
ClickableSpan clickableSpan = new ClickableSpan() {
    @Override
    public void onClick(View widget) {
        // ทำงานเมื่อคลิก
    }
};
spannable.setSpan(clickableSpan, 0, 4, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
textView.setText(spannable);
textView.setMovementMethod(LinkMovementMethod.getInstance());