0

I am trying to experiment with nested ShowCaseWidgets to get something working within my main app.

Is there a way of doing something only after the first ShowCase is finished? I want to run the second ShowCase (which is on the next page) only when the first one is completely finished. Tried lots of things/ ways around it and nothing is giving me the result I am after.

Anybody got a suggestion on how this can be accomplished? Thanks

Here is my main.dart file:

void main() {
  runApp(MaterialApp(
      home: ShowCaseWidget(
          onFinish: () {
            Test.showHome = true;
          },
          builder: Builder(builder: (_) => const Playground()))));
}

class Test with ChangeNotifier {
  static bool showHome = false;
}

class Playground extends StatefulWidget {
  const Playground({super.key});

  @override
  State<Playground> createState() => _PlaygroundState();
}

class _PlaygroundState extends State<Playground> {
  final GlobalKey globalKeyOne = GlobalKey();
  late bool showCaseFinished;

  @override
  void initState() {
    setState(() {
      showCaseFinished = Test.showHome;
    });
    if (showCaseFinished == false) {
      WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
        ShowCaseWidget.of(context).startShowCase([globalKeyOne]);
      });
    }
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
            leading: CustomShowCaseWidget(
          globalKey: globalKeyOne,
          description: "This is the menu button",
          child: IconButton(
            icon: const Icon(Icons.menu),
            onPressed: () {},
          ),
        )),
        body: showCaseFinished ? const NewPage() : Container());
  }
}

And this is my new_page.dart file:

class NewPage extends StatefulWidget {
  const NewPage({super.key});

  @override
  State<NewPage> createState() => _NewPageState();
}

class _NewPageState extends State<NewPage> {
  final GlobalKey globalKeyOne = GlobalKey();

  @override
  void initState() {
    WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
      ShowCaseWidget.of(context).startShowCase([globalKeyOne]);
    });
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return ShowCaseWidget(
        builder: Builder(
            builder: (_) => Center(
                child: CustomShowCaseWidget(
                    description: "Hello Matey",
                    globalKey: globalKeyOne,
                    child: const Text("Hello World")))));
  }
}
RishV
  • 17
  • 3

0 Answers0