Home > Back-end >  How to create new containers as a button click flutter
How to create new containers as a button click flutter

Time:10-20

I'm trying to create new containers by clicking on a button, but I click on the button and it's not updating the screen in the application with the new container. What could I be doing wrong?

int _i = 0;
return Column(
  children: [
    TextButton(
      style: ButtonStyle(
        foregroundColor: MaterialStateProperty.all<Color>(Colors.blue),
      ),
      onPressed: () {
        setState(() {
          _i  ;
          print(_i);
          print("Fidase");
        });
      },
      child: Text('TextButton'),
    ),
    SingleChildScrollView(
      child: ListView.builder(
          shrinkWrap: true,
          itemCount: _i,
          itemBuilder: (BuildContext ctxt, int index) {
            return Container(
                color: Colors.blueGrey,
                height: heightScreen * .08,
                width: widthScreen,
                child: Text("Container numero $_i"));
          }),
    )
  ],
);

CodePudding user response:

This code work correctly

class _MyHomePageState extends State<MyHomePage> {
  int _i = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(),
        body: Column(
          children: [
            TextButton(
              style: ButtonStyle(
                foregroundColor: MaterialStateProperty.all<Color>(Colors.blue),
              ),
              onPressed: () {
                setState(() {
                  _i  ;
                  print(_i);
                  print("Fidase");
                });
              },
              child: Text('TextButton'),
            ),
            Expanded(
              child: SingleChildScrollView(
                child: ListView.builder(
                    shrinkWrap: true,
                    itemCount: _i,
                    itemBuilder: (BuildContext ctxt, int index) {
                      return Container(
                          color: Colors.blueGrey,
                          height: 100,
                          width: 100,
                          child: Text("Container numero $_i"));
                    }),
              ),
            )
          ],
        )
        );
  }
}

CodePudding user response:

Try below code:

class MyTabbedPage extends StatefulWidget {
  const MyTabbedPage({Key? key}) : super(key: key);
  @override
  _MyTabbedPageState createState() => new _MyTabbedPageState();
}

class _MyTabbedPageState extends State<MyTabbedPage>{
 

  int _i = 0;

  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      child: Column(
        children: [
          TextButton(
            style: ButtonStyle(
              foregroundColor: MaterialStateProperty.all<Color>(Colors.blue),
            ),
            onPressed: () {
              setState(() {
                _i  ;
                print(_i);
                print("Fidase");
              });
            },
            child: Text('TextButton'),
          ),
          ListView.builder(
            shrinkWrap: true,
            itemCount: _i,
            itemBuilder: (BuildContext ctxt, int index) {
              return Container(
                margin: EdgeInsets.all(10),
                color: Colors.blueGrey,
                height: 200,
                width: 200,
                child: Text("Container numero $_i"),
              );
            },
          ),
        ],
      ),
    );
  }
}
  • Related