Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: ✨Add staticContainer into ToolTipWidget for a custom tooltip th… #396

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open

feat: ✨Add staticContainer into ToolTipWidget for a custom tooltip th… #396

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
895c376
feat: ✨Add staticContainer into ToolTipWidget for a custom tooltip th…
MichaelCadavillo Sep 21, 2023
e4a0b04
🩹Updated: Updated name of parameter and also added support for the fl…
Sahil-Simform Oct 22, 2024
b55f5cf
feat: ✨Added Hide functionality for global floating action widget
Sahil-Simform Dec 3, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 6 additions & 2 deletions CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,15 @@
## [4.0.0] (unreleased)
- [BREAKING] Fixed [#457](https://github.com/SimformSolutionsPvtLtd/flutter_showcaseview/issues/457) titleAlignment property does not work
- Feature ✨: Added Action widget for tooltip
- Feature [#466](https://github.com/SimformSolutionsPvtLtd/flutter_showcaseview/pull/466): Added Action widget for tooltip
- Feature [#475](https://github.com/SimformSolutionsPvtLtd/flutter_showcaseview/issues/475) - Add
feasibility to change margin of tooltip with `toolTipMargin`.
- Feature [#478](https://github.com/SimformSolutionsPvtLtd/flutter_showcaseview/issues/478) - Added
feasibility to change auto scroll widget alignment `scrollAlignment`.
- Feature ✨: Added `enableAutoScroll` to `showcase`.
- Feature [#386](https://github.com/SimformSolutionsPvtLtd/flutter_showcaseview/pull/386): Added `enableAutoScroll` to `showcase`.
- Feature [#395](https://github.com/SimformSolutionsPvtLtd/flutter_showcaseview/issues/395) -
Added `floatingActionWidget` to give a static fixed widget at any place on the screen.
- Feature [#396](https://github.com/SimformSolutionsPvtLtd/flutter_showcaseview/pull/396): Added `globalFloatingActionWidget` and `hideFloatingActionWidgetForShowcase` for global
static fixed widget

## [3.0.0]
- [BREAKING] Fixed [#434](https://github.com/SimformSolutionsPvtLtd/flutter_showcaseview/issues/434) removed deprecated text style after Flutter 3.22 follow [migration guide](https://docs.flutter.dev/release/breaking-changes/3-19-deprecations#texttheme)
Expand Down
44 changes: 24 additions & 20 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -136,26 +136,29 @@ WidgetsBinding.instance.addPostFrameCallback((_) =>

## Properties of `ShowCaseWidget`:

| Name | Type | Default Behaviour | Description |
|---------------------------|----------------------------|------------------------------|--------------------------------------------------------------------------------|
| builder | Builder | | |
| blurValue | double | 0 | Provides blur effect on overlay |
| autoPlay | bool | false | Automatically display Next showcase |
| autoPlayDelay | Duration | Duration(milliseconds: 2000) | Visibility time of showcase when `autoplay` is enabled |
| enableAutoPlayLock | bool | false | Block the user interaction on overlay when autoPlay is enabled. |
| enableAutoScroll | bool | false | Allows to auto scroll to next showcase so as to make the given target visible. |
| scrollDuration | Duration | Duration(milliseconds: 300) | Time duration for auto scrolling |
| disableBarrierInteraction | bool | false | Disable barrier interaction |
| disableScaleAnimation | bool | false | Disable scale transition for all showcases |
| disableMovingAnimation | bool | false | Disable bouncing/moving transition for all showcases |
| onStart | Function(int?, GlobalKey)? | | Triggered on start of each showcase. |
| onComplete | Function(int?, GlobalKey)? | | Triggered on completion of each showcase. |
| onFinish | VoidCallback? | | Triggered when all the showcases are completed |
| enableShowcase | bool | true | Enable or disable showcase globally. |
| toolTipMargin | double | 14 | For tooltip margin |
| globalTooltipActionConfig | TooltipActionConfig? | | Global tooltip actionbar config |
| globalTooltipActions | List<TooltipActionButton>? | | Global list of tooltip actions |
| scrollAlignment | double | 0.5 | For Auto scroll widget alignment |
| Name | Type | Default Behaviour | Description |
|-------------------------------------|----------------------------------------------|------------------------------|--------------------------------------------------------------------------------|
| builder | Builder | | |
| blurValue | double | 0 | Provides blur effect on overlay. |
| autoPlay | bool | false | Automatically display Next showcase. |
| autoPlayDelay | Duration | Duration(milliseconds: 2000) | Visibility time of showcase when `autoplay` is enabled. |
| enableAutoPlayLock | bool | false | Block the user interaction on overlay when autoPlay is enabled. |
| enableAutoScroll | bool | false | Allows to auto scroll to next showcase so as to make the given target visible. |
| scrollDuration | Duration | Duration(milliseconds: 300) | Time duration for auto scrolling. |
| disableBarrierInteraction | bool | false | Disable barrier interaction. |
| disableScaleAnimation | bool | false | Disable scale transition for all showcases. |
| disableMovingAnimation | bool | false | Disable bouncing/moving transition for all showcases. |
| onStart | Function(int?, GlobalKey)? | | Triggered on start of each showcase. |
| onComplete | Function(int?, GlobalKey)? | | Triggered on completion of each showcase. |
| onFinish | VoidCallback? | | Triggered when all the showcases are completed. |
| enableShowcase | bool | true | Enable or disable showcase globally. |
| toolTipMargin | double | 14 | For tooltip margin. |
| globalTooltipActionConfig | TooltipActionConfig? | | Global tooltip actionbar config. |
| globalTooltipActions | List<TooltipActionButton>? | | Global list of tooltip actions . |
| scrollAlignment | double | 0.5 | For Auto scroll widget alignment. |
| globalFloatingActionWidget | FloatingActionWidget Function(BuildContext)? | | Global Config for tooltip action to auto apply for all the toolTip . |
| hideFloatingActionWidgetForShowcase | List<GlobalKey> | [] | Hides globalFloatingActionWidget for the provided showcase widget keys. |


## Properties of `Showcase` and `Showcase.withWidget`:

Expand Down Expand Up @@ -210,6 +213,7 @@ WidgetsBinding.instance.addPostFrameCallback((_) =>
| tooltipActions | List<TooltipActionButton>? | [] | Provide a list of tooltip actions | ✅ | ✅ |
| tooltipActionConfig | TooltipActionConfig? | | Give configurations (alignment, position, etc...) to the tooltip actionbar | ✅ | ✅ |
| enableAutoScroll | bool? | ShowCaseWidget.enableAutoScroll | This is used to override the `ShowCaseWidget.enableAutoScroll` behaviour | ✅ | ✅ |
| floatingActionWidget | FloatingActionWidget | | Provided a floating static action widget to show at any place on the screen | ✅ | ✅ |

## Properties of `TooltipActionButton` and `TooltipActionButton.custom`:

Expand Down
55 changes: 53 additions & 2 deletions example/lib/main.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,27 @@ class MyApp extends StatelessWidget {
debugShowCheckedModeBanner: false,
home: Scaffold(
body: ShowCaseWidget(
hideFloatingActionWidgetForShowcase: [_lastShowcaseWidget],
globalFloatingActionWidget: (showcaseContext) => FloatingActionWidget(
left: 16,
bottom: 16,
child: Padding(
padding: const EdgeInsets.all(16.0),
child: ElevatedButton(
onPressed: ShowCaseWidget.of(showcaseContext).dismiss,
style: ElevatedButton.styleFrom(
backgroundColor: const Color(0xffEE5366),
),
child: const Text(
'Skip',
style: TextStyle(
color: Colors.white,
fontSize: 15,
),
),
),
),
),
onStart: (index, key) {
log('onStart: $index, $key');
},
Expand Down Expand Up @@ -207,8 +228,18 @@ class _MailPageState extends State<MailPage> {
Showcase(
key: _firstShowcaseWidget,
description: 'Tap to see menu options',
onBarrierClick: () =>
debugPrint('Barrier clicked'),
onBarrierClick: () {
debugPrint('Barrier clicked');
debugPrint(
'Floating Action widget for first '
'showcase is now hidden',
);
ShowCaseWidget.of(context)
.hideFloatingActionWidgetForKeys([
_firstShowcaseWidget,
_lastShowcaseWidget
]);
},
tooltipActionConfig:
const TooltipActionConfig(
alignment: MainAxisAlignment.end,
Expand Down Expand Up @@ -256,6 +287,26 @@ class _MailPageState extends State<MailPage> {
"Tap to see profile which contains user's name, profile picture, mobile number and country",
tooltipBackgroundColor: Theme.of(context).primaryColor,
textColor: Colors.white,
floatingActionWidget: FloatingActionWidget(
left: 16,
bottom: 16,
child: Padding(
padding: const EdgeInsets.all(16.0),
child: ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: const Color(0xffEE5366),
),
onPressed: ShowCaseWidget.of(context).dismiss,
child: const Text(
'Close Showcase',
style: TextStyle(
color: Colors.white,
fontSize: 15,
),
),
),
),
),
targetShapeBorder: const CircleBorder(),
tooltipActionConfig: const TooltipActionConfig(
alignment: MainAxisAlignment.spaceBetween,
Expand Down
1 change: 1 addition & 0 deletions lib/showcaseview.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,3 +29,4 @@ export 'src/models/tooltip_action_config.dart';
export 'src/showcase.dart';
export 'src/showcase_widget.dart';
export 'src/tooltip_action_button_widget.dart';
export 'src/widget/floating_action_widget.dart';
13 changes: 13 additions & 0 deletions lib/src/showcase.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@ import 'shape_clipper.dart';
import 'showcase_widget.dart';
import 'tooltip_action_button_widget.dart';
import 'tooltip_widget.dart';
import 'widget/floating_action_widget.dart';

class Showcase extends StatefulWidget {
/// A key that is unique across the entire app.
Expand Down Expand Up @@ -96,6 +97,10 @@ class Showcase extends StatefulWidget {
/// Custom tooltip widget when [Showcase.withWidget] is used.
final Widget? container;

/// Custom static floating action widget to show a static widget anywhere
/// on the screen
final FloatingActionWidget? floatingActionWidget;

/// Defines background color for tooltip widget.
///
/// Default to [Colors.white]
Expand Down Expand Up @@ -415,6 +420,7 @@ class Showcase extends StatefulWidget {
this.tooltipActionConfig,
this.scrollAlignment = 0.5,
this.enableAutoScroll,
this.floatingActionWidget,
}) : height = null,
width = null,
container = null,
Expand Down Expand Up @@ -467,6 +473,7 @@ class Showcase extends StatefulWidget {
/// - `toolTipSlideEndDistance`: The distance the tooltip slides in from the edge of the screen (defaults to 7dp).
/// - `tooltipActions`: A list of custom actions (widgets) to display within the tooltip.
/// - `tooltipActionConfig`: Configuration options for custom tooltip actions.
/// - `floatingActionWidget`: Custom static floating action widget to show a static widget anywhere
///
/// **Differences from default constructor:**
///
Expand All @@ -484,6 +491,7 @@ class Showcase extends StatefulWidget {
required this.width,
required this.container,
required this.child,
this.floatingActionWidget,
this.targetShapeBorder = const RoundedRectangleBorder(
borderRadius: BorderRadius.all(
Radius.circular(8),
Expand Down Expand Up @@ -554,6 +562,7 @@ class _ShowcaseState extends State<Showcase> {
RenderBox? rootRenderObject;

late final showCaseWidgetState = ShowCaseWidget.of(context);
FloatingActionWidget? _globalFloatingActionWidget;

@override
void initState() {
Expand All @@ -569,6 +578,8 @@ class _ShowcaseState extends State<Showcase> {
recalculateRootWidgetSize();

if (_enableShowcase) {
_globalFloatingActionWidget =
showCaseWidgetState.globalFloatingActionWidget?.call(context);
final size = MediaQuery.of(context).size;
position ??= GetPosition(
rootRenderObject: rootRenderObject,
Expand Down Expand Up @@ -786,6 +797,8 @@ class _ShowcaseState extends State<Showcase> {
titleTextStyle: widget.titleTextStyle,
descTextStyle: widget.descTextStyle,
container: widget.container,
floatingActionWidget:
widget.floatingActionWidget ?? _globalFloatingActionWidget,
tooltipBackgroundColor: widget.tooltipBackgroundColor,
textColor: widget.textColor,
showArrow: widget.showArrow,
Expand Down
Loading
Loading