setState() or markNeedsBuild() called during build during build and how to resolve it

Issue

setState() or markNeedsBuild() called during build during build and how to resolve it.
Can you please little explain about this——————————————————————————————————————————————————————————————————————————————————————————————————

import 'package:dishes_app/Dummy_data.dart';
import 'package:dishes_app/Screens/Categories_screen.dart';
import 'package:dishes_app/Screens/Category_meals_screen.dart';
import 'package:dishes_app/Screens/filter_screen.dart';
import 'package:dishes_app/Screens/meal_detail_screen.dart';
import 'package:dishes_app/Screens/tab_screen.dart';
import 'package:flutter/material.dart';

import 'models/meal.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  // This widget is the root of your application.
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  Map<String, bool> _filters = {
    'gluten': false,
    'lactose': false,
    'vegan': false,
    'vegetarian': false,
  };

  List<Meal> _availablemeals = DUMMY_MEALS;

  void _setFilters(Map<String, bool> filterData) {
    setState(() {
      _filters = filterData;
      _availablemeals = DUMMY_MEALS.where((meal) {
        if (_filters['gluten']! && !meal.isGlutenFree) {
          return false;
        }
        if (_filters['lactose']! && !meal.isLactoseFree) {
          return false;
        }
        if (_filters['vegan']! && !meal.isVegan) {
          return false;
        }
        if (_filters['vegetarian']! && !meal.isVegetarian) {
          return false;
        }
        return true;
      }).toList();
    });
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
          primaryColor: Colors.blue,
          accentColor: Colors.amber,
          canvasColor: Color.fromRGBO(255, 254, 229, 1),
          fontFamily: 'Raleway',
          textTheme: ThemeData.light().textTheme.copyWith(
                body1: TextStyle(
                  color: Color.fromRGBO(20, 51, 51, 1),
                ),
                body2: TextStyle(color: Color.fromRGBO(20, 51, 51, 1)),
                title: TextStyle(
                  fontSize: 20,
                  fontFamily: 'RobotoCondensed',
                  fontWeight: FontWeight.bold,
                ),
              )),
      routes: {
        '/': (ctx) => TabsScreen(),
        CategoryMealsScreen.routeName: (ctx) =>
            CategoryMealsScreen(_availablemeals),
        MealDetailScreen.routeName: (ctx) => MealDetailScreen(),
        FilterScreen.routeName: (ctx) =>
            FilterScreen(_setFilters(_filters) as Function(Map)),
      },
      onGenerateRoute: (settings) {
        print(settings.arguments);
      },
      onUnknownRoute: (settings) {
        return MaterialPageRoute(builder: (ctx) => CategoriesScreen());
      },
    );
  }
}

Solution

On this line:

FilterScreen.routeName: (ctx) =>
            FilterScreen(_setFilters(_filters) as Function(Map)),

The _setFilters(_filters) is actually calling the function itself, and not passing a Function as a parameter as it should. If thats exactly what you want to do in your function, then create a anonymous call like this:

FilterScreen.routeName: (ctx) =>
           FilterScreen((){_setFilters(_filters);} as Function(Map)),

Depending on your FilterScreen you could just pass _setFilters directly, but this way you won`t be able to give in any parameters from before-hand.

Answered By – Naslausky

Answer Checked By – Gilberto Lyons (FlutterFixes Admin)