CODEWITHSUNDEEP
flutter-layout
Prashant Katoch
Prashant Katoch

Reputation: 684

How to align first item at the start and second item of a row at the end?

I am not able to separate two items with space so that first item appears at the start of row and second at the end of it.

                  Container(
                        margin: EdgeInsets.all(12.0),
                        child: Row(
                           crossAxisAlignment: 
                                CrossAxisAlignment.end,
                          mainAxisAlignment: 
                            MainAxisAlignment.spaceBetween,
                          children: [
                            InkWell(
                                child: Text("Select your service",
                                    style: profileValueTextStyle),
                                onTap: () {

                                  print("-----" + result);
                                }),
                            Icon(Icons.close)
                          ],
                        ),),

I want to separate the text and close icon.enter image description here

Upvotes: 0

Views: 1119

Answers (1)

Ferdi
Ferdi

Reputation: 788

You should wrap your InkWell into a Expanded Widget:

Container(
  margin: EdgeInsets.all(12.0),
  child: Row(
     crossAxisAlignment: 
          CrossAxisAlignment.end,
    mainAxisAlignment: 
      MainAxisAlignment.spaceBetween,
    children: [
      Expanded(                                        //Here's the widget you need
        InkWell(
            child: Text("Select your service",
                style: profileValueTextStyle),
            onTap: () {

              print("-----" + result);
            }),
        ),
      Icon(Icons.close)
    ],
  ),),

It's gonna "push" the Icon to the end of the row.

Hope it's helps !!

Upvotes: 1

Related Questions