Adding new ListTile item on click - flutter

Question

I have created method and widget, right now my code is working fine because data is static, i want to add new item in ListTile when i press Add Button.
method:
Card listSectionMethod(String title, String subtitle, IconData icon) {
return new Card(
child: ListTile(
title: Text(
title,
style: TextStyle(fontWeight: FontWeight.bold),
),
subtitle: Text(subtitle),
trailing: Icon(
icon,
color: Colors.blue,
),
),
);
}
Widget:
Widget listSection = Container(
margin: EdgeInsets.only(top: 210),
child: ListView(
children: [
Column(
children: [
listSectionMethod("TITLE 1", "hello i am subtitle one",Icons.forward),
listSectionMethod("TITLE 2", "hello i am subtitle two",Icons.forward),
],
),
],),
);
Button:
FloatingActionButton(
onPressed:()
{
print("clicked"); //i want to add new item from here, when i press on click
},
child:Text("+"),
backgroundColor: Colors.blue,
),
);

Answer 1

look to add a new item you must do the following:
Assuming your screen is a StatefulWidget
class SomePage extends StatefulWidget {
#override
_SomePageState createState() => _SomePageState();
}
class _SomePageState extends State<SomePage> {
var _listSection = List<Widget>();
#override
void initState() {
super.initState();
// Here initialize the list in case it is required
_listSection.add(
listSectionMethod("TITLE 1", "hello i am subtitle one", Icons.forward),
);
_listSection.add(
listSectionMethod("TITLE 2", "hello i am subtitle two", Icons.forward),
);
}
}
Widget:
Widget listSection() {
return Container(
margin: EdgeInsets.only(top: 210),
child: ListView(
children: [
Column(
children: this._listSection, // ----> Add this
),
],
),
);
}
Button:
FloatingActionButton(
onPressed: () {
setState(() {
// Here we add a new item to the list
_listSection.add(
listSectionMethod("New TITLE", "hello from click", Icons.forward),
);
});
},
child: Text("+"),
backgroundColor: Colors.blue,
);

Answer 2

Before I start, you need to make sure you're using a StatefulWidget, not a StatelessWidget so we can take advantage of the setState() method.
First, define a class member variable. You could put it on top of the class, or where ever else as long as it's not inside a function.
List<Widget> _listOfWidgets = [];
Second, let's modify your FAB (Floating Action Button) code:
FloatingActionButton(
onPressed: () {
print("fab clicked");
_addItemToList(); // new method
},
child:Text("+"),
backgroundColor: Colors.blue,
);
Let's now define the new method which will use our class member variable.
_addItemToList() {
List<Widget> tempList = _listOfWidgets; // defining a new temporary list which will be equal to our other list
tempList.add(Text("I'm an added item!"));
setState(() {
_listOfWidgets = tempList; // this will trigger a rebuild of the ENTIRE widget, therefore adding our new item to the list!
});
}
Let's modify your existing code to work with our new code:
Widget listSection = Container(
margin: EdgeInsets.only(top: 210),
child: ListView(
children: [
Column(
children: _listOfWidgets,
),
],
),
);
There you go!