Dolphin
Dolphin

Reputation: 39025

how to make padding align right with row in flutter

Now I am using row to horizon some component in flutter, this is my code:

Row(
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Padding(
                    padding: const EdgeInsets.only(top: 8, bottom: 8.0),
                    child: Text(
                      item.subName,
                      style: TextStyle(
                        fontSize: 16,
                        fontWeight: FontWeight.w600,
                      ),
                    ),
                  ),
                  Padding(
                    padding: const EdgeInsets.only(top: 8,bottom: 8.0,right: 1),
                    child: ButtonTheme(
                        minWidth: 50,
                        height: 30.0,
                        child:RaisedButton(
                          color: Theme.of(context).primaryColor,
                          shape: new RoundedRectangleBorder(
                              borderRadius: new BorderRadius.circular(5.0)),
                          onPressed: () async {
                            print("pressed");
                          },
                          child: Text("Subscribe"),
                        )
                    ),
                  )
                ],
              )

now I want the button subscribe align right, what should I do to make it work? I am tried like this but failed:

padding: const EdgeInsets.only(top: 8,bottom: 8.0,right: 1),

I am tried to make the button with one pixel of the screen, but it seems not working.

Upvotes: 2

Views: 4535

Answers (3)

S.R Keshav
S.R Keshav

Reputation: 2093

If you want space between the widgets of the row.

 Row(
    mainAxisAlignment: MainAxisAlignment.spaceBetween,
  ),

To Align the widgets completely on the right.

       Row(
    mainAxisAlignment: MainAxisAlignment.end,
  ),

To make the widgets take up the space evenly in the row.

 Row(
    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
  ),

Upvotes: 1

PRATIK PAWAR
PRATIK PAWAR

Reputation: 322

What you are trying to add is padding which only surrounds the widget, it will not align the widget to right. it will add padding to the right side of the Widget. In Row() widget make mainAxisAlignment: MainAxisAlignment.spaceBetween. This will align the Subscribe button to right.

Upvotes: 1

Md Azharuddin
Md Azharuddin

Reputation: 1476

If you want something like this:

enter image description here

You can set the mainAxisAlignment property of Row to spaceBetween

Upvotes: 2

Related Questions