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

วิธีสร้าง Custom Push Notification สำหรับ Android App

ภาพรวม

ตัวอย่างนี้สาธิตการสร้าง Custom Notification Layout ที่มี EditText สำหรับรับข้อมูลจากผู้ใช้โดยตรงในการแจ้งเตือน (Remote Input) พร้อม Custom View

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

Android Studio → File → New Project

ขั้นตอนที่ 2: Layout หลัก (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">

    <Button
        android:onClick="createNotification"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:layout_margin="16dp"
        android:text="Create notification" />
</RelativeLayout>

ขั้นตอนที่ 3: Custom Layout (custom_notification_layout.xml) - มี EditText

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="https://schemas.android.com/apk/res/android"
    android:id="@+id/layout"
    android:layout_width="match_parent"
    android:layout_height="96dp"
    android:padding="10dp">

    <ImageView
        android:id="@+id/image"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_alignParentStart="true"
        android:layout_marginEnd="10dp"
        android:contentDescription="@string/app_name"
        android:src="@mipmap/ic_launcher" />

    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toEndOf="@id/image"
        android:text="Testing"
        android:textColor="#000"
        android:textSize="18sp" />

    <EditText
        android:id="@+id/etInput"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/title"
        android:layout_marginTop="8dp"
        android:layout_toEndOf="@+id/image"
        android:hint="Enter something..."
        android:inputType="text"
        android:textSize="14sp" />
</RelativeLayout>

ขั้นตอนที่ 4: MainActivity - ใช้ RemoteViews

package app.tutorialspoint.com.notifyme;

import android.app.NotificationChannel;
import android.app.NotificationManager;
import android.os.Build;
import android.os.Bundle;
import android.support.v4.app.NotificationCompat;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.RemoteViews;

public class MainActivity extends AppCompatActivity {
    public static final String NOTIFICATION_CHANNEL_ID = "10001";
    private final static String default_notification_channel_id = "default";

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

    public void createNotification(View view) {
        RemoteViews contentView = new RemoteViews(getPackageName(), R.layout.custom_notification_layout);

        NotificationManager mNotificationManager = (NotificationManager) getSystemService(NOTIFICATION_SERVICE);
        NotificationCompat.Builder mBuilder = new NotificationCompat.Builder(MainActivity.this, default_notification_channel_id);

        mBuilder.setContent(contentView);
        mBuilder.setSmallIcon(R.drawable.ic_launcher_foreground);
        mBuilder.setAutoCancel(true);

        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
            int importance = NotificationManager.IMPORTANCE_HIGH;
            NotificationChannel notificationChannel = new NotificationChannel(
                NOTIFICATION_CHANNEL_ID, "NOTIFICATION_CHANNEL_NAME", importance);
            mBuilder.setChannelId(NOTIFICATION_CHANNEL_ID);
            assert mNotificationManager != null;
            mNotificationManager.createNotificationChannel(notificationChannel);
        }

        assert mNotificationManager != null;
        mNotificationManager.notify((int) System.currentTimeMillis(), mBuilder.build());
    }
}

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

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

    <uses-permission android:name="android.permission.VIBRATE" />

    <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>

⚠️ ข้อจำกัดสำคัญของ EditText ใน Custom Notification

EditText ใน RemoteViews ไม่ทำงานได้จริง!
  • RemoteViews ไม่รองรับการรับ Input จาก EditText โดยตรง
  • EditText จะแสดงได้ แต่ไม่สามารถพิมพ์/โฟกัสได้ใน Notification Shade
  • Android ไม่อนุญาตให้ EditText ใน RemoteViews รับการป้อนข้อมูล

วิธีที่ถูกต้อง: ใช้ RemoteInput (Android 7.0+ API 24+)

แทนที่จะใช้ EditText ใน Layout ให้ใช้ RemoteInput ซึ่งเป็น API มาตรฐานสำหรับรับ Input จาก Notification

ตัวอย่าง RemoteInput ที่ทำงานจริง

public void createNotificationWithRemoteInput(View view) {
    // 1. สร้าง RemoteInput
    String KEY_TEXT_REPLY = "key_text_reply";
    String replyLabel = "พิมพ์คำตอบ...";
    
    RemoteInput remoteInput = new RemoteInput.Builder(KEY_TEXT_REPLY)
        .setLabel(replyLabel)
        .build();

    // 2. สร้าง PendingIntent สำหรับรับผลลัพธ์
    Intent replyIntent = new Intent(this, ReplyReceiver.class);
    PendingIntent replyPendingIntent = PendingIntent.getBroadcast(
        this, 0, replyIntent, 
        PendingIntent.FLAG_IMMUTABLE | PendingIntent.FLAG_UPDATE_CURRENT
    );

    // 3. สร้าง Action พร้อม RemoteInput
    NotificationCompat.Action action = new NotificationCompat.Action.Builder(
        R.drawable.ic_reply, "ตอบกลับ", replyPendingIntent)
        .addRemoteInput(remoteInput)
        .setAllowGeneratedReplies(true)
        .build();

    // 4. สร้าง Notification
    NotificationCompat.Builder builder = new NotificationCompat.Builder(this, CHANNEL_ID)
        .setSmallIcon(R.drawable.ic_launcher_foreground)
        .setContentTitle("ข้อความใหม่")
        .setContentText("คุณมีข้อความจาก สมชาย")
        .setStyle(new NotificationCompat.MessagingStyle("คุณ")
            .addMessage("สวัสดีครับ", System.currentTimeMillis(), "สมชาย"))
        .addAction(action)
        .setAutoCancel(true);

    notificationManager.notify(NOTIFICATION_ID, builder.build());
}

BroadcastReceiver รับค่าที่ป้อน

public class ReplyReceiver extends BroadcastReceiver {
    @Override
    public void onReceive(Context context, Intent intent) {
        Bundle remoteInput = RemoteInput.getResultsFromIntent(intent);
        if (remoteInput != null) {
            String replyText = remoteInput.getCharSequence(KEY_TEXT_REPLY).toString();
            // ประมวลผลข้อความตอบกลับ
            Log.d("REPLY", "User replied: " + replyText);
        }
    }
}

// ใน Manifest
/*

    
        
    

*/

Custom Notification Layout ที่ทำงานได้ (ไม่มี EditText)

RemoteViews รองรับ View เหล่านี้:

  • ✅ TextView, ImageView, Button, ImageButton
  • ✅ ProgressBar, Chronometer, AnalogClock
  • ✅ LinearLayout, RelativeLayout, FrameLayout, GridLayout
  • ❌ EditText, WebView, RecyclerView, ListView, ViewPager
  • ❌ Custom Views, Fragment, ScrollView

สรุป

  • Custom Layout ด้วย RemoteViews ใช้ได้สำหรับ UI แบบ Static (แสดงผลอย่างเดียว)
  • ต้องการ Input จากผู้ใช้ → ใช้ RemoteInput + Action (มาตรฐาน Android)
  • MessagingStyle + RemoteInput = ประสบการณ์แชทที่ดีที่สุด
  • ทดสอบบน Android 7.0+ (API 24+) สำหรับ RemoteInput