CODEWITHSUNDEEP
flutterflutter-layout
jws
jws

Reputation: 2764

Flutter how to right align last column

In Flutter, how do I make the third column fill the width? I'm trying to right-align the edit icon.

Row(
      children: [
        Column(
          children: [ SizedBox(width: 10) ]
        ),
        Column(
          children: [ Text("example") ]
        ),
        Column(
          children: [ IconButton(icon: Icon(Icons.edit)) ],
        ),
      ],
    );

All of the things I've tried such as putting it in Expanded() or IntrinsicWidth() or Column(..., crossAxisAlignment: CrossAxisAlignment.stretch) have resulted in "Cannot hit test a render box that has never been laid out."

Upvotes: 0

Views: 793

Answers (2)

Michael Soliman
Michael Soliman

Reputation: 2788

wrap your column with Align and then Expanded and then set Alignment:Alignment.centerRight . this will give you the flexibility to place your widget any place you want.
see Align from Flutter Docs.

Row(
              children: [
                Column(children: [SizedBox(width: 10)]),
                Column(children: [Text("example")]),
                Expanded(
                  child: Align(
                    alignment: Alignment.centerRight,
                    child: Column(
                      children: [
                        IconButton(
                          icon: Icon(Icons.edit),
                          onPressed: () {},
                        )
                      ],
                    ),
                  ),
                ),
              ],
            ),

Upvotes: 0

Simon Sot
Simon Sot

Reputation: 3136

Place Spacer() before last Column.

Upvotes: 3

Related Questions