activity_flow 0.0.8 copy "activity_flow: ^0.0.8" to clipboard
activity_flow: ^0.0.8 copied to clipboard

VTEX Activity Flow Flutter SDK

example/example.md

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

import 'package:example/screens/favorite.dart';
import 'package:example/screens/products.dart';
import 'package:example/screens/profile.dart';

void main() {
  runApp(ExampleApp());
}

/// A MaterialApp with a custom theme and routes.
///
/// The routes are defined in the [routes] property.
/// The theme is defined in the [theme] property.
class ExampleApp extends StatelessWidget {
  ExampleApp({super.key});

  final accountName = 'Account 1'

  final afObserver = PageViewObserver(accountName: accountName);

  @override
  Widget build(BuildContext context) {
    return TouchDetector( //AF config
      accountName: accountName,
      child: MaterialApp(
        title: 'Example App',
        theme: ThemeData(
          colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
          useMaterial3: true,
        ),
        routes: {
          '/': (context) => const MyHomePage(),
          '/products': (context) => const ProductsScreen(),
          '/profile': (context) => const ProfileScreen(),
          '/favorites': (context) => const FavoriteScreen(),
        },
        initialRoute: '/',
        navigatorObservers: [afObserver], //AF config
      ),
    );
  }
}

/// A home screen with buttons to navigate to other screens.
class MyHomePage extends StatelessWidget {
  const MyHomePage({super.key});

  final List<Map> _routes = const [
    {
      'name': 'Products',
      'route': '/products',
    },
    {
      'name': 'Profile',
      'route': '/profile',
    }
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: const Text('Home Screen'),
      ),
      body: Center(
          child: Column(mainAxisAlignment: MainAxisAlignment.center, children: [
        ..._routes.map((route) => ButtonTemplate(
              title: route['name'],
              route: route['route'],
            )),
      ])),
    );
  }
}

/// A template for creating buttons.
///
/// Receives a [title], [icon], and [route] to navigate to.
/// Returns an [ElevatedButton.icon] with the given parameters.
class ButtonTemplate extends StatelessWidget {
  const ButtonTemplate({
    super.key,
    required this.title,
    required this.route,
  });

  final String title;
  final String route;

  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      onPressed: () => Navigator.pushNamed(context, route),
      child: Text(title),
    );
  }
}