partial_tutorial 0.0.2 partial_tutorial: ^0.0.2 copied to clipboard
A new Flutter package.
Partial Tutorial #
Add component-based tutorials for your complicated screens
🎮 Examples #
Demo #
📒 Documentation #
Installation #
Add partial_tutorial
to your pubspec.yaml
:
dependencies:
flutter:
sdk: flutter
# added below
partial_tutorial: <latest version>
Adding to your app #
The PartialTutorialProvider
has to be wrapped around the whole page including
Scaffold
.
return PartialTutorialProvider(
isTutorialActive: isTutorialActive,
controllers: MyHomePageTutorial.controllers,
child: Scaffold( appBar: ... body: ... ),
);
Then, wrap every widget that you want to show a partial tutorial with PartialTutorialItem
and give it a PartialTutorialtemController
which holds informations about the tutorial text and etc.
PartialTutorialItemController counterLabelController =
PartialTutorialItemController(
information: "This label shows the value of the counter.",
);
return PartialTutorialItem(
controller: counterLabelController ,
child: ElevatedButton(
onPressed: () {
//...
},
child: const Text("Reset Counter"),
),
);
Finally, give the list of PartialTutorialItemController
to the PartialTutorialProvider
with the same order that you want to show your tutorial widgets.
return PartialTutorialProvider(
isTutorialActive: isTutorialActive,
controllers: [
counterLabelController,
incrementButtonController,
],
child: Scaffold( appBar: ... body: ... ),
);
It is recommended to create a new file for every tutorial page which holds the controllers in it to increase the clearity of the code and seperate the tutorial codes from the original screen logic. You can find the implementation in the example project.
Author #
Serhat Merak