Event

Pengantar

Event sangat berguna ketika Anda perlu menangani logika setelah sesuatu terjadi di aplikasi Anda. Sistem event Nylo memungkinkan Anda membuat, mengirim, dan mendengarkan event dari mana saja di aplikasi Anda, memudahkan pembangunan aplikasi Flutter yang responsif dan berbasis event.

Memahami Event

Pemrograman berbasis event adalah paradigma di mana alur aplikasi Anda ditentukan oleh event seperti aksi pengguna, output sensor, atau pesan dari program atau thread lain. Pendekatan ini membantu memisahkan berbagai bagian aplikasi Anda, membuat kode Anda lebih mudah dipelihara dan dipahami.

Contoh Event Umum

Berikut beberapa event tipikal yang mungkin digunakan aplikasi Anda:

• Registrasi pengguna selesai
• Pengguna login/logout
• Produk ditambahkan ke keranjang
• Pembayaran berhasil diproses
• Sinkronisasi data selesai
• Push notification diterima

Membuat Event

Anda dapat membuat event baru menggunakan CLI framework Nylo atau Metro:

metro make:event PaymentSuccessfulEvent

Setelah menjalankan perintah, file event baru akan dibuat di direktori app/events/.

Struktur Event

Berikut struktur file event yang baru dibuat (contoh: app/events/payment_successful_event.dart):

import 'package:nylo_framework/nylo_framework.dart';

class PaymentSuccessfulEvent implements NyEvent {
  final listeners = {
    DefaultListener: DefaultListener(),
  };
}

class DefaultListener extends NyListener {
  handle(dynamic event) async {
    // Handle the payload from event
  }
}

Mengirim Event

Event dapat dikirim dari mana saja di aplikasi Anda menggunakan method helper event.

Pengiriman Event Dasar

Untuk mengirim event tanpa data:

event<PaymentSuccessfulEvent>();

Mengirim dengan Data

Untuk mengirim data bersama event Anda:

event<PaymentSuccessfulEvent>(data: {
  'user': user,
  'amount': amount,
  'transactionId': 'txn_123456'
});

Broadcasting Event

Secara default, event Nylo hanya ditangani oleh listener yang didefinisikan di kelas event. Untuk mem-broadcast event (membuatnya tersedia untuk listener eksternal), gunakan parameter broadcast:

event<PaymentSuccessfulEvent>(
  data: {'user': user, 'amount': amount},
  broadcast: true
);

Mendengarkan Event

Nylo menyediakan beberapa cara untuk mendengarkan dan merespons event.

Menggunakan Helper listenOn

Helper listenOn dapat digunakan di mana saja di aplikasi Anda untuk mendengarkan event yang di-broadcast:

NyEventSubscription subscription = listenOn<PaymentSuccessfulEvent>((data) {
  // Access event data
  final user = data['user'];
  final amount = data['amount'];

  // Handle the event
  showSuccessMessage("Payment of $amount received");
});

Menggunakan Helper listen

Helper listen tersedia di kelas NyPage dan NyState. Helper ini secara otomatis mengelola subscription, berhenti berlangganan saat widget di-dispose:

class _CheckoutPageState extends NyPage<CheckoutPage> {
  @override
  get init => () {
    listen<PaymentSuccessfulEvent>((data) {
      // Handle payment success
      routeTo(OrderConfirmationPage.path);
    });

    listen<PaymentFailedEvent>((data) {
      // Handle payment failure
      displayErrorMessage(data['error']);
    });
  };

  // Rest of your page implementation
}

Berhenti Berlangganan Event

Saat menggunakan listenOn, Anda harus berhenti berlangganan secara manual untuk mencegah kebocoran memori:

// Store the subscription
final subscription = listenOn<PaymentSuccessfulEvent>((data) {
  // Handle event
});

// Later, when no longer needed
subscription.cancel();

Helper listen secara otomatis menangani pembatalan langganan saat widget di-dispose.

Bekerja dengan Listener

Listener adalah kelas yang merespons event. Setiap event dapat memiliki beberapa listener untuk menangani aspek berbeda dari event tersebut.

Menambahkan Beberapa Listener

Anda dapat menambahkan beberapa listener ke event Anda dengan memperbarui properti listeners:

class PaymentSuccessfulEvent implements NyEvent {
  final listeners = {
    NotificationListener: NotificationListener(),
    AnalyticsListener: AnalyticsListener(),
    OrderProcessingListener: OrderProcessingListener(),
  };
}

Mengimplementasikan Logika Listener

Setiap listener harus mengimplementasikan method handle untuk memproses event:

class NotificationListener extends NyListener {
  handle(dynamic event) async {
    // Send notification to user
    final user = event['user'];
    await NotificationService.sendNotification(
      userId: user.id,
      title: "Payment Successful",
      body: "Your payment of ${event['amount']} was processed successfully."
    );
  }
}

class AnalyticsListener extends NyListener {
  handle(dynamic event) async {
    // Log analytics event
    await AnalyticsService.logEvent(
      "payment_successful",
      parameters: {
        'amount': event['amount'],
        'userId': event['user'].id,
      }
    );
  }
}

Broadcasting Event Global

Jika Anda ingin semua event di-broadcast secara otomatis tanpa menentukan broadcast: true setiap kali, Anda dapat mengaktifkan broadcasting global.

Mengaktifkan Broadcasting Global

Edit file app/providers/app_provider.dart Anda dan tambahkan method broadcastEvents() ke instance Nylo Anda:

class AppProvider implements NyProvider {
  @override
  boot(Nylo nylo) async {
    // Other configuration

    // Enable broadcasting for all events
    nylo.broadcastEvents();
  }
}

Dengan broadcasting global diaktifkan, Anda dapat mengirim dan mendengarkan event dengan lebih ringkas:

// Dispatch event (no need for broadcast: true)
event<PaymentSuccessfulEvent>(data: {
  'user': user,
  'amount': amount,
});

// Listen for the event anywhere
listen<PaymentSuccessfulEvent>((data) {
  // Handle event data
});