Create a new card when FAB is clicked

Here’s one way:

import 'package:flutter/material.dart';

void main() async {
  runApp(MaterialApp(debugShowCheckedModeBanner: false, home: MyApp()));
}

class MyApp extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {

  List<Widget> cardWidget = [];

  buildCard() {
    setState(() {
      cardWidget.add(
        Card(
          child: Column(
            mainAxisSize: MainAxisSize.min,
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Padding(
                padding: EdgeInsets.all(20.0),
                child: TextFormField(),
              ),
              Padding(
                padding: EdgeInsets.all(20.0),
                child: TextFormField(),
              ),
              RaisedButton(
                onPressed: () {},
                padding: EdgeInsets.only(left: 20.0, right: 20.0, top: 10.0, bottom: 10.0),
                color: Colors.green,
                child: Text(
                  'Criar',
                  style: TextStyle(
                    color: Colors.white
                  ),
                ),
              )
            ],
          ),
        )
      );
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.blue[900],
      appBar: AppBar(
        elevation: 0,
        backgroundColor: Colors.blue[900]
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: buildCard,
        backgroundColor: Colors.green,
        child: Icon(
          Icons.add,
          color: Colors.white,
        ),
      ),
      body: Column(
        children: cardWidget.map((data) {
          return data;
        }).toList()
      ),
    );
  }
}

This method may not be the best way for you so I encourage you to try something new on your own!

CLICK HERE to find out more related problems solutions.

Leave a Comment

Your email address will not be published.

Scroll to Top