ภาพรวม
บทความนี้สาธิตวิธีจัดการ Event เมื่อคลิกไอคอน (Home/Up/Action Icons) ใน Toolbar หรือ Action Bar
ขั้นตอนที่ 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:gravity="center"
tools:context=".MainActivity">
<TextView
android:id="@+id/text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:textSize="30sp"
android:gravity="center" />
</LinearLayout>
ขั้นตอนที่ 3: เมนู (res/menu/toolbar_menu.xml)
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="https://schemas.android.com/apk/res/android"
xmlns:app="https://schemas.android.com/apk/res-auto">
<item
android:id="@+id/action_settings"
android:title="Settings"
android:icon="@android:drawable/ic_menu_preferences"
app:showAsAction="ifRoom" />
<item
android:id="@+id/action_search"
android:title="Search"
android:icon="@android:drawable/ic_menu_search"
app:showAsAction="ifRoom|collapseActionView"
app:actionViewClass="androidx.appcompat.widget.SearchView" />
</menu>
ขั้นตอนที่ 4: โค้ดหลัก (java/MainActivity.java)
package com.example.myapplication;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.TextView;
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);
textView = findViewById(R.id.text);
if (getSupportActionBar() != null) {
getSupportActionBar().setTitle("หน้าหลัก");
getSupportActionBar().setSubtitle("ยินดีต้อนรับ");
getSupportActionBar().setDisplayHomeAsUpEnabled(true); // ปุ่ม Up
getSupportActionBar().setHomeAsUpIndicator(R.drawable.ic_custom_back); // ไอคอนกำหนดเอง (optional)
}
textView.setText("กดไอคอนใน Toolbar เพื่อทดสอบ");
}
// สร้าง Menu
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.toolbar_menu, menu);
return true;
}
// จัดการคลิก Menu Items และ Home/Up
@Override
public boolean onOptionsItemSelected(MenuItem item) {
int id = item.getItemId();
if (id == android.R.id.home) {
// ปุ่ม Up/Home ใน Toolbar
onBackPressed();
return true;
} else if (id == R.id.action_settings) {
textView.setText("กด Settings");
return true;
} else if (id == R.id.action_search) {
textView.setText("กด Search");
return true;
}
return super.onOptionsItemSelected(item);
}
}
ใช้ Toolbar โดยตรง (ยืดหยุ่นกว่า)
Toolbar toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
toolbar.setNavigationOnClickListener(v -> {
// คลิกปุ่ม Navigation (ลูกศร/ไอคอนซ้าย)
onBackPressed();
});
toolbar.setOnMenuItemClickListener(item -> {
// คลิก Action Icons (ขวา)
return onOptionsItemSelected(item);
});
กำหนดไอคอน Home/Up แบบกำหนดเอง
// ใน onCreate getSupportActionBar().setHomeAsUpIndicator(R.drawable.ic_custom_back); // หรือ toolbar.setNavigationIcon(R.drawable.ic_custom_back);
ทดสอบ
รันแอป → จะเห็นปุ่มลูกศรซ้าย และไอคอน Settings/Search ขวา → กดแต่ละอย่างดู Event