What do I need to do to link to another file with my button widgets?

Question

I am still learning to code. How do I store all my button widgets in another file and import it into my main file? Here is the code:

class _testState extends State<test> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.blue[900],
      appBar: AppBar(
        title: Text('test'),
        backgroundColor: Colors.red[900],
      ),
      body: GridView(
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 3,
        ),
        children: [
          //buttons
        ],
      ),
    );
  }
}

How can I take the code below and put it in another file and then link it to the file above by the buttons comment?

              Padding(
                padding: const EdgeInsets.fromLTRB(0.0, 9.0, 0.0, 0.0),
                child: TextButton.icon(
                  onPressed: () => {},
                  icon: Column(
                    children: [
                      Icon(
                        Icons.add,
                        color: Colors.white,
                        size: 75,
                      ),
                      Padding(
                        padding: const EdgeInsets.all(10.0),
                        child: Text(
                          'Label',
                          style: TextStyle(
                            color: Colors.white,
                          ),
                        ),
                      ),
                    ],
                  ),
                  label: Text(
                    '', //'Label',
                    style: TextStyle(
                      color: Colors.white,
                    ),
                  ),
                ),
              ),

Answer 1

-First, create a new file, name it jeff.dart.

-Second, type this in the new file: stless . Press Enter, Flutter will automatically make a new StatelessWidget for you. Change the class name to JeffButton. Now, it look like this :

class JeffButton extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return Container(
           );
  }
}

• Copy and paste the button's code , replace the Container() .Congratulations! You had the JeffButton! Now you can use it everywhere:

class JeffButton extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return  Padding(
            padding: const EdgeInsets.fromLTRB(0.0, 9.0, 0.0, 0.0),
            child: TextButton.icon(
              onPressed: () => {},
              icon: Column(
                children: [
                  Icon(
                    Icons.add,
                    color: Colors.white,
                    size: 75,
                  ),
                  Padding(
                    padding: const EdgeInsets.all(10.0),
                    child: Text(
                      'Label',
                      style: TextStyle(
                        color: Colors.white,
                      ),
                    ),
                  ),
                ],
              ),
              label: Text(
                '', //'Label',
                style: TextStyle(
                  color: Colors.white,
                ),
              ),
            ),
          );
  }
}

Now just add it to where you need it ;) :

children: [
          //buttons
JeffButton(),
        ],

Remember to import the jeff.dart file to where you use it, you can do it easily by move the cursor to JeffButton(), show quick fixes, choose Import: .... (which is the first options). This is how to show quick fixes if you didn't know: https://flutter.dev/docs/development/tools/flutter-fix