Flutter how to move an item to the bottom - flutter

Question

I have this two items that once needs to appear in the middle but the other other needs to move to the bottom.
import 'package:flutter/material.dart';
class WelcomeScreen extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Container(
color: Colors.blue,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'K',
style: TextStyle(
fontSize: 200,
color: Colors.white,
decoration: TextDecoration.none,
fontStyle: FontStyle.italic,
),
),
Column(
mainAxisAlignment: MainAxisAlignment.end,
children: [Text('hello')],
)
],
),
);
}
}
This is how it looks.
I want to move the Hello Text to the bottom. How can I do that?

Answer 1

You need to use two things for that, to make it work more efficiently. These are:
Expanded Class -> This will provide space, that is, takes up the remaining space
Align class -> This will help you to align the item
Please Note: Align(), itself, cannot aligns, the item, unless space is given. If you just use the Align(), you will not see any change, cos Text('Hello') looks for space, but no space is there.
Code
Container(
width: double.infinity, // <-- Takes up total width of the device
height: double.infinity, // <-- Takes up the total height of the device
color: Colors.blue,
child: Column(
children: [
Expanded(
flex: 2, // <-- Flex takes care of the remaining space ratio
child: Center(
child: Text(
'K',
style: TextStyle(
fontSize: 200,
color: Colors.white,
decoration: TextDecoration.none,
fontStyle: FontStyle.italic,
),
)
)
),
Align(
alignment: Alignment.bottomCenter,
child: Text('Hello', style: TextStyle(color: Colors.white, fontSize: 17.0))
)
]
)
)
Result

Answer 2

If you don't want your K text to move on top, you would have to use Stack. This way, your widget inside can position themselves anywhere they want.
Stack(
alignment:Alignment.center,
children:[
Text("K"),
Align(
alignment:Alignment.bottomCenter,
child:Text("hello"),
),
]
),
Take a look at the stack widget here: https://www.youtube.com/watch?v=liEGSeD3Zt8

Answer 3

return Container(
color: Colors.blue,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Spacer(),
Text(
'K',
style: TextStyle(
fontSize: 200,
color: Colors.white,
decoration: TextDecoration.none,
fontStyle: FontStyle.italic,
),
),
Spacer(),
Column(
mainAxisAlignment: MainAxisAlignment.end,
children: [Text('hello')],
)
],
),
);
how about this way? add two Spacer