How to decrease space of List in Page?

Issue

I am trying to insert a list in a row format into an initial page of an app but the UI of it shows too much spacing between. I actually got the UI off a youtube tutorial and was trying to implement its elements. How can I adjust my code accordingly to reduce the spacing as shown below?

Code:

class Firstpage extends StatefulWidget {
  @override
  _FirstpageState createState() => _FirstpageState();
}

class _FirstpageState extends State<Firstpage> {
  int currentPage = 0;

  List<Map<String, String>> splashData = [
    {
      "text": "Welcome to Tokoto, Let’s shop!",
    },
    {
      "text":
      "We help people conect with store \naround United State of America",
    },
    {
      "text": "We show the easy way to shop. \nJust stay at home with us",
    },
  ];
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: SafeArea(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: <Widget>[
                SizedBox(height: 80),
                Container(
                  width: 340,
                  height: 250,
                  child:
                  new Image.asset('assets/images/trip.png', fit: BoxFit.fill),
                ),
                Center(
                  child: Text("App", style: TextStyle(
                    fontSize: 40,
                    fontWeight: FontWeight.w500,
                    color: Color(0xFF9a0e2a)
                  ),),
                ),
                SizedBox(height: 10),
                Expanded(
                  child: PageView.builder(
                    onPageChanged: (value) {
                      setState(() {
                        currentPage = value;
                      });
                    },
                    itemCount: splashData.length,
                    itemBuilder: (context, index) => intro(
                      text: splashData[index]['text'],
                    ),
                  ),
                ),
                Expanded(
                  child: Column(
                      children: <Widget>[
                        Row(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: List.generate(
                            splashData.length,
                                (index) => buildDot(index: index),
                          ),
                        ),
                      ]
                  )
                ),
                DefaultButton(
                  text: "Sign Up",
                  press: () {
                    Navigator.push(context, MaterialPageRoute(builder: (context)=>Signup()));
                  },
                ),
                SizedBox(height: 20),
                DefaultButton(
                  text: "Login",
                  press: () {
                    Navigator.push(context, MaterialPageRoute(builder: (context)=>Signup()));
                  },
                ),
              ],
            )
        )
    );
  }

  AnimatedContainer buildDot({int? index}) {
    return AnimatedContainer(
      duration: Duration(milliseconds: 200),
      margin: EdgeInsets.only(right: 5),
      height: 6,
      width: currentPage == index ? 20 : 6,
      decoration: BoxDecoration(
        color: currentPage == index ? Color(0xFFeb1f48) : Color(0xFFD8D8D8),
        borderRadius: BorderRadius.circular(3),
      ),
    );
  }
}

And just for reference, Class Intro is:

class intro extends StatelessWidget {
  const intro({
    Key? key,
    this.text,
    this.image,
  }) : super(key: key);
  final String? text, image;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Text(
          text!,
          textAlign: TextAlign.center,
        ),
      ],
    );
  }
}

Solution

If your not using SingleChildScrollView and direct to Column used try Spacer() to have balance on the spacing or put flex to adjust the spacing between.

Spacer()

or

Spacer(flex: 1),

sample

Column(
      children:[
              Spacer(),
         Container(
                  width: 340,
                  height: 250,
                  child:
                  new Image.asset('assets/images/trip.png', fit: BoxFit.fill),
                ),
                Center(
                  child: Text("App", style: TextStyle(
                    fontSize: 40,
                    fontWeight: FontWeight.w500,
                    color: Color(0xFF9a0e2a)
                  ),),
                ),
         Spacer(),
]),

Answered By - Arbiter Chil