flutter - Row with Expanded

Question

I have 3 widgets in the row

GestureDetector(
  onTap: () {},
  child: Card(
    margin: EdgeInsets.zero,
    child: Padding(
      padding: EdgeInsets.all(15),
      child: Row(
        children: <Widget>[
          Text(
            "Description",
            style: TextStyle(fontSize: 15, color: Colors.orange),
          ),
          Spacer(),
          Expanded(
            child: Text(
              descriptionText,
              style: TextStyle(fontSize: 15, color: const Color(0xff0000ff)),
            ),
          ),
          Text(">", style: TextStyle(fontSize: 15, color: Colors.black))
        ],
      ),
    ),
  ),
)

The UI looked like this

How can I move the All beside > ? If the text is too long, I would like the Text displayed multi line, that why I use Expanded.

question from:https://stackoverflow.com/questions/65560092/row-with-expanded

Answer 1

You can remove the Expanded, however if there's a need for that, you can use the textAlign property:

Expanded(
  child: Text(
    'All',
    textAlign: TextAlign.right,
  ),
)

---

Full solution:

GestureDetector(
  onTap: () {},
  child: Card(
    margin: EdgeInsets.zero,
    child: Padding(
      padding: EdgeInsets.all(15),
      child: Row(
        children: <Widget>[
          Text(
            "Description",
            style: TextStyle(fontSize: 15, color: Colors.orange),
          ),
          Spacer(),
          Expanded(
            child: Text(
              descriptionText,
              textAlign: TextAlign.right, // <-- You need this
              style: TextStyle(fontSize: 15, color: const Color(0xff0000ff)),
            ),
          ),
          Text(">", style: TextStyle(fontSize: 15, color: Colors.black))
        ],
      ),
    ),
  ),
)