fix: feedback on userstory

This commit is contained in:
mike doornenbal 2024-06-05 10:35:03 +02:00
parent e7419bc8c1
commit 84e629d5b2
8 changed files with 85 additions and 117 deletions

View file

@ -1,3 +1,8 @@
## 4.1.0
- Updated README
- Removed check if the introductions should be shown.
- Updated flutter_introduction to 3.1.0
## 4.0.0 ## 4.0.0
- Added default introduction page. - Added default introduction page.
- Added default splash screen. - Added default splash screen.

103
README.md
View file

@ -6,57 +6,62 @@ Flutter_start is a package that allows you to jumpstart your application with a
To use this package, add flutter_start as a dependency in your pubspec.yaml file: To use this package, add flutter_start as a dependency in your pubspec.yaml file:
``` ```yaml
flutter_start: flutter_start:
git: git:
url: https://github.com/Iconica-Development/flutter_start url: https://github.com/Iconica-Development/flutter_start
ref: <Version> ref: 4.1.0
``` ```
To use the module within your Flutter-application with predefined `Go_router` routes you should add the following: ## go_router
Add `go_router` as dependency to your project.
Add go_router as dependency to your project.
Add the following configuration to your flutter_application: Add the following configuration to your flutter_application:
``` ```
StartUserStoryConfiguration startUserStoryConfiguration = const StartUserStoryConfiguration(); List<GoRoute> getStartStoryRoutes() => getStartStoryRoutes();
``` ```
and set the values as you wish. Or with options:
Next add the `StartUserStoryConfiguration` to `getStartStoryRoutes` Like so: Place the following code somewhere in your project where it can be accessed globally:
``` ```
List<GoRoute> getStartRoutes() => getStartStoryRoutes( var startUserStoryConfiguration = const StartUserStoryConfiguration();
startUserStoryConfiguration, ```
```
List<GoRoute> getStartStoryRoutes() => getStartStoryRoutes(
configuration: startUserStoryConfiguration,
); );
``` ```
Finally add the `getStartRoutes` to your `Go_router` routes like so: Finally add the `getStartRoutes` to your `go_router` routes like so:
``` ```
final GoRouter _router = GoRouter( final GoRouter _router = GoRouter(
routes: <RouteBase>[ routes: <RouteBase>[
...getStartRoutes() ...getStartStoryRoutes()
], ],
); );
``` ```
The routes that can be used to navigate are: The routes that can be used to navigate are:
For routing to the `SplashScreen`: For routing to the `splashScreen`:
``` ```
static const String splashScreen = '/splashScreen'; static const String splashScreen = '/splashScreen';
``` ```
For routing to the `Introduction`: For routing to the `introduction`:
``` ```
static const String introduction = '/introduction'; static const String introduction = '/introduction';
``` ```
For routing to the `HomeEntry`: For routing to the `home`:
``` ```
static const String home = '/home'; static const String home = '/home';
@ -73,42 +78,64 @@ final GoRouter _router = GoRouter(
); );
``` ```
To use the module within your Flutter-application without predefined `Go_router` routes but with `Navigator` routes add the following : ## Navigator
Add the following configuration to your flutter_application:
Add the following code to the build-method of a chosen widget like so:
``` ```
StartUserStoryConfiguration startUserStoryConfiguration = const StartUserStoryConfiguration(); class Example extends StatelessWidget {
const Example({super.key});
@override
Widget build(BuildContext context) {
return NavigatorStartUserStory(
onComplete: (context) {},
);
}
}
``` ```
Add the following code to the build-method of a chosen widget: or with options:
Place the following code somewhere in your project where it can be accessed globally:
``` ```
startNavigatorUserStory(startUserStoryConfiguration, context); var startUserStoryConfiguration = const StartUserStoryConfiguration();
``` ```
If the splashScreenBuilder is not used the SplashScreen will be skipped. ```
class Example extends StatelessWidget {
const Example({super.key});
@override
Widget build(BuildContext context) {
return NavigatorStartUserStory(
configuration: startUserStoryConfiguration,
onComplete: (context) {},
);
}
}
```
The `StartUserStoryConfiguration` has its own parameters, as specified below: The `StartUserStoryConfiguration` has its own parameters, as specified below:
| Parameter | Explanation | | Parameter | Explanation |
|-----------|-------------| |-----------|-------------|
| splashScreenBuilder | The builder for the splashScreen. | | `splashScreenBuilder` | The builder to override the default splashScreen |
| introductionBuilder | The builder for the introduction. | | `introductionBuilder` | A builder to wrap the introductions in your own page |
| introductionOptionsBuilder | The options for the introduction. | | `introductionOptionsBuilder` | The builder to override the default `introductionOptions` |
| introductionService | The service for the introduction. Default IntroductionService (SharedPreferencesIntroductionDataProvider()) | |`introductionService` | The service to override the default `introductionService` |
| homeEntry | The widget that will be shown after the introduction. | | `homeScreenRoute` | The route to navigate to after the introduction or splashScreen is completed |
| homeScreenRoute | The route that will be shown after the introduction when using gorouter | | `introductionFallbackScreen` | The screen that is shown when something goes wrong fetching data for the introduction |
| introductionFallbackScreen | The widget that will be shown when the introduction is skipped. | | `introductionScrollPhysics` | The scroll physics for the introduction |
| introductionScrollPhysics | The scrollPhysics for the introduction. | | `showIntroduction` | A boolean to show the introduction or not. Defaults to true |
| showIntroduction | Whether or not the introduction should be shown. | | `useKillswitch` | A boolean to use the killswitch or not. Defaults to false |
| useKillswitch | Whether or not the killswitch should be used. This will only work when you use the splashScreen and you need to have a active internet connection| | `minimumSplashScreenDuration` | The minimum duration the splashScreen should be shown. Defaults to 3 seconds |
| minimumSplashScreenDuration | The minimum duration the splashScreen should be shown. | | `splashScreenFuture` | The future to be completed before the splashScreen is completed |
| splashScreenFuture | The future that will be awaited before the splashScreen is closed. | | `splashScreenCenterWidget` | The widget to be shown in the center of the splashScreen |
| splashScreenCenterWidget | The widget that will be shown in the center of the splashScreen. | | `splashScreenBackgroundColor` | The color of the splashScreen background. Defaults to Color(0xff212121) |
| splashScreenBackgroundColor | The background color of the splashScreen. | | `canPopFromIntroduction` | Allow popping from introduction, defaults to true. Defaults to true |
| canPopFromIntroduction | Whether or not the introduction can be popped. | | `killswitchService` | The service to override the default killswitch service |
| killswitchService | The service for the killswitch. Instead of the default service | | `showSplashScreen` | A boolean to show the splashScreen or not. Defaults to true |
| showSplashScreen | Whether or not the splashScreen should be shown. |
## Issues ## Issues

View file

@ -39,38 +39,6 @@ StartUserStoryConfiguration config = StartUserStoryConfiguration(
splashScreenBuilder: (context, onFinish) => SplashScreen( splashScreenBuilder: (context, onFinish) => SplashScreen(
onFinish: onFinish, onFinish: onFinish,
), ),
introductionOptionsBuilder: (ctx) => IntroductionOptions(
pages: [
const IntroductionPage(
title: Text('First page'),
text: Text('Wow a page'),
graphic: FlutterLogo(),
),
const IntroductionPage(
title: Text('Second page'),
text: Text('Another page'),
graphic: FlutterLogo(),
),
const IntroductionPage(
title: Text('Third page'),
text: Text('The final page of this app'),
graphic: FlutterLogo(),
),
],
introductionTranslations: const IntroductionTranslations(
skipButton: 'Skip it!',
nextButton: 'Next',
previousButton: 'Previous',
finishButton: 'To the app!',
),
tapEnabled: true,
displayMode: IntroductionDisplayMode.multiPageHorizontal,
buttonMode: IntroductionScreenButtonMode.text,
indicatorMode: IndicatorMode.dash,
skippable: true,
buttonBuilder: (context, onPressed, child, type) =>
ElevatedButton(onPressed: onPressed, child: child),
),
); );
class SplashScreen extends StatefulWidget { class SplashScreen extends StatefulWidget {
@ -114,17 +82,3 @@ class HomeEntry extends StatelessWidget {
body: const Center(child: Text('HomeEntry')), body: const Center(child: Text('HomeEntry')),
); );
} }
class ExampleIntroductionDataProvider
implements SharedPreferencesIntroductionDataProvider {
@override
String key = 'example';
@override
Future<void> setCompleted({bool value = true}) async =>
// ignore: void_checks
false;
@override
Future<bool> shouldShow() async => true;
}

View file

@ -14,7 +14,7 @@ dependencies:
flutter_introduction_shared_preferences: flutter_introduction_shared_preferences:
git: git:
url: https://github.com/Iconica-Development/flutter_introduction url: https://github.com/Iconica-Development/flutter_introduction
ref: 3.0.0 ref: 3.1.0
path: packages/flutter_introduction_shared_preferences path: packages/flutter_introduction_shared_preferences
dev_dependencies: dev_dependencies:

View file

@ -24,7 +24,6 @@ List<GoRoute> getStartStoryRoutes({
pageBuilder: (context, state) { pageBuilder: (context, state) {
var go = context.go; var go = context.go;
var isAllowedToPassThrough = false; var isAllowedToPassThrough = false;
var introductionSeen = false;
String? routeAfterSplash; String? routeAfterSplash;
Future<void> splashLoadingMethod() async { Future<void> splashLoadingMethod() async {
await Future.wait<void>( await Future.wait<void>(
@ -40,11 +39,6 @@ List<GoRoute> getStartStoryRoutes({
await killswitchService.isKillswitchActive(); await killswitchService.isKillswitchActive();
} }
var introService = configuration.introductionService ??
IntroductionService(
SharedPreferencesIntroductionDataProvider(),
);
introductionSeen = !await introService.shouldShow();
if (context.mounted) if (context.mounted)
routeAfterSplash = await configuration.splashScreenFuture routeAfterSplash = await configuration.splashScreenFuture
?.call(context) ?? ?.call(context) ??
@ -62,7 +56,7 @@ List<GoRoute> getStartStoryRoutes({
if (configuration.useKillswitch && isAllowedToPassThrough) return; if (configuration.useKillswitch && isAllowedToPassThrough) return;
if (!configuration.showIntroduction || introductionSeen) { if ((!configuration.showIntroduction) && context.mounted) {
return go( return go(
routeAfterSplash ?? StartUserStoryRoutes.home, routeAfterSplash ?? StartUserStoryRoutes.home,
); );
@ -85,7 +79,7 @@ List<GoRoute> getStartStoryRoutes({
body: Center( body: Center(
child: child:
configuration.splashScreenCenterWidget?.call(context) ?? configuration.splashScreenCenterWidget?.call(context) ??
defaultSplashScreen, defaultSplashScreen(context),
), ),
), ),
); );

View file

@ -71,7 +71,6 @@ Widget _splashScreen(
var navigator = Navigator.of(context); var navigator = Navigator.of(context);
var isAllowedToPassThrough = false; var isAllowedToPassThrough = false;
var introductionSeen = false;
Future<void> splashHandler() async { Future<void> splashHandler() async {
await Future.wait<void>( await Future.wait<void>(
@ -87,12 +86,6 @@ Widget _splashScreen(
isAllowedToPassThrough = isAllowedToPassThrough =
await killswitchService.isKillswitchActive(); await killswitchService.isKillswitchActive();
} }
var introService = configuration.introductionService ??
IntroductionService(
SharedPreferencesIntroductionDataProvider(),
);
introductionSeen = !await introService.shouldShow();
}, },
), ),
Future.delayed( Future.delayed(
@ -105,8 +98,7 @@ Widget _splashScreen(
if (configuration.useKillswitch && isAllowedToPassThrough) return; if (configuration.useKillswitch && isAllowedToPassThrough) return;
if ((!configuration.showIntroduction || introductionSeen) && if ((!configuration.showIntroduction) && context.mounted) {
context.mounted) {
onComplete(context); onComplete(context);
return; return;
} }
@ -132,7 +124,7 @@ Widget _splashScreen(
backgroundColor: configuration.splashScreenBackgroundColor, backgroundColor: configuration.splashScreenBackgroundColor,
body: Center( body: Center(
child: configuration.splashScreenCenterWidget?.call(context) ?? child: configuration.splashScreenCenterWidget?.call(context) ??
defaultSplashScreen, defaultSplashScreen(context),
), ),
); );
} }

View file

@ -1,10 +1,6 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
const defaultSplashScreen = Text( Text defaultSplashScreen(BuildContext context) => Text(
'Splash Screen', 'iconinstagram',
style: TextStyle( style: Theme.of(context).textTheme.titleLarge,
color: Color(0xff71C6D1),
fontWeight: FontWeight.w800,
fontSize: 32,
),
); );

View file

@ -1,7 +1,7 @@
name: flutter_start name: flutter_start
description: "Flutter_start is a package that allows you to jumpstart your application with a splashScreen, introduction and a home." description: "Flutter_start is a package that allows you to jumpstart your application with a splashScreen, introduction and a home."
publish_to: "none" publish_to: "none"
version: 4.0.0 version: 4.1.0
environment: environment:
sdk: ">=3.2.5 <4.0.0" sdk: ">=3.2.5 <4.0.0"
@ -16,12 +16,12 @@ dependencies:
flutter_introduction: flutter_introduction:
git: git:
url: https://github.com/Iconica-Development/flutter_introduction url: https://github.com/Iconica-Development/flutter_introduction
ref: 3.0.0 ref: 3.1.0
path: packages/flutter_introduction path: packages/flutter_introduction
flutter_introduction_shared_preferences: flutter_introduction_shared_preferences:
git: git:
url: https://github.com/Iconica-Development/flutter_introduction url: https://github.com/Iconica-Development/flutter_introduction
ref: 3.0.0 ref: 3.1.0
path: packages/flutter_introduction_shared_preferences path: packages/flutter_introduction_shared_preferences
dev_dependencies: dev_dependencies: