Flutter align two items on extremes - one on the left and one on the right

Question

I am trying to align two items at extremes one on the left and one on the right. I have one row that is aligned to the left and then a child of that row is aligned to the ri

Answer 1

Yes CopsOnRoad is right, through stack you can align one on right and other at center.

Stack(
    children: [
      Align(
        alignment: Alignment.centerRight,
        child: Text("right"),
      ),
      Align(
        alignment: Alignment.center,
        child: Text("center"),
      )
    ],
  )

Answer 2

Use a single Row instead, with mainAxisAlignment: MainAxisAlignment.spaceBetween.

new Row(
  mainAxisAlignment: MainAxisAlignment.spaceBetween,
  children: [
    new Text("left"),
    new Text("right")
  ]
);

Or you can use Expanded

new Row(
  children: [
    new Text("left"),
    new Expanded(
      child: settingsRow,
    ),
  ],
);

Answer 3

A simple solution would be to use Spacer() between the two widgets

Row(
  children: [
    Text("left"),
    Spacer(),
    Text("right")
  ]
);

Answer 4

You can do it in many ways.

Using mainAxisAlignment: MainAxisAlignment.spaceBetween

Row(
  mainAxisAlignment: MainAxisAlignment.spaceBetween,
  children: <Widget>[
    FlutterLogo(),
    FlutterLogo(),
  ],
);

---

Using Spacer

Row(
  children: <Widget>[
    FlutterLogo(),
    Spacer(),
    FlutterLogo(),
  ],
);

---

Using Expanded

Row(
  children: <Widget>[
    FlutterLogo(),
    Expanded(child: SizedBox()),
    FlutterLogo(),
  ],
);

---

Using Flexible

Row(
  children: <Widget>[
    FlutterLogo(),
    Flexible(fit: FlexFit.tight, child: SizedBox()),
    FlutterLogo(),
  ],
);

---

Output: