Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> Android

วิธีเพิ่ม OnClickListener ให้ Footer View ใน Android ListView

ภาพรวม

ตัวอย่างนี้สาธิตวิธีเพิ่ม Footer View ลงใน ListView และกำหนด OnClickListener ให้กับ Footer View นั้นใน Android

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

เปิด Android Studio ไปที่ File → New Project กรอกรายละเอียดที่จำเป็นทั้งหมดเพื่อสร้างโปรเจกต์ใหม่

ขั้นตอนที่ 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:tools="https://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="center_horizontal"
    android:layout_marginTop="30dp"
    tools:context=".MainActivity">
    <ListView
        android:id="@+id/list"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
    </ListView>
</LinearLayout>

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

package com.example.myapplication;

import android.graphics.Color;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.Gravity;
import android.view.View;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import android.widget.TextView;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.HashSet;

public class MainActivity extends AppCompatActivity {
    ListView list;
    String[] names = new String[]{"A", "B", "C"};
    String[] extended = new String[5];

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

        // ขยายอาร์เรย์
        extended[3] = "D";
        extended[4] = "E";
        System.arraycopy(names, 0, extended, 0, names.length);

        // ลบซ้ำด้วย HashSet
        HashSet<String> unique = new HashSet<>(Arrays.asList(extended));
        unique.addAll(Arrays.asList(names));
        ArrayList<String> arrayList = new ArrayList<>(unique);

        ArrayAdapter<String> adapter = new ArrayAdapter<>(this,
                android.R.layout.simple_list_item_1, arrayList);
        list.setAdapter(adapter);

        // สร้าง Footer View แบบ Dynamic
        final TextView footer = new TextView(this);
        footer.setGravity(Gravity.CENTER);
        footer.setTextSize(30);
        footer.setText("Footer View - Click Me");
        footer.setPadding(20, 20, 20, 20);
        footer.setBackgroundColor(Color.parseColor("#F0F0F0"));

        // กำหนด OnClickListener ให้ Footer
        footer.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                footer.setTextColor(Color.parseColor("#FF0000"));
                footer.setText("Footer Clicked!");
                // ทำงานอื่นๆ ที่นี่
            }
        });

        // เพิ่ม Footer เข้า ListView (ต้องทำก่อน setAdapter หรือหลังก็ได้ แต่ต้อง refresh)
        if (footer != null) {
            list.addFooterView(footer);
        } else {
            throw new NullPointerException("Footer is null");
        }
    }
}

การทดสอบ

รันแอป จะแสดง ListView พร้อม Footer "Footer View - Click Me" คลิก Footer จะเปลี่ยนสีตัวอักษรเป็นแดงและข้อความเป็น "Footer Clicked!"

ข้อสังเกตสำคัญเกี่ยวกับ addFooterView()

  • ต้องเรียก ก่อน setAdapter() ในบางเวอร์ชัน Android (แนะนำให้เรียกก่อนเสมอ)
  • Footer View จะไม่สามารถ Scroll ออกได้ (คงที่อยู่ท้ายสุด)
  • สามารถเพิ่มได้หลาย Footer ด้วย addFooterView() หลายครั้ง
  • ใช้ removeFooterView() เพื่อลบ Footer

Header View (เพิ่มเติม)

// สร้าง Header View
TextView header = new TextView(this);
header.setText("Header Title");
header.setGravity(Gravity.CENTER);
header.setTextSize(20);
header.setBackgroundColor(Color.BLUE);
header.setTextColor(Color.WHITE);

list.addHeaderView(header); // เพิ่ม Header (ต้องก่อน setAdapter เช่นกัน)

ListView vs RecyclerView

RecyclerView เป็นตัวเลือกที่ดีกว่าสำหรับแอปสมัยใหม่:

  • รองรับ Header/Footer ผ่าน Adapter (ViewType)
  • มี ViewHolder Pattern บังคับใช้ (ประสิทธิภาพดีกว่า)
  • รองรับ LayoutManager หลากหลาย (Grid, Staggered, Horizontal)
  • มี ItemAnimator ในตัว

ตัวอย่าง RecyclerView กับ Footer

// ใน Adapter
class MyAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
    static final int TYPE_ITEM = 0;
    static final int TYPE_FOOTER = 1;

    @Override
    public int getItemViewType(int position) {
        return (position == getItemCount() - 1) ? TYPE_FOOTER : TYPE_ITEM;
    }
    // ... onCreateViewHolder, onBindViewHolder
}