How to align text in a button in flutter?

狂风中的少年 提交于 2020-07-08 07:45:01

问题


I just want to do the most simplest of things: I just want to have a button with the text aligned to the right. For some reason I can't figure this out.

I tried textAlign: TextAlign.right but it's still in the centre. I tried making a row inside the button with mainAxisAlignment.end but nope, still in center. for some reason it works if I use main axis alignment.end on a column instead of a row (puts it at bottom instead of right)

This is what I have so far:

FlatButton(
    color: Colors.black,
    child: Row(
    mainAxisAlignment: MainAxisAlignment.end,
    children: <Widget>[
        Text(
            "M",
            textAlign: TextAlign.right,
            style: TextStyle(
            color: mColor, fontSize: 10.0),
        ),
    ],
),

回答1:


Put it in an inkwell

InkWell(
    onTap: doSomething,
    child: SizedBox(
    height: 100,
    width: 100,
    child: Container(
        decoration: BoxDecoration(
            border: Border.all(color: Colors.black)),
            child: Text(
                'hello',
                textAlign: TextAlign.right,
            ),
        ),
    ),
),



回答2:


You should put your 'Text' in 'Align' to align your text left, right, top, bottom etc. As-

    FlatButton(
                color: Colors.blue,
                textColor: Colors.white,
                padding: EdgeInsets.all(8.0),
                splashColor: Colors.blueAccent,
                onPressed: () {
                  /*...*/
                },
                child: Align(
                  alignment: Alignment.center,
                  child: Text(
                    "Flat",
                    style: TextStyle(fontSize: 20.0),
                    textAlign: TextAlign.center
                  ),
                ))



回答3:


I found that using the padding values in the FlatButton widget worked very well.

See example below...

 FlatButton(
        onPressed: () {
           /*...*/
        },
        padding: EdgeInsets.only(right: 10.0, bottom: 1.0, top: 1.0),
        child: Text(
          'Getting Started',
          style: TextStyle(
                        color: Colors.blueGrey[900],
                        fontSize: 12.0
          ), //TextStyle
         ), //Text
        ), //FlatButton


来源:https://stackoverflow.com/questions/56267502/how-to-align-text-in-a-button-in-flutter

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!