story_widget 0.0.2

story_widget: ^0.0.2 copied to clipboard

Story Widget #

Implement the story like Facebook, Instagram

🗾 Demo Image:

🍟 Demo Video:

https://drive.google.com/file/d/19SzAf48VJcH03xQI781K1OZvd7w8uo63/view?usp=sharing

Features #

Create a story widget for listing the list of images, and videos for users to view like Instagram and Facebook story

🖼️ Play image in the certain duration 🎥 Video 🎧 Combine the audio in the story with image type

Usage #

In this library, we use two models to implement the display of the item story in the view.

The first model is StoryListModel: this provides a list of stories that can be displayed in the view as personal stories.

In this model, we can set your custom data inside it as a personal use-case.

class StoryListModel<A, B> {
  final String id;
  final A? data;
  final List<StoryModel<B>> stories;

  StoryListModel({
    required this.id,
    required this.stories,
    this.data,
  });
}

The second model is StoryModel: this is the data of one story We will give the optional thumbnail URL for video type if you have one. storyType will be divided into two types: Image and video. So careful to check your asset

class StoryModel<A> {
  final A? data;
  final String imageUrl;
  String thumbnailUrl;
  final StoryImageType storyType;

  bool isThumbnailUrl = true;
  final isInitialize = ValueNotifier(false);
  final isInitThumbnail = ValueNotifier(false);
  late VideoPlayerController? videoPlayer = null;

  StoryModel(
      {this.data,
      this.imageUrl = '',
      this.thumbnailUrl = '',
      this.storyType = StoryImageType.Image});
}

By using it in your project. Just use StoryWidget widget.