Drawer Nested FlowBuilder Experiment

main.dart

import 'package:flow_builder_example/src/flow_builder.dart';
import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: RootPage(),
    );
  }
}

enum RootPages { home, news, settings }

class RootPage extends StatefulWidget {
  @override
  _RootPageState createState() => _RootPageState();
}

class _RootPageState extends State<RootPage> {
  RootPages currentPage = RootPages.home;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      drawer: Drawer(
        child: ListView(
          padding: EdgeInsets.zero,
          children: <Widget>[
            DrawerHeader(
              child: Text('Drawer Header'),
              decoration: BoxDecoration(
                color: Colors.blue,
              ),
            ),
            ListTile(
              title: Text('HOME'),
              onTap: () {
                setState(() {
                  currentPage = RootPages.home;
                });
                Navigator.of(context).pop();
              },
            ),
            ListTile(
              title: Text('NEWS'),
              onTap: () {
                setState(() {
                  currentPage = RootPages.news;
                });
                Navigator.of(context).pop();
              },
            ),
            ListTile(
              title: Text('SETTINGS'),
              onTap: () {
                setState(() {
                  currentPage = RootPages.settings;
                });
                Navigator.of(context).pop();
              },
            ),
          ],
        ),
      ),
      body: FlowBuilder(
        state: currentPage,
        onGeneratePages: (state, List<Page<dynamic>> pages) {
          return [
            if (state == RootPages.home)
              MaterialPage(builder: (BuildContext context) => HomePage()),
            if (state == RootPages.news)
              MaterialPage(builder: (BuildContext context) => NewsPage()),
            if (state == RootPages.settings)
              MaterialPage(builder: (BuildContext context) => SettingsPage()),
          ];
        },
      ),
    );
  }
}

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Text('HOME PAGE'),
      ),
    );
  }
}

class NewsPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return FlowBuilder(
      state: 0,
      onGeneratePages: (state, pages) {
        return [
          MaterialPage(
              builder: (BuildContext context) => MyPage(
                    title: 'NEWS LIST',
                  )),
          if (state > 0)
            MaterialPage(
                builder: (BuildContext context) => MyPage(
                      title: 'NEWS DETAILS',
                    )),
          if (state > 1)
            MaterialPage(
                builder: (BuildContext context) => MyPage(
                      title: 'ADD NEWS',
                    )),
        ];
      },
    );
  }
}

class SettingsPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Text('SETTINGS PAGE'),
      ),
    );
  }
}

class MyPage extends StatelessWidget {
  final String title;
  final Function onPressed;
  const MyPage({Key key, this.title, this.onPressed}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(title),
      ),
      body: Center(
        child: Text(title),
      ),
      floatingActionButton: FloatingActionButton(
        child: Icon(Icons.arrow_forward_ios),
        onPressed: () {
          context.flow<int>().update((state) {
            if (state < 2) {
              return state + 1;
            }
            return state;
          });
        },
      ),
    );
  }
}