diff --git a/CHANGELOG.md b/CHANGELOG.md index b1e294e0..807df820 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,11 @@ +## [1.1.7] - June 7, 2022 + +- Fixed [#235](https://github.com/SimformSolutionsPvtLtd/flutter_showcaseview/issues/235) - 1.1.6 scrolling behavior in PageView. +- Fixed [#242](https://github.com/SimformSolutionsPvtLtd/flutter_showcaseview/issues/242) - Error when display showcase on FloatingActionBar inside a TabBar (with more than 1 tab). + ## [1.1.6] - June 23, 2022 -- Fixed [#62](https://github.com/SimformSolutionsPvtLtd/flutter_showcaseview/issues/62) - While using ShowCase widget, not scrolling to respective widget when its not visible. +- Fixed [#62](https://github.com/SimformSolutionsPvtLtd/flutter_showcaseview/issues/62) - While using ShowCase widget, not scrolling to respective widget when it's not visible. - Fixed [#131](https://github.com/SimformSolutionsPvtLtd/flutter_showcaseview/issues/131) - Support of other gestures onTargetLongPress and onTargetDoubleTap - Fixed [#140](https://github.com/SimformSolutionsPvtLtd/flutter_showcaseview/issues/140) - disableAnimation at ShowcaseWidget level - Fixed [#71](https://github.com/SimformSolutionsPvtLtd/flutter_showcaseview/issues/71) - Highlight Not working when widget is not visible on screen diff --git a/README.md b/README.md index 1822288b..0182aff2 100644 --- a/README.md +++ b/README.md @@ -171,6 +171,14 @@ ShowCaseWidget( ); ``` +## Enable Auto Scrolling +By default, auto-scrolling behavior is off, you can enable it by setting ``enableAutoScroll`` flag to true in ``showCaseWidget``. +```dart +ShowCaseWidget( + enableAutoScroll: true, +); +``` + ## Main Contributors diff --git a/example/android/app/build.gradle b/example/android/app/build.gradle index efa45dfa..1b66a242 100644 --- a/example/android/app/build.gradle +++ b/example/android/app/build.gradle @@ -26,7 +26,7 @@ apply plugin: 'kotlin-android' apply from: "$flutterRoot/packages/flutter_tools/gradle/flutter.gradle" android { - compileSdkVersion 30 + compileSdkVersion 31 sourceSets { main.java.srcDirs += 'src/main/kotlin' @@ -39,7 +39,7 @@ android { defaultConfig { applicationId "com.simform.example" minSdkVersion 16 - targetSdkVersion 30 + targetSdkVersion 31 versionCode flutterVersionCode.toInteger() versionName flutterVersionName testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner" diff --git a/example/lib/main.dart b/example/lib/main.dart index 9aaf61ad..53e3e20d 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -57,7 +57,6 @@ class _MailPageState extends State { final GlobalKey _three = GlobalKey(); final GlobalKey _four = GlobalKey(); final GlobalKey _five = GlobalKey(); - final GlobalKey _six = GlobalKey(); List mails = []; final scrollController = ScrollController(); @@ -70,71 +69,71 @@ class _MailPageState extends State { //flutter version greater than 3.x and direct use WidgetsBinding.instance ambiguate(WidgetsBinding.instance)?.addPostFrameCallback( (_) => ShowCaseWidget.of(context) - .startShowCase([_one, _two, _three, _four, _five, _six]), + .startShowCase([_one, _two, _three, _four, _five]), ); mails = [ Mail( sender: 'Medium', sub: 'Showcase View', msg: 'Check new showcase View', - date: '25 May', + date: '1 May', isUnread: false, ), Mail( sender: 'Quora', sub: 'New Question for you', msg: 'Hi, There is new question for you', - date: '22 May', - isUnread: false, + date: '2 May', + isUnread: true, ), Mail( sender: 'Google', sub: 'Flutter 1.5', msg: 'We have launched Flutter 1.5', - date: '20 May', - isUnread: true, + date: '3 May', + isUnread: false, ), Mail( sender: 'Github', sub: 'Showcase View', msg: 'New star on your showcase view.', - date: '21 May ', - isUnread: false, + date: '4 May ', + isUnread: true, ), Mail( sender: 'Simform', sub: 'Credit card Plugin', msg: 'Check out our credit card plugin', - date: '19 May', - isUnread: true, + date: '5 May', + isUnread: false, ), Mail( sender: 'Flutter', sub: 'Flutter is Future', - msg: 'Flutter laucnhed for Web', - date: '18 Jun', + msg: 'Flutter launched for Web', + date: '6 May', isUnread: true, ), Mail( sender: 'Medium', sub: 'Showcase View', msg: 'Check new showcase View', - date: '21 May ', + date: '7 May ', isUnread: false, ), Mail( sender: 'Simform', sub: 'Credit card Plugin', msg: 'Check out our credit card plugin', - date: '19 May', + date: '8 May', isUnread: true, ), Mail( sender: 'Flutter', sub: 'Flutter is Future', - msg: 'Flutter laucnhed for Web', - date: '18 Jun', - isUnread: true, + msg: 'Flutter launched for Web', + date: '9 May', + isUnread: false, ), ]; } @@ -259,14 +258,14 @@ class _MailPageState extends State { physics: const BouncingScrollPhysics(), itemBuilder: (context, index) { if (index == 0) { - return showcaseMailTile(_three, true, context); - } else if (index == mails.length - 1) { - return showcaseMailTile(_six, false, context); + return showcaseMailTile(_three, true, context, mails.first); } - return MailTile(mails[index % mails.length]); + return MailTile( + mail: mails[index % mails.length], + ); }, ), - ) + ), ], ), ), @@ -284,7 +283,7 @@ class _MailPageState extends State { * render tree. */ scrollController.jumpTo(0); ShowCaseWidget.of(context) - .startShowCase([_one, _two, _three, _four, _five, _six]); + .startShowCase([_one, _two, _three, _four, _five]); }); }, child: const Icon( @@ -296,7 +295,7 @@ class _MailPageState extends State { } GestureDetector showcaseMailTile(GlobalKey> key, - bool showCaseDetail, BuildContext context) { + bool showCaseDetail, BuildContext context, Mail mail) { return GestureDetector( onTap: () { Navigator.push( @@ -309,133 +308,26 @@ class _MailPageState extends State { child: Container( padding: const EdgeInsets.symmetric(vertical: 8), child: Showcase( - key: key, - description: 'Tap to check mail', - disposeOnTap: true, - onTargetClick: () { - Navigator.push( - context, - MaterialPageRoute( - builder: (_) => const Detail(), - ), - ).then((_) { - setState(() { - ShowCaseWidget.of(context).startShowCase([_four, _five]); - }); - }); - }, - child: Container( - padding: - const EdgeInsets.only(left: 6, right: 16, top: 5, bottom: 5), - color: const Color(0xffFFF6F7), - child: Row( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Expanded( - child: Row( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - if (showCaseDetail) - Showcase.withWidget( - key: _four, - height: 50, - width: 140, - shapeBorder: const CircleBorder(), - radius: const BorderRadius.all(Radius.circular(150)), - container: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Container( - width: 45, - height: 45, - decoration: const BoxDecoration( - shape: BoxShape.circle, - color: Color(0xffFCD8DC), - ), - child: Center( - child: Text( - 'S', - style: TextStyle( - color: Theme.of(context).primaryColor, - fontWeight: FontWeight.bold, - fontSize: 16, - ), - ), - ), - ), - const SizedBox( - height: 10, - ), - const Text( - "Your sender's profile ", - style: TextStyle(color: Colors.white), - ) - ], - ), - child: const SAvatarExampleChild(), - ) - else - const SAvatarExampleChild(), - const Padding(padding: EdgeInsets.only(left: 8)), - Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - const Text( - 'Slack', - style: TextStyle( - fontWeight: FontWeight.bold, - fontSize: 17, - ), - ), - const Text( - 'Flutter Notification', - style: TextStyle( - fontSize: 16, - ), - ), - Text( - 'Hi, you have new Notification', - style: TextStyle( - fontWeight: FontWeight.normal, - color: Theme.of(context).primaryColor, - fontSize: 15, - ), - ), - ], - ) - ], - ), + key: key, + description: 'Tap to check mail', + disposeOnTap: true, + onTargetClick: () { + Navigator.push( + context, + MaterialPageRoute( + builder: (_) => const Detail(), ), - SizedBox( - width: 50, - child: Column( - mainAxisAlignment: MainAxisAlignment.center, - children: const [ - SizedBox( - height: 5, - ), - Text( - '1 Jun', - style: TextStyle( - fontWeight: FontWeight.normal, - fontSize: 12, - color: Colors.grey, - ), - ), - SizedBox( - height: 10, - ), - Icon( - Icons.star, - color: Color(0xffFBC800), - ) - ], - ), - ), - ], - ), - ), - ), + ).then((_) { + setState(() { + ShowCaseWidget.of(context).startShowCase([_four, _five]); + }); + }); + }, + child: MailTile( + mail: mail, + showCaseKey: _four, + showCaseDetail: showCaseDetail, + )), ), ); } @@ -489,8 +381,14 @@ class Mail { } class MailTile extends StatelessWidget { - const MailTile(this.mail, {Key? key}) : super(key: key); - + const MailTile( + {required this.mail, + this.showCaseDetail = false, + this.showCaseKey, + Key? key}) + : super(key: key); + final bool showCaseDetail; + final GlobalKey>? showCaseKey; final Mail mail; @override @@ -505,25 +403,47 @@ class MailTile extends StatelessWidget { child: Row( crossAxisAlignment: CrossAxisAlignment.start, children: [ - Container( - margin: const EdgeInsets.all(10), - width: 45, - height: 45, - decoration: const BoxDecoration( - shape: BoxShape.circle, - color: Color(0xffFCD8DC), - ), - child: Center( - child: Text( - mail.sender[0], - style: TextStyle( - color: Theme.of(context).primaryColor, - fontWeight: FontWeight.bold, - fontSize: 16, - ), + if (showCaseDetail) + Showcase.withWidget( + key: showCaseKey!, + height: 50, + width: 140, + shapeBorder: const CircleBorder(), + radius: const BorderRadius.all(Radius.circular(150)), + container: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Container( + width: 45, + height: 45, + decoration: const BoxDecoration( + shape: BoxShape.circle, + color: Color(0xffFCD8DC), + ), + child: Center( + child: Text( + 'S', + style: TextStyle( + color: Theme.of(context).primaryColor, + fontWeight: FontWeight.bold, + fontSize: 16, + ), + ), + ), + ), + const SizedBox( + height: 10, + ), + const Text( + "Your sender's profile ", + style: TextStyle(color: Colors.white), + ) + ], ), - ), - ), + child: const SAvatarExampleChild(), + ) + else + const SAvatarExampleChild(), const Padding(padding: EdgeInsets.only(left: 8)), Expanded( child: Column( diff --git a/lib/src/showcase.dart b/lib/src/showcase.dart index e8ef51bd..8b3a7117 100644 --- a/lib/src/showcase.dart +++ b/lib/src/showcase.dart @@ -155,6 +155,7 @@ class _ShowcaseState extends State { bool _isScrollRunning = false; Timer? timer; GetPosition? position; + ShowCaseWidgetState get showCaseWidgetState => ShowCaseWidget.of(context); @override @@ -178,7 +179,10 @@ class _ShowcaseState extends State { }); if (activeStep == widget.key) { - _scrollIntoView(); + if (ShowCaseWidget.of(context).enableAutoScroll) { + _scrollIntoView(); + } + if (showCaseWidgetState.autoPlay) { timer = Timer( Duration(seconds: showCaseWidgetState.autoPlayDelay.inSeconds), @@ -307,6 +311,7 @@ class _ShowcaseState extends State { offset: offset, size: size, onTap: _getOnTargetTap, + radius: widget.radius, onDoubleTap: widget.onTargetDoubleTap, onLongPress: widget.onTargetLongPress, shapeBorder: widget.shapeBorder, diff --git a/lib/src/showcase_widget.dart b/lib/src/showcase_widget.dart index faa0b1fc..700ce22c 100644 --- a/lib/src/showcase_widget.dart +++ b/lib/src/showcase_widget.dart @@ -40,6 +40,7 @@ class ShowCaseWidget extends StatefulWidget { /// /// Default value is 0. final double blurValue; + final bool enableAutoScroll; const ShowCaseWidget({ required this.builder, @@ -52,6 +53,7 @@ class ShowCaseWidget extends StatefulWidget { this.blurValue = 0, this.scrollDuration = const Duration(milliseconds: 300), this.disableAnimation = false, + this.enableAutoScroll = false, }); static GlobalKey? activeTargetWidget(BuildContext context) { @@ -80,6 +82,7 @@ class ShowCaseWidgetState extends State { late bool disableAnimation; late Duration autoPlayDelay; late bool autoPlayLockEnable; + late bool enableAutoScroll; /// Returns value of [ShowCaseWidget.blurValue] double get blurValue => widget.blurValue; @@ -91,6 +94,7 @@ class ShowCaseWidgetState extends State { autoPlay = widget.autoPlay; disableAnimation = widget.disableAnimation; autoPlayLockEnable = widget.autoPlayLockEnable; + enableAutoScroll = widget.enableAutoScroll; } void startShowCase(List widgetIds) { diff --git a/pubspec.yaml b/pubspec.yaml index a837812d..242f6176 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -1,6 +1,6 @@ name: showcaseview description: A Flutter package to Showcase/Highlight widgets step by step. -version: 1.1.6 +version: 1.1.7 homepage: https://github.com/simformsolutions/flutter_showcaseview issue_tracker: https://github.com/simformsolutions/flutter_showcaseview/issues