[Flutter/Dart] Place widgets in the middle and right edge of the screen
What want to do
As the title suggests.
Place two widgets in one line on the screen
One in the center of the screen and the other on the right edge of the screen
When I tried to do it with Row's mainAxisAligment, it was a bit difficult.
Solution
Do as below
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Expanded(
child: SizedBox(),
),
WidgetA(),
Expanded(
child: Align(
alignment: Alignment.centerRight,
child: WidgetB(),
),
),
]
),The point is
Insert SizedBox() to force the number of elements to 3
Enclose SizedBox with Expanded
Row's mainAxisAligment is MainAxisAlignment.spaceBetween Now WidgetA is in the middle and WidgetB is on the right edge
Additionally surround WidgetB with Align to make it truly right edge
Recent Posts
See AllWhat want to do I want to create an input form using TextField. For example, if the input content is a monetary amount, I would like to display it in 3-digit delimiters with a ¥ prefix. Rather than ha
What want to do There is a variable that remain unchanged once the initial value is determined. However, it cannot be determined yet when the constructor is called. About such variable Define the vari
Phenomenon Certain icons perform certain actions when long-pressed To achieve this, I registered the actions in GestureDetector's onLongPress event. However, when I tried to build it, the process was
