Multiple User Story View in Flutter

Viewed 274

I am using flutter story view for showing stories in our app. The story view runs perfectly but for any single story on tap, if story is complete it will pop on complete function. Now I want to run multiple user stories like WhatsApp, Instagram one-by-one if running story duration is complete show next user story automatically. I can'nt understand how to run next user story automatically. I am new on Flutter.

List<StoryItem> storylist = [];
onTap: () {
                  
                      storylist.add(StoryItem.pageVideo(
                        item['video'],
                        controller: controller,
                      ));

                      setState(() {});

                      showDialog(
                        barrierDismissible: true,
                        context: context,
                        builder: (BuildContext context) {
                          //     storylist = storylist.toSet().toList();

                          return StoryView(
                            storyItems: storylist,
                            onComplete: () {
                              Navigator.pop(context);
                              setState(() {});
                             
                            },
                            repeat: false,
                            onVerticalSwipeComplete: (direction) {
                              if (direction == Direction.down) {
                                setState(() {});
                                Navigator.pop(context);
                                setState(() {});
                              }
                            },
                            controller: controller,
                          );
                        },
                      );
                    },
1 Answers

You can try AdvStory, this package fits your use case.

AdvStory(
  storyCount: 5,
  storyBuilder: (index) {
   return Story(
      // Story media count
      contentCount: 5,
      contentBuilder: (contentIndex) {
        // You can return ImageContent, VideoContent, SimpleCustomContent
        // or you can create your own contents, see docs.
        return ImageContent(url: '');
      },
    );
  },
  trayBuilder: (index) => AdvStoryTray(url: ''),
)
Related