flutter_instagram_stories 0.0.1+1 flutter_instagram_stories: ^0.0.1+1 copied to clipboard
Display stories just like Whatsapp & Instagram. Built-in groups (multiple stories with one icon), cache, video, gifs. For now works with Firestore database only.
A Flutter plugin for displaying stories just like Whatsapp & Instagram. Built-in groups (multiple stories with one icon), cache, video, gifs.
Plugin can be used in any app for displaying news, educational content and etc.
Note: This plugin is under ative development, and there are some known bugs and a lot of features to implement. Please, add issues or feature requests here: issue
- For now plugin works with Firebase only.
- This is first beta version, please add all issues and feature requests here: issue
- Only one line of code to implement this plugin to app
- Display images, gifs, videos
- Adjustable titles on icons
- Preliminary caching after app started
dependencies: flutter_instagram_stories: ^0.0.1+1
Now in your Dart code, you can use:
For playing video plugin uses official video_player https://pub.dev/packages/video_player
Warning: The video_player plugin doesn’t work on iOS simulators. You must test videos on real iOS devices.
For iOS, add the following to the Info.plist file found at
You can find complete working example here https://github.com/awaik/flutter_instagram_stories/tree/master/example
Connect to collection where you keep stories
static String collectionDbName = 'instagram_stories_db'; CollectionReference dbInstance = Firestore.instance.collection(collectionDbName);
And add stories full functionality to your app.
body: SafeArea( child: FlutterInstagramStories( collectionDbName: collectionDbName, showTitleOnIcon: true, fontSizeIcon: 16.0, //TODO: showTitleInStory: true, //TODO: fontSizeStory: 18.0, iconWidth: 150.0, iconHeight: 150.0, //how long story lasts in seconds imageStoryDuration: 7, progressPosition: ProgressPosition.top, repeat: true, inline: false, ), ),
Plugin works with Firestore database and package https://pub.dev/packages/cloud_firestore already included into plugin.
You can use example with open database or create your own database.
Steps to create:
- Add Firebase to your app
- Android https://firebase.google.com/docs/flutter/setup?platform=android
- iOS https://firebase.google.com/docs/flutter/setup?platform=ios
- Create Firestore database
- Create collection with any name. After you will use this name in dart code only once.
- Create documents inside collection with exact structure, like on image below
DateTime date; List file[ String filetype; String url; ] String title; String previewImage;
That's it! Now your app has instagram stories with caching and other powerful features.