How do I line up at the bottom corner of the screen in the flutter?

Question

I am new to flutter and need to align a Row() inside a columnar() that already has other items. The screen I’m making contains a main column that stores all the content of the page and other widgets, but amid these widgets I have Row() which also has other wigets and I want to align only the Row() at the bottom of the screen:

Scaffold(
     appBar: AppBar(
       title: Text("DETALHAMENTO"),
       centerTitle: true,
       backgroundColor: Colors.orange,
     ),
     body: Column(
       children: [
         Stack(
           children: [
             SizedBox(
               child: Image.asset("images/rere.jpeg") ,
             ),
             Container(
               padding: EdgeInsets.only(top: 10, left: 10),
               child: Text("RÊRÊ", style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold, fontSize: 40),),
             )
           ],
         ),
         Container(
           alignment: Alignment.topLeft,
           padding: EdgeInsets.only(left: 15,top: 15),
           color: Colors.red,
           height: 300,
           child: SingleChildScrollView(
             child: Text(""),
           ),
         ),

         Row(

           children: [IconButton(icon: Icon(Icons.remove_circle, size: 20,), onPressed:(){
           }),
             Padding(
               padding: EdgeInsets.all(5),
               child:  Container(
                 child: Text(qtd.toString(), style: TextStyle(fontSize: 25),),
               ),
             ),
             IconButton(icon: Icon(Icons.add_circle, size: 20,), onPressed:(){
             }),],
         )

       ],
     )
 );

As you can see, there are buttons to add and decrease, I wanted them to be at the bottom corner of the screen. Thank you!

Answer 1

Basically, you need to expand the size of the area that your Row occupy and align its contents.

Expanded(
  child: Row(
    mainAxisAlignment: MainAxisAlignment.center,
    children: [ ... ]
  )
)

Expanded expands the Child size of a Column or Row, in order to take up all available space.

MainAxisAlignment behaves according to the orientation of the Widget: Horizontally to Row and vertically to Column. This post here (in English) explains easily, with drawings and everything.

That is the result:

And if you want him to be down there, you can add crossAxisAlignment: CrossAxisAlignment.end (that in the case of Row, makes the vertical control):