Home > Mobile >  SetState not updating listview
SetState not updating listview

Time:01-12

Im trying to make it so when you press search it creates a listtile. It works but for it to work I have to click the button and then rebuild the app for it to appear. I was looking at some other posts but I could not find anything that worked. The main parts to look at is I have a function that adds a listtile. I have a button with an on press to create the tile. And I have the children of container at the bottom as the list of created listtiles.

class Home extends StatefulWidget {
  const Home({Key? key}) : super(key: key);

  @override
  State<Home> createState() => _HomeState();
}

class _HomeState extends State<Home> {

  List<Widget> _listOfWidgets = [];

  @override
  Widget build(BuildContext context) {

    _addItemToList() {
      List<Widget> tempList =
          _listOfWidgets; // defining a new temporary list which will be equal to our other list
      tempList.add(ListTile(
          key: UniqueKey(),
          leading: Icon(Icons.list),
          trailing: FlatButton(
            onPressed: () async {},
            //Download Link
            child: Text(
              "Download",
              style: TextStyle(color: Colors.green, fontSize: 15),
            ),
          ),
          title: Text("")));
      this.setState(() {
        _listOfWidgets =
            tempList; // this will trigger a rebuild of the ENTIRE widget, therefore adding our new item to the list!
      });
    }

    return MaterialApp(
        theme: ThemeData.light(),
        darkTheme: ThemeData.dark(),
        themeMode: currentTheme.currentTheme(),
        home: Scaffold(
            appBar: AppBar(
              actions: [
                IconButton(
                  onPressed: () {
                    setState(() {
                      currentTheme.switchTheme();
                    });
                  },
                  icon: Icon(Icons.wb_sunny),
                ),
                IconButton(
                  onPressed: () async {
                    await FirebaseAuth.instance.signOut();
                  },
                  icon: Icon(Icons.exit_to_app),
                ),
              ],
              backgroundColor: Colors.blue,
              title: Text("Home"),
            ),
            body: ListView(
              children: [
                ListTile(
                  leading: SizedBox(
                    width: 300,
                    child: TextField(
                      controller: search,
                      decoration: InputDecoration(
                        labelText: "Enter Manga Name",
                      ),
                    ),
                  ),
                  trailing: ElevatedButton(
                      onPressed: () async {
                        _addItemToList();
                      },
                      child: Text("Search")),
                ),
                Container(
                    margin: EdgeInsets.all(15),
                    width: 100,
                    height: 515,
                    color: Colors.black12,
                    child: ListView(
                      children: _listOfWidgets,
                    ))
              ],
            )));
  }
}

CodePudding user response:

try add below code

if you update status you need setState()

A better way to state management is to use a BLoC or Provider package.


...

onPressed: () {
    setState(() {
        _addItemToList();
    });    
},

...

CodePudding user response:

Figured it out after a bit of tinkering. Fix for me was to add key: UniqueKey(), to my ListView. I had keys added to my ListTiles instead of the actual ListView.

CodePudding user response:

onPressed: () {
    setState(() {
        _addItemToList();
    });    
},

The Problem Solution is :

      List<Widget> tempList = <Widget>[];

    _addItemToList() {

  tempList.addAll(
          _listOfWidgets); // defining a new temporary list which will be equal to our other list
      tempList.add(ListTile(
          key: UniqueKey(),
          leading: Icon(Icons.list),
          trailing: FlatButton(
            onPressed: () async {},
            //Download Link
            child: Text(
              "Download",
              style: TextStyle(color: Colors.green, fontSize: 15),
            ),
          ),
          title: Text("")));
      this.setState(() {
        _listOfWidgets =
            tempList; // this will trigger a rebuild of the ENTIRE widget, therefore adding our new item to the list!
      });
    }
  •  Tags:  
  • Related