androidflutterdartshowcaseview

showcaseview after upgrade to flutter 3.7.1 not disable target click


You can press target widget,which navigate to next page before complete showcases.

This problem happened after upgrade to flutter 3.7

**This is full code **

//main page

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

 void main() {
 runApp(const MyApp());
  }

//MyApp Page

    class MyApp extends StatelessWidget {
 const MyApp({super.key});

 @override
Widget build(BuildContext context) {
    return MaterialApp(
    title: 'Flutter Demo',
    theme: ThemeData(
    primarySwatch: Colors.blue,
  ),
 //showCaseWidget
  home: ShowCaseWidget(
      disableMovingAnimation: true,
      disableScaleAnimation: true,
      builder: Builder(
          builder: (_) =>
              const MyHomePage(title: 'Flutter Demo Home Page')),
      onFinish: () async {}),
      );
     }
  }

//MyHomePage

  class MyHomePage extends StatefulWidget {
    const MyHomePage({super.key, required this.title});

  final String title;

 @override
  State<MyHomePage> createState() => _MyHomePageState();
    }

 class _MyHomePageState extends State<MyHomePage> {
    final int _counter = 0;
//showCase keys
  final _increment = GlobalKey();
   final _decrement = GlobalKey();
  final _texxt = GlobalKey();

void navigateToPage(fun) {
   Navigator.push(
    context,
    MaterialPageRoute(
        builder: (_) => ShowCaseWidget(
            builder: Builder(builder: (_) => fun), onFinish: () async 
{})));
}

 void _incrementCounter() {
navigateToPage(const Increment());
}

 void _textWidget() {
 navigateToPage(const TextWidget());
}

 void _decrementCounter() async {
  navigateToPage( const Decrement());
}

 @override
void initState() {
// TODO: implement initState
  super.initState(); 
 //start showcase
  WidgetsBinding.instance.addPostFrameCallback(
  (_) => ShowCaseWidget.of(context)
      .startShowCase([_increment, _decrement, _texxt]),
   );
 }

@override
Widget build(BuildContext context) {
return Scaffold(
  appBar: AppBar(
    title: Text(widget.title),
  ),
  body: InkWell(
    onTap: _textWidget,
    child: Center(
      child: CustomShowcaseWidget(
        description: 'this is text widget ',
        globalKey: _texxt,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            const Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.headlineMedium,
            ),
          ],
        ),
      ),
    ),
  ),
  floatingActionButton: Column(
    mainAxisAlignment: MainAxisAlignment.end,
    children: [
      CustomShowcaseWidget(
        description: 'this is increment floating button widget ',
        globalKey: _increment,
        child: FloatingActionButton(
          heroTag: "increment",
          onPressed: _incrementCounter,
          tooltip: 'Increment',
          child: const Icon(Icons.add),
        ),
      ),
      CustomShowcaseWidget(
        description: 'this is decrement floating button widget ',
        globalKey: _decrement,
        child: FloatingActionButton(
          heroTag: "decrement",
          onPressed: _decrementCounter,
          tooltip: 'decrement',
          child: const Icon(Icons.minimize),
        ),
      ),
    ],
  ), 
   );
  }
     }

//CustomShowcaseWidget

class CustomShowcaseWidget extends StatelessWidget {
final Widget child;
 final String description;
final GlobalKey globalKey;

 const CustomShowcaseWidget(
  {required this.description,
  required this.child,
  required this.globalKey,
  Key? key})
  : super(key: key);

 @override
 Widget build(BuildContext context) => Showcase(
    key: globalKey,
    tooltipBackgroundColor: Colors.green,
    tooltipPadding:
        const EdgeInsets.symmetric(horizontal: 10, vertical: 10),
    showArrow: true,
    disableMovingAnimation: true,
    disableScaleAnimation: true,
    disableDefaultTargetGestures: true,
    description: description,
    descTextStyle: const TextStyle(
        color: Colors.white, fontWeight: FontWeight.bold, fontSize: 
 20),
    child: child,
  );
}

// Increment Widget

 class Increment extends StatelessWidget {
  const Increment({super.key});

 @override
 Widget build(BuildContext context) {
   return Container(
  color: Colors.white,
  child: const Center(
    child: Text("Increment Screen"),
    ),
  );
  }
}

//Decrement Widget

 class Decrement extends StatelessWidget {
  const Decrement({super.key});

 @override
 Widget build(BuildContext context) {
return Container(
  color: Colors.white,
  child: const Center(
    child: Text("Decrement Screen"),
  ),
);
 }
}

//TextWidget

class TextWidget extends StatelessWidget {
 const TextWidget({super.key});

 @override
 Widget build(BuildContext context) {
   return Container(
    color: Colors.white,
    child: const Center(
      child: Text("Text Screen"),
     ),
    );
  }
 }

As shown in the pictures The Floating action button (+) is the target widget

image

This happened after click the target

image


Solution

  • Issue resolved in the new version showcaseview: ^2.0.2 of the library