how to dispose setState properly to avoid memory leak? - flutter

It shows me this error.
E/flutter (22343): This error happens if you call setState() on a State object for a widget that no longer appears in the widget tree (e.g., whose parent widget no longer includes the widget in its build). This error can occur when code calls setState() from a timer or an animation callback.
E/flutter (22343): The preferred solution is to cancel the timer or stop listening to the animation in the dispose() callback. Another solution is to check the "mounted" property of this object before calling setState() to ensure the object is still in the tree.
E/flutter (22343): This error might indicate a memory leak if setState() is being called because another object is retaining a reference to this State object after it has been removed from the tree. To avoid memory leaks, consider breaking the reference to this object during dispose().
#override
void initState() {
super.initState();
if(mounted){
getProfilePosts();
getFollowers();
getFollowing();
checkIfFollowing();
}
}
checkIfFollowing() async {
if(mounted){
setState(() {
_isLoading = true;
});
DocumentSnapshot doc = await followersRef
.document(widget.profileId)
.collection('userFollowers')
.document(currentUserId)
.get();
setState(() {
_isFollowing = doc.exists;
});
setState(() {
_isLoading = false;
});
}
}
getFollowers() async {
if(mounted){
setState(() {
_isLoading = true;
});
QuerySnapshot snapshot = await followersRef
.document(widget.profileId)
.collection('userFollowers')
.getDocuments();
setState(() {
followerCount = snapshot.documents.length;
});
setState(() {
_isLoading = false;
});
}
}
getFollowing() async {
if(mounted){
setState(() {
_isLoading = true;
});
QuerySnapshot snapshot = await followingRef
.document(widget.profileId)
.collection('userFollowing')
.getDocuments();
setState(() {
followingCount = snapshot.documents.length;
});
setState(() {
_isLoading = false;
});
}
}
getProfilePosts() async {
if(mounted){
setState(() {
_isLoading = true;
});
QuerySnapshot snapshot = await postsRef
.document(widget.profileId)
.collection('userPosts')
.orderBy('timestamp', descending: true)
.getDocuments();
setState(() {
postCount = snapshot.documents.length;
posts = snapshot.documents.map((doc) => Post.fromDocument(doc)).toList();
_isLoading = false;
});
}
}

Try to do this in all the setState calls, it seems you check that only once, but the following calls to setState are unprotected
if (mounted == true) {
setState(() {})
}

You can override setState to use it only if the State object is mounted on the widget tree.
#override
void setState(fn) {
if (mounted) super.setState(fn);
}

Use
if (!mounted) return;
setState(){
/* ... */
}
OR
if (mounted) {
setState(() {
/* ... */
});
}
Reference: https://stackoverflow.com/a/74744364/13431819

Related

flutter video player not showing video

In my app I have a video running in the background.
I have a parameter page with a filepicker button which saves the path of the selected video in sharedpreferences
Future<File> _pickVideo() async {
final result = await FilePicker.platform.pickFiles(type: FileType.video);
File file = File(result!.files.single.path ?? '');
if (file != null) {
setState(() {
pickedVideo = file;
print('video $pickedVideo');
});
}
return file;}
In the video player page i retrieve the sharedpreferences path and I can display it in a Text widget
Text(selectedVideoValue ?? '',)
when I want to use it in the video player it doesn't work.
am i doing something wrong?
String? selectedVideoValue;
if (selectedVideoValue != null) {
controller = VideoPlayerController.file(File('{$selectedVideoValue}'))
..addListener(() => setState(() {}))
..initialize().then((_) {
controller.setVolume(0.0);
controller.play();
controller.setLooping(true);
setState(() {});
});
} else {
controller =
VideoPlayerController.asset("assets/movies/STYLEARCHIGRAPHIQUE.mp4")
..addListener(() => setState(() {}))
..initialize().then((_) {
controller.setVolume(0.0);
controller.play();
controller.setLooping(true);
setState(() {});
});
}
Thanks for your help
Below Code set into initState() may be working
controller = VideoPlayerController.file(File('{$selectedVideoValue}'))
..addListener(() => setState(() {}))
..initialize().then((_) {
controller.setVolume(0.0);
controller.play();
controller.setLooping(true);
setState(() {});
});
} else {
controller =
VideoPlayerController.asset("assets/movies/STYLEARCHIGRAPHIQUE.mp4")
..addListener(() => setState(() {}))
..initialize().then((_) {
controller.setVolume(0.0);
controller.play();
controller.setLooping(true);
setState(() {});
});
}```

Asynchronous method not running in proper order

I have these methods, for some reason fetchItems is being called first before initPosition, how come dart wont wait for it to finish and proceeds to the second method? I've added async/await but it still doesn't work. I've also checked my backend logs to confirm this. Am I doing something wrong?
Future<void> initPosition() async {
if (_latitude != null && _longitude != null) {
await Socket.updatePosition(
lat: 51,
lon: 17,);
}
}
Future<void> initMarkers() async {
await initPosition();
await Provider.of<Items>(context, listen: false)
.fetchItems();
}
void initMapState() async {
await getCurrentLocation().then((_) async {
await initMarkers();
setState(() {
_loaded = true;
});
});
}
#override
void initState() {
super.initState();
_location.enableBackgroundMode(enable: false);
WidgetsBinding.instance?.addPostFrameCallback((_) {
initMapState();
});
}
Future<void> fetchItems() async {
itemList = await repository.getItemList();
notifyListeners();
}
Working with multiple asynchronous functions inside Futures depends on whether one is finished or not, not every single one. For this, you can call the "whenComplete" method so you can assure that your future function have finished running. Like this:
For your initMarkers() function:
Future<void> initMarkers() async {
await initPosition().whenComplete((){
Provider.of<Items>(context, listen: false)
.fetchItems();
});
}
For your initMapState() function:
void initMapState() async {
await getCurrentLocation().whenComplete(() async {
await initMarkers().whenComplete((){
setState(() {
_loaded = true;
});
});
});
}
Keep in mind that, in your code, you are not working with the returning value of your getCurrentLocation() function, so instead of using the "then" method use the "whenComplete" method, assuring that you changed or returned your values with this function. Finally, for the initState(), make the function body with asynchronous:
#override
void initState() {
super.initState();
_location.enableBackgroundMode(enable: false);
WidgetsBinding.instance?.addPostFrameCallback((_) async {
initMapState();
});
}
This should work.

Display Loading spinner waitint for request to complete while using provider package

I am using a provider package. I want to display a loading spinner while waiting for a request to complete. The pattern below is too verbose. Please help me make it less verbose. Here is my code
class APIService with ChangeNotifier {
// Check for working API backend
bool isWorking = false;
bool isLoading = false;
set _isLoading(bool value) {
isLoading = value; <--
notifyListeners();
}
Future<bool> selectAPI(String input) async {
_isLoading = true; <-- 1
final uri = Uri.tryParse('https://$input$url')!;
final response = await http.get(uri);
if (response.statusCode == 200) {
final body = jsonDecode(response.body) as Map<String, dynamic>;
bool isTrue = body['info']['title'] == 'SamFetch';
_isLoading = false; <-- 2
notifyListeners();
return isWorking = isTrue;
}
_isLoading = false; <-- 3
throw response;
}
}
Here is my UI code
IconButton(
icon: apiService.isLoading
? CircularProgressIndicator()
: Icon(Icons.done),
onPressed: () async {
await addAPI(apiService, cache);
}),
}
Below is addAPI() method
Future<void> addAPI(APIService apiService, Cache cache) async {
if (api != null) {
try {
await apiService.selectAPI(api!);
if (apiService.isWorking) {
await cache.saveAppName(api!);
}
} on SocketException catch (e) {
print(e);
} catch (e) {
await cache.clearCache();
}
}
}
Is setState the final solution?
You can use Future Builder and set your Future Function in future attribute. You can control the visible widget based on the status of your function. So you dont have to use isloading variable.

How to pass value from one function to another in flutter?

I want return a value of videoController from this function and pass it like a parameter to another. When I print value inside this function I get value as I expect but when pass it to another and print it I get null.
Future<VideoPlayerController> _startVideoPlayer() async {
VideoPlayerController vController =
VideoPlayerController.file(File(videoFile.path));
videoPlayerListener = () {
if (videoController != null && videoController.value.size != null) {
// Refreshing the state to update video player with the correct ratio.
if (mounted) setState(() {});
videoController.removeListener(videoPlayerListener);
}
};
vController.addListener(videoPlayerListener);
await vController.setLooping(true);
await vController.initialize();
await videoController?.dispose();
if (mounted) {
setState(() {
imageFile = null;
videoController = vController;
});
}
await vController.play();
return videoController;
}
Try
Future<VideoPlayerController> _startVideoPlayer() async {
VideoPlayerController vController =
VideoPlayerController.file(File(videoFile.path));
videoPlayerListener = () {
if (videoController != null && videoController.value.size != null) {
// Refreshing the state to update video player with the correct ratio.
if (mounted) setState(() {});
videoController.removeListener(videoPlayerListener);
}
return videoPlayerListener;
};
vController.addListener((){_startVideoPlayer();});
await vController.setLooping(true);
await vController.initialize();
await videoController?.dispose();
if (mounted) {
setState(() {
imageFile = null;
videoController = vController;
});
}
await vController.play();
return videoController;

Flutter function inside shared preferences

Hi all i want to execute a function on load of a page and i have set this:
void initState(){
super.initState();
getPref();
}
getPref() async {
SharedPreferences myPref = await SharedPreferences
.getInstance();
setState(() {
myId = myPref.getString("keyPrefUserId");
myFullName = myPref.getString("keyPrefDisplayName");
myAvatar = myPref.getString("keyPrefPhotoUrl");
customId = myPref.getString("keyPrefUserId");
isLoading = false;
});
await updateFeedNotificationNumber();
}
updateFeedNotificationNumber() async{
QuerySnapshot eventsQuery = await activityFeedRef
.document(myid)
.collection('feedItems')
.where('isRead', isEqualTo: false)
.getDocuments();
eventsQuery.documents.forEach((DocumentSnapshot doc) {
doc.reference.updateData({'isRead' : true });
});
}
But it changes to true if i press every page.. not only to this one. Any idea about that?