flutter_start/README.md

150 lines
4.6 KiB
Markdown
Raw Normal View History

2024-01-24 10:59:53 +01:00
# flutter_start
2024-01-24 14:37:59 +01:00
Flutter_start is a package that allows you to jumpstart your application with a splashScreen, introduction and a home.
2024-01-24 10:59:53 +01:00
2024-01-24 14:37:59 +01:00
## Setup
2024-01-24 10:59:53 +01:00
2024-01-24 14:37:59 +01:00
To use this package, add flutter_start as a dependency in your pubspec.yaml file:
2024-01-24 10:59:53 +01:00
2024-06-05 10:35:03 +02:00
```yaml
2024-01-24 14:37:59 +01:00
flutter_start:
git:
url: https://github.com/Iconica-Development/flutter_start
2024-06-05 10:35:03 +02:00
ref: 4.1.0
2024-01-24 14:37:59 +01:00
```
2024-01-24 10:59:53 +01:00
2024-06-05 10:35:03 +02:00
## go_router
Add `go_router` as dependency to your project.
2024-01-24 10:59:53 +01:00
2024-01-24 14:37:59 +01:00
Add the following configuration to your flutter_application:
```
2024-06-05 10:35:03 +02:00
List<GoRoute> getStartStoryRoutes() => getStartStoryRoutes();
2024-01-24 14:37:59 +01:00
```
2024-06-05 10:35:03 +02:00
Or with options:
2024-01-24 14:37:59 +01:00
2024-06-05 10:35:03 +02:00
Place the following code somewhere in your project where it can be accessed globally:
```
var startUserStoryConfiguration = const StartUserStoryConfiguration();
```
2024-01-24 14:37:59 +01:00
```
2024-06-05 10:35:03 +02:00
List<GoRoute> getStartStoryRoutes() => getStartStoryRoutes(
configuration: startUserStoryConfiguration,
2024-01-24 14:37:59 +01:00
);
```
2024-06-05 10:35:03 +02:00
Finally add the `getStartRoutes` to your `go_router` routes like so:
2024-01-24 14:37:59 +01:00
```
final GoRouter _router = GoRouter(
routes: <RouteBase>[
2024-06-05 10:35:03 +02:00
...getStartStoryRoutes()
2024-01-24 14:37:59 +01:00
],
);
```
The routes that can be used to navigate are:
2024-06-05 10:35:03 +02:00
For routing to the `splashScreen`:
2024-01-24 14:37:59 +01:00
```
2024-06-05 10:35:03 +02:00
static const String splashScreen = '/splashScreen';
2024-01-24 14:37:59 +01:00
```
2024-06-05 10:35:03 +02:00
For routing to the `introduction`:
2024-01-24 14:37:59 +01:00
```
2024-06-05 10:35:03 +02:00
static const String introduction = '/introduction';
2024-01-24 14:37:59 +01:00
```
2024-06-05 10:35:03 +02:00
For routing to the `home`:
2024-01-24 14:37:59 +01:00
```
2024-06-05 10:35:03 +02:00
static const String home = '/home';
2024-01-24 14:37:59 +01:00
```
If you don't want a SplashScreen in your application set your initialRoute to `Introduction`:
```
final GoRouter _router = GoRouter(
routes: <RouteBase>[
...getStartRoutes()
],
initialLocation: '/introduction',
);
```
2024-06-05 10:35:03 +02:00
## Navigator
2024-01-24 14:37:59 +01:00
2024-06-05 10:35:03 +02:00
Add the following code to the build-method of a chosen widget like so:
2024-01-24 14:37:59 +01:00
```
2024-06-05 10:35:03 +02:00
class Example extends StatelessWidget {
const Example({super.key});
@override
Widget build(BuildContext context) {
return NavigatorStartUserStory(
onComplete: (context) {},
);
}
}
2024-01-24 14:37:59 +01:00
```
2024-06-05 10:35:03 +02:00
or with options:
2024-01-24 14:37:59 +01:00
2024-06-05 10:35:03 +02:00
Place the following code somewhere in your project where it can be accessed globally:
```
var startUserStoryConfiguration = const StartUserStoryConfiguration();
2024-01-24 14:37:59 +01:00
```
2024-06-05 10:35:03 +02:00
2024-01-24 14:37:59 +01:00
```
2024-06-05 10:35:03 +02:00
class Example extends StatelessWidget {
const Example({super.key});
2024-01-24 14:37:59 +01:00
2024-06-05 10:35:03 +02:00
@override
Widget build(BuildContext context) {
return NavigatorStartUserStory(
configuration: startUserStoryConfiguration,
onComplete: (context) {},
);
}
}
```
2024-01-24 15:43:17 +01:00
The `StartUserStoryConfiguration` has its own parameters, as specified below:
| Parameter | Explanation |
|-----------|-------------|
2024-06-05 10:35:03 +02:00
| `splashScreenBuilder` | The builder to override the default splashScreen |
| `introductionBuilder` | A builder to wrap the introductions in your own page |
| `introductionOptionsBuilder` | The builder to override the default `introductionOptions` |
|`introductionService` | The service to override the default `introductionService` |
| `homeScreenRoute` | The route to navigate to after the introduction or splashScreen is completed |
| `introductionFallbackScreen` | The screen that is shown when something goes wrong fetching data for the introduction |
| `introductionScrollPhysics` | The scroll physics for the introduction |
| `showIntroduction` | A boolean to show the introduction or not. Defaults to true |
| `useKillswitch` | A boolean to use the killswitch or not. Defaults to false |
| `minimumSplashScreenDuration` | The minimum duration the splashScreen should be shown. Defaults to 3 seconds |
| `splashScreenFuture` | The future to be completed before the splashScreen is completed |
| `splashScreenCenterWidget` | The widget to be shown in the center of the splashScreen |
| `splashScreenBackgroundColor` | The color of the splashScreen background. Defaults to Color(0xff212121) |
| `canPopFromIntroduction` | Allow popping from introduction, defaults to true. Defaults to true |
| `killswitchService` | The service to override the default killswitch service |
| `showSplashScreen` | A boolean to show the splashScreen or not. Defaults to true |
## Issues
Please file any issues, bugs or feature request as an issue on our [GitHub](https://github.com/Iconica-Development/flutter_start) page. Commercial support is available if you need help with integration with your app or services. You can contact us at [support@iconica.nl](mailto:support@iconica.nl).
## Want to contribute
[text](about:blank#blocked)
If you would like to contribute to the plugin (e.g. by improving the documentation, solving a bug or adding a cool new feature), please carefully review our [contribution guide](./CONTRIBUTING.md) and send us your [pull request](https://github.com/Iconica-Development/flutter_start/pulls).
## Author
This flutter_start for Flutter is developed by [Iconica](https://iconica.nl). You can contact us at <support@iconica.nl>