flutter_story_view

Description:

flutter story view

flutter_story_view #
WhatsApp story view package, for apps with stories like Whatsapp and Instagram.





This a Flutter widget to display stories like Whatsapp and Instagram. This can also be used
inside ListView or Column. This package provide gestures like to pause, forward and go to previous story
page.
Features #
🌄 Image, and video support (assets and url) both.
📍 Gesture for pause, forward and reverse page.
🌈 Animated progress indicator for each story item
🏵️ Caption for story.
Installation #
To use this plugin, add flutter_story_view as a dependency in your pubspec.yaml file.
Usage #
Import the package into your code
import "package:flutter_story_view/flutter_story_view.dart";
copied to clipboard
Look inside examples/example.dart on how to use this library. You can copy
and paste the code into your main.dart and run to have a quick look.
Basics #
Use FlutterStoryView to add stories in your Flutter App. FlutterStoryView class requires List<StoryItem> and each story item has some fields like url, duration, and type and so on.
So having these, you can handily customize each single story the way you want.


Keep in mind : The type must be specified with each StoryItem. You can access the type String from the class StoryItemType which comes built-in with this package.


StoryItem Image :


final itemImage = StoryItem(
url: "your image url/asset goes here",
type: StoryItemType.image,
viewers: [],
duration: 3 // for image if duration was null it will be 3 by default.
);
copied to clipboard

StoryItem Video :

final itemImage = StoryItem(
url: "your video url/asset goes here",
type: StoryItemType.video,
viewers: [],
duration: 10 // for video the duration would be 30 seconds if video duration gets longer than 30 seconds.
);
copied to clipboard
For more information : visit example project inside example/example.dart.
Additional information #
This package will be improved more along the time, if you found any issue create
the issue, also if you want to contribute feel free to do. I'll review your code and
merge it if found useful. Thanks
Contributors #
@berkaycatak
Created & Maintained By #
@MuhammadAdnan, Youtube : @eTechViral, LinkedIn : @MuhammadAdnan , Instagram : @MuhammadAdnan, LinkedIn : @eTechViral, Instagram : @eTechViral