วิธีตั้ง OnClick Listener บน Title ของ Action Bar/Toolbar ใน Android

ภาพรวม

บทความนี้สาธิตวิธีเพิ่ม OnClickListener ให้กับ Title ใน Toolbar (แทน Action Bar แบบเก่า) เพื่อให้กด Title ได้

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

Android Studio → File → New Project → Empty Activity

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

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

    <androidx.appcompat.widget.Toolbar
        android:id="@+id/my_awesome_toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        android:minHeight="?attr/actionBarSize">

        <TextView
            android:id="@+id/toolbarTitle"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="center"
            android:gravity="center_vertical"
            android:background="?attr/selectableItemBackground"
            android:text="หน้าหลัก"
            android:textAppearance="@style/TextAppearance.Widget.AppCompat.Toolbar.Title" />

    </androidx.appcompat.widget.Toolbar>

    <TextView
        android:id="@+id/text"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:textSize="30sp"
        android:gravity="center" />

</LinearLayout>

ขั้นตอนที่ 3: โค้ดหลัก (java/MainActivity.java)

package com.example.myapplication;

import android.os.Bundle;
import android.view.View;
import android.widget.TextView;
import android.widget.Toolbar;
import androidx.appcompat.app.AppCompatActivity;

public class MainActivity extends AppCompatActivity {

    private TextView textView;

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

        // ซ่อน Action Bar เริ่มต้น
        if (getSupportActionBar() != null) {
            getSupportActionBar().hide();
        }

        // ใช้ Toolbar แทน
        Toolbar toolbar = findViewById(R.id.my_awesome_toolbar);
        setSupportActionBar(toolbar);

        TextView toolbarTitle = findViewById(R.id.toolbarTitle);
        toolbarTitle.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // ทำงานเมื่อกด Title
                finish(); // ตัวอย่าง: ปิด Activity
            }
        });

        textView = findViewById(R.id.text);
        textView.setText("กด Title ใน Toolbar เพื่อทดสอบ");
    }

    // Helper method (ในโค้ดต้นฉบับมี private method นี้ แต่ไม่จำเป็น)
    private void setSupportActionBar(Toolbar toolbar) {
        setSupportActionBar(toolbar);
    }
}

จุดสำคัญ

• ใช้ androidx.appcompat.widget.Toolbar แทน Action Bar แบบเก่า
• ใส่ TextView ภายใน Toolbar แทน title ตัวจริง
• ตั้งค่า android:background="?attr/selectableItemBackground" ให้มี ripple effect
• ใช้ setSupportActionBar(toolbar) เพื่อให้ระบบรู้จัก Toolbar นี้

กรณีใช้งานจริง

• กด Title เพื่อ Scroll to Top (RecyclerView/ListView)
• กด Title เพื่อ Refresh/Pull-to-refresh
• กด Title เพื่อแสดง Menu/Filter options
• กด Title เพื่อกลับหน้าหลัก (Home)

Scroll to Top Example

toolbarTitle.setOnClickListener(v -> {
    RecyclerView recyclerView = findViewById(R.id.recyclerView);
    if (recyclerView != null && !recyclerView.canScrollVertically(-1)) {
        // อยู่บนสุดแล้ว - ทำ refresh
        swipeRefreshLayout.setRefreshing(true);
        loadData();
    } else {
        // Scroll to top
        recyclerView.smoothScrollToPosition(0);
    }
});

ทดสอบ

รันแอป → กดข้อความ "หน้าหลัก" ใน Toolbar → Activity ปิด (finish)