brudcast_in_app 0.2.0

In-app messages and the inbox for the Brudcast Flutter SDK, drawn by the native Android and iOS renderers.

brudcast_in_app

In-app messages and the inbox for the Brudcast Flutter SDK. Messages are drawn by the native Android and iOS renderers, the same way they are in native apps, over your Flutter UI with no widget to place.

Features

• Modal, banner and full screen messages, triggered by events, screens and sessions, with display rules and frequency caps set in the dashboard.
• A message handler to show, suppress, defer or draw each message yourself.
• Pause and resume display, such as during checkout or a video.
• The native inbox screen, or your own: InboxController pages the inbox and follows its unread count, and BrudcastInboxMessage draws an entry with the native renderer.
• A live unread count for badges, kept in step across the user's devices.

Platform support

Android	iOS
API 24 and later	14 and later, with Swift Package Manager

Messages show on Flutter's default FlutterActivity; no activity change is needed.

Getting started

flutter pub add brudcast_flutter brudcast_in_app

or in pubspec.yaml:

dependencies:
  brudcast_flutter: ^0.2.0
  brudcast_in_app: ^0.2.0

Set up brudcast_flutter, then add the module when you initialise:

await Brudcast.initialize('bpk_...', const BrudcastOptions(modules: [BrudcastInApp.module]));

Messages then show as their triggers fire, from Brudcast.track and Brudcast.screen.

Usage

Control display

Brudcast.inApp.pauseDisplay();   // triggers that fire meanwhile are kept
Brudcast.inApp.resumeDisplay();

await Brudcast.inApp.setMessageHandler((message) async {
  if (onboarding) return BrudcastMessageDecision.defer;
  return BrudcastMessageDecision.show;
});

The handler has two seconds to answer, after which the message shows.

Draw a message yourself

Return BrudcastMessageDecision.custom, draw the message from message.designDocument, and report what happened:

Brudcast.inApp.reportImpression(message.id);
Brudcast.inApp.reportClick(message.id, buttonId);
Brudcast.inApp.reportDismiss(message.id);

The native inbox

Brudcast.inApp.inbox.present(title: 'Inbox');

An unread badge

ValueListenableBuilder<int>(
  valueListenable: Brudcast.inApp.inbox.unreadCount,
  builder: (context, unread, _) => Badge(
    isLabelVisible: unread > 0,
    label: Text('$unread'),
    child: const Icon(Icons.inbox),
  ),
)

An inbox built in Flutter

final controller = InboxController();

ListenableBuilder(
  listenable: controller,
  builder: (context, _) => ListView(
    children: [
      for (final message in controller.messages)
        ListTile(
          title: Text(message.title),
          subtitle: Text(message.preview),
          onTap: () {
            controller.markRead(message);
            Navigator.of(context).push(MaterialPageRoute(
              builder: (_) => Scaffold(body: BrudcastInboxMessage(message: message, expand: true)),
            ));
          },
        ),
    ],
  ),
);

Call controller.loadMore() near the end of the list and controller.refresh() on pull to refresh; markRead and delete update the list at once and then every device. Brudcast.inApp.inbox.list fetches pages directly.

BrudcastInboxMessage is a platform view that sizes itself to the design, so it fits in a scroll view. Platform views are costly on Android in long lists: use it for a detail screen, and plain Flutter tiles from title, preview and thumbnailUrl for the list.

Additional information

• Versions. Keep this package on the same version as brudcast_flutter; each version runs the native SDKs of the same number.
• Example. A complete app is in example.
• Documentation: docs.brudcast.com.
• Issues and contributing: file an issue or read CONTRIBUTING.md.
• License: Apache License 2.0.