Skip to content

PageView Events

Also referred as Screen Views, defines which page is being currently viewed by the user and from which page/screen did he reach there.

Overview

PageView events are essential for understanding user navigation patterns, popular screens, and user journey through your application. These events help you track which screens users visit most frequently and how they navigate between different parts of your app.

Creating PageView Events

Basic Usage

dart
import 'package:flutter_upshot_plugin/flutter_upshot_plugin.dart';

// Create a pageview event
void trackPageView(String pageName) {
  FlutterUpshotPlugin.createPageViewEvent(pageName);
      (OR)
  String? eventId = await FlutterUpshotPlugin.createPageViewEvent(pageName);
}

// Example usage
trackPageView("HomeScreen");
trackPageView("ProfileScreen");
trackPageView("SettingsScreen");

Note

A Screen View/Page View Event should be added to each of your Activities/ViewControllers or Component.

Flutter Navigation Integration

For Flutter apps, you can automatically track screen views using Navigator observers:

dart
import 'package:flutter/material.dart';
import 'package:flutter_upshot_plugin/flutter_upshot_plugin.dart';

class UpshotNavigatorObserver extends NavigatorObserver {
  @override
  void didPush(Route<dynamic> route, Route<dynamic>? previousRoute) {
    super.didPush(route, previousRoute);
    if (route.settings.name != null) {
      FlutterUpshotPlugin.createPageViewEvent(route.settings.name!);
    }
  }

  @override
  void didReplace({Route<dynamic>? newRoute, Route<dynamic>? oldRoute}) {
    super.didReplace(newRoute: newRoute, oldRoute: oldRoute);
    if (newRoute?.settings.name != null) {
      FlutterUpshotPlugin.createPageViewEvent(newRoute!.settings.name!);
    }
  }
}

// In your MaterialApp
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      navigatorObservers: [UpshotNavigatorObserver()],
      routes: {
        '/': (context) => HomeScreen(),
        '/profile': (context) => ProfileScreen(),
        '/settings': (context) => SettingsScreen(),
      },
    );
  }
}

Flutter Navigation Tracking

Flutter automatically tracks page views when using named routes with the UpshotNavigatorObserver:

dart
class NavigationTracker {
  static String? previousRoute;

  static void trackPageView(String routeName) {
    if (previousRoute != routeName) {
      // Track the screen view
      FlutterUpshotPlugin.createPageViewEvent(routeName)
      previousRoute = routeName;
    }
  }
}

Best Practices

  1. Consistent Naming: Use a consistent naming convention for all screens
  2. Meaningful Names: Use descriptive names that clearly identify the screen
  3. Avoid Duplicates: Don't track the same screen view multiple times unnecessarily
  4. Error Handling: Always handle the callback response

Validation

You can validate PageView events in the Dashboard Live Events section to ensure your events are being captured correctly.

Next Steps

Powered by Upshot.ai