diff --git a/README.md b/README.md index 9e5dbe91..23ad0f9a 100644 --- a/README.md +++ b/README.md @@ -11,7 +11,7 @@ A Flutter package allows you to Showcase/Highlight your widgets step by step. ![The example app running in Android](https://raw.githubusercontent.com/SimformSolutionsPvtLtd/flutter_showcaseview/master/preview/showcaseview.gif) -## Migration guide for release 4.0.0 +## Migration guide for release 4.0.0 (unreleased) Renamed parameters `titleAlignment` to `titleTextAlign` and `descriptionAlignment` to `descriptionTextAlign` to correspond it more with the TextAlign property.`titleAlignment` @@ -236,14 +236,6 @@ WidgetsBinding.instance.addPostFrameCallback((_) => | position | TooltipActionPosition? | TooltipActionPosition.inside | Position of tooltip actionbar (inside, outside) | | gapBetweenContentAndAction | double? | 10 | Gap between tooltip content and actionbar | -## Properties of `ActionButtonIcon` and `ActionButtonIcon.withImageIcon`: - -| Name | Type | Default Behaviour | Description | `ActionButtonIcon` | `ActionButtonIcon.withImageIcon` | -|---------|-------------|-------------------|------------------------------------|--------------------|----------------------------------| -| icon | Icon | | Provide a icon to the button | ✅ | | -| icon | ImageIcon | | Provide a image icon to the button | | ✅ | -| padding | EdgeInsets? | | Give padding to the icon | ✅ | ✅ | - ## How to use Check out the **example** app in the [example](example) directory or the 'Example' tab on pub.dartlang.org for a more complete example. diff --git a/example/lib/main.dart b/example/lib/main.dart index ae506f02..2e8fd988 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -266,6 +266,9 @@ class _MailPageState extends State { TooltipActionButton( backgroundColor: Colors.transparent, type: TooltipDefaultActionType.previous, + padding: EdgeInsets.symmetric( + vertical: 4, + ), textStyle: TextStyle( color: Colors.white, ), @@ -332,7 +335,7 @@ class _MailPageState extends State { key: _lastShowcaseWidget, title: 'Compose Mail', description: 'Click here to compose mail', - targetShapeBorder: const CircleBorder(), + targetBorderRadius: const BorderRadius.all(Radius.circular(16)), showArrow: false, tooltipActions: [ TooltipActionButton( @@ -535,41 +538,25 @@ class MailTile extends StatelessWidget { Showcase.withWidget( key: showCaseKey!, height: 50, - width: 140, + width: 150, tooltipActionConfig: const TooltipActionConfig( - alignment: MainAxisAlignment.center, + alignment: MainAxisAlignment.spaceBetween, crossAxisAlignment: CrossAxisAlignment.center, actionGap: 16, ), - tooltipActions: [ - const TooltipActionButton( - backgroundColor: Colors.transparent, + tooltipActions: const [ + TooltipActionButton( type: TooltipDefaultActionType.previous, - padding: EdgeInsets.zero, + name: 'Back', textStyle: TextStyle( color: Colors.white, ), ), - TooltipActionButton.custom( - button: InkWell( - onTap: () => ShowCaseWidget.of(context).next(), - child: Container( - decoration: BoxDecoration( - color: Colors.pink, - borderRadius: BorderRadius.circular(16), - border: Border.all( - color: Colors.white, - width: 2, - ), - ), - padding: const EdgeInsets.all(8), - child: const Text( - 'Next', - style: TextStyle( - color: Colors.white, - ), - ), - ), + TooltipActionButton( + type: TooltipDefaultActionType.skip, + name: 'Close', + textStyle: TextStyle( + color: Colors.white, ), ), ], @@ -585,7 +572,7 @@ class MailTile extends StatelessWidget { Radius.circular(15), ), ), - width: 140, + width: 150, child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ diff --git a/preview/showcaseview.gif b/preview/showcaseview.gif index a2381309..f1bcb0e4 100644 Binary files a/preview/showcaseview.gif and b/preview/showcaseview.gif differ