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,
);
},
);
},
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
I am using the favorite_button Widget to add items to the list of favorites.
For that matter, I have a listview and for each row, I added the option to add it as a favorite. I also have a condition in the backend that if the number of favorites is more than 10, the responsecode equals to 2 and then shows a dialogbox in the flutter and does not add it to the favorite.
Everything works perfectly. The only problem that I have is that in conditions with more than 10 favorites, when I click, it marks as favorite and then shows the dialog box but I could not find a way to undo this action. However, it does not add it to the list (when I refresh the page, it shows as unmarked). How could I unmark it from marked as favorite, for example, when user closes the showDialog?
Any other approach is also appreciated like simulating the onpressed action to undo the action of favoriting.
Thank you in advance.
StarButton(
isStarred: UserFavorite
.Users!
valueChanged: (_isStarred) {
if (_isStarred == true)
setState(() async {
var resp =
await add(
widget.oauth,
widget.Id,);
if (resp.responseCode ==
2) {
await showDialog(
context: context,
builder:
(alertDialogContext) {
return AlertDialog(
title: Text(
'Limit Reached'),
content: Text(
'You are allowed to add up to 10 sensors as your favorite.'),
actions: [
TextButton(
child: Text(
'Ok'),
onPressed:
() {
Navigator.pop(
alertDialogContext);
},
),
],
);
},
);
}
});
else
setState(() {
delete(
widget.oauth,
widget.Id,
);
});
},
)
I have an 'Add' link in my dropdown, which navigates to a form to do an add, and then sets the state afterwards, adding the new item to the dropdown. At least that's the way it was working; I tried to refactor to reuse this dropdown (it has some logic attached to it), and it no longer works...
Before, working:
The dropdown was added in a single stateful widget, and this code set the state:
TextButton(
child: Text(linkText),
onPressed: () {
Navigator.pop(aidingDropdownKey.currentContext!);
Navigator.push(context,
MaterialPageRoute(builder: (context) => linkDest))
.then((_) => setState(() {}));
},
)
Now, the dropdown is in its own StatefulWidget, and the DropdownMenuItem with the 'Add' link is in its own class. The code that tries to set the state looks like this:
TextButton(
child: Text(text),
onPressed: () {
if (poppee != null) {
Navigator.pop(poppee);
}
Navigator.push(context,
MaterialPageRoute(builder: (context) => dest))
.then((_) {
var afterClosed = afterLinkClosed;
if (afterClosed != null) {
afterClosed();
}
});
},
)
and
DropdownLabel(
"NTRIP Services",
linkText: "Add",
linkDest: const NtripForm(),
linkPoppee: widget.aidingKey?.currentContext,
afterLinkClosed: () {
_logger.d("after link callback called");
setState(() {});
},
)
Through logging, I can see my dropdown's build method is getting called, and the new menu item is created, but the UI isn't updating; the new item isn't showing.
Why wouldn't the UI update in this case?
https://imgur.com/a/MZrqkJy
In the above video I am redeeeming the offer and then I am getting a confirmation dialog box that its successful. After 2 seconds the confirmation DB pops and then screen is refreshed. But I want the initial DB to pop as well after Confir. DB disappears. I am not able to do this. This is the code snippet:
showDialog(
context: context,
builder: (BuildContext context) {
_timer = Timer(Duration(seconds: 2), () {
Navigator.of(context).pop();
});
return AlertDialog(
content: Text(redemeResponseBody),
);
}).then((value) {
if (_timer.isActive) {
_timer.cancel();
}
Future.delayed(Duration(seconds: 2), () {
setState(() {
didRedeem = true;
});
Navigator.of(context).pop();
Get.to(() => OffersScreenPage(getIndex: 1));
});
});
Any idea? what's wrong
I'd suggest reading the Navigator API documentation.. The popUntil() method seems to be what you're after.
I have a list view of items. For each item in the list, there is an edit option, when on click that im navigating from ListScreen to the EditScreen. Edit Screen has a static update button but the editing view is changed according to the item selected to be edited From the ListScreen.
Now when I update the items in Edit screen, and press update button I can navigate to ListScreen back but I need the list view to rebuild on that. The function to build the list is given inside of a FutureBuilder in ListScreen it self. In the initial navigate to the ListScreen im calling that method in initState().
Is there a way that I can manage this?
ListScreen
//provider
late AddItemProvider? _updateItemProvider;
#override
void initState() {
_dataFuture = _getAddedData().whenComplete(() => refresh());
super.initState();
}
void _gotoEditAccess(BuildContext ctx, String title) async {
var nav =
Navigator.pushNamed(ctx, suggestionUpdateUIRoute, arguments: title);
// of(context)
if (nav != null && nav == true) {
await _dataFuture; //_getAddedData().whenComplete(() => refresh());
}
}
//in the body I have this list view
//added item is the list view item which holds Function parameters for onEdit and onDelete
//used as onTap: () => widget.onEdit!(),
ListView.builder(
shrinkWrap: true,
itemCount: _listOfItems.length,
itemBuilder: (context, index) {
return AddedItem(
icon: _listOfItems[index].icon,
title: _listOfItems[index].title,
content: _listOfItems[index].content,
onEdit: () async {
_gotoEditAccess(
context, _listOfItems[index].title!);
},
onDelete: () {
_deleteItem(_listOfItems[index].title!);
},
);
},
),
edit screen have a base view with common update button and the body is being replaced with a actual editing view matching what needs to be edited.
EditScreen
#override
Widget build(BuildContext context) {
_updateItemProvider = Provider.of<AddItemProvider>(context, listen: false);
...
//rest of the body for matched editing screen...
//inside the base view of edit screen
_goBack() {
Navigator.pop(context, true);}
#override
Widget build(BuildContext context) {
_updateItemProvider = Provider.of<AddItemProvider>(context, listen: false);
_submitBtn() => Consumer<AddItemProvider>(
builder: (_, AddItemProvider updateItemProvider, __) {
_updateItemProvider = updateItemProvider;
return ButtonWidget(
btnColor: CustomColors.green600,
borderColor: CustomColors.green600,
textColor: CustomColors.mWhite,
text: "Update",
eButtonType: eButtonType.bText,
eButtonState: _submitBtnState,
onPressed: () async {
await saveSelectedList(updateItemProvider.updateItems!);
_updateItemProvider!.removeAll();
_goBack();
},
);
},
);
You need to write this code were you want to navigate
onTap:() async{
var test = await Navigator.of(context).push(
MaterialPageRoute(builder: (context) =>EditProfile()));
if(test != null || test == true){
// perform your function
}
}
You need to pass any content when navigate back from edit screen
Navigator.pop(context, true);
I am pretty new to flutter and am practicing using drop down button. So I made a basic app which allows you to create new string values and store then on the cloud and then populate the dropdownbutton with the values. I want to add a functionality that we can edit the member of the dropdropmenu item by long pressing it.
This is my drop down menu button
StreamBuilder<QuerySnapshot>(
stream: _fireStore.collection("items").orderBy("value").snapshots(),
builder: (context, snapshots) {
if (!snapshots.hasData) {
CircularProgressIndicator();
}
return DropdownButton(
items: itemList,
value: dropDownValue,
onChanged: (newValue) {
setState(() {
dropDownValue = newValue;
});
},
);
},
),
This is the drop down menu item
List<DropdownMenuItem> itemList = [];
String dropDownValue;
void getList() async {
await for (var snapshot in _fireStore.collection("items").snapshots()) {
itemList.clear();
for (var message in snapshot.documents) {
itemList.add(DropdownMenuItem(
value: message.data["value"].toString(),
child: Text(
message.data["value"],
),
));
}
}
}
I couldn't find any other solution regarding this.
Wrap your items each in a GestureDetector and pass a function to the LongPress() callback to update the cloud data.