CODEWITHSUNDEEP
flutterdart
Jallvar
Jallvar

Reputation: 13

how can i move a container to right

how can i move a container to right. I have 3 icon and i need move last icon to right so 2 other icons was at left

I writing app for flutter example a post from my app

Row(
                                      children: <Widget>[
                                        Container(
                                          margin: EdgeInsets.only(right: 10),
                                          child: Row(
                                            children: <Widget>[
                                              Icon(Icons.insert_emoticon),
                                              Text(memes.graphql.hashtag.edgeHashtagToMedia.edges[value].node.edgeLikedBy.count.toString()),
                                            ],
                                          ),
                                        ),
                                        Icon(Icons.comment),
                                        Text(memes.graphql.hashtag.edgeHashtagToMedia.edges[value].node.edgeMediaToComment.count.toString()),
                                        Container(
                                          margin: EdgeInsets.only(left: 230),
                                          child: Icon(Icons.thumb_up),
                                        )
                                      ],
                                    ),

Upvotes: 0

Views: 2321

Answers (2)

Fethi
Fethi

Reputation: 927

you can follow the answer above or add the IconComment and it is value on the same row and set the mainaxis alignement to MainAxisAlignment.spaceBetween try the code below

  Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          Container(
            margin: EdgeInsets.only(right: 10),
            child: Row(
              children: <Widget>[
                Icon(Icons.insert_emoticon),
                Text(memes.graphql.hashtag.edgeHashtagToMedia.edges[value]
                    .node.edgeLikedBy.count
                    .toString()),
                Icon(Icons.comment),
                Text(memes.graphql.hashtag.edgeHashtagToMedia.edges[value]
                    .node.edgeMediaToComment.count
                    .toString()),
              ],
            ),
          ),
          Container(
            margin: EdgeInsets.only(left: 230),
            child: Icon(Icons.thumb_up),
          )
        ],
      ),

you can modify that margin right to make it fit perfectly

Upvotes: 1

anmol.majhail
anmol.majhail

Reputation: 51206

Simply use a - Spacer() widget to fill up space in between.

Row(
              children: <Widget>[
                Container(
                  margin: EdgeInsets.only(right: 10),
                  child: Row(
                    children: <Widget>[
                      Icon(Icons.insert_emoticon),
                      Text('10'),
                      Text(memes.graphql.hashtag.edgeHashtagToMedia.edges[value]
                          .node.edgeLikedBy.count
                          .toString()),
                    ],
                  ),
                ),
                Icon(Icons.comment),
                Text(memes.graphql.hashtag.edgeHashtagToMedia.edges[value].node
                    .edgeMediaToComment.count
                    .toString()),
                Spacer(),  // Add this
                Container(
                  margin: EdgeInsets.only(left: 230),
                  child: Icon(Icons.thumb_up),
                )
              ],
            ),

Upvotes: 3

Related Questions