как добавить кнопку с иконкой в ​​приложении флаттер - PullRequest
0 голосов
/ 23 октября 2019

У меня в приложении есть кнопка вроде

this

, а ниже приведен код для того же

Widget loginButtonChild = const Text(
    "Log in",
    style: TextStyle(
      color: Colors.white,
      fontFamily: "OpenSans-Regular",
    ),
  );


 FlatButton.icon(
                              shape: RoundedRectangleBorder(
                                  borderRadius: new BorderRadius.circular(18.0),
                                  side: BorderSide(color: Colors.red)),
                              color: Colors.red,
                              label: loginButtonChild, 
                              icon: Icon(Icons.arrow_forward ), 
                              onPressed: () {
                               //some function
                              },
                            )

Iпытаясь создать кнопку что-то вроде

this

Может кто-нибудь помочь в этом или какие-либо предложения?

Спасибо

Ответы [ 2 ]

2 голосов
/ 23 октября 2019

Используйте это

RaisedButton(
      onPressed: () {},
      padding: const EdgeInsets.symmetric(horizontal: 24),
      color: Colors.redAccent,
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(24),
      ),
      child: Row(
        children: <Widget>[
          Text("Label", style: TextStyle(color: Colors.white)),
          SizedBox(width: 6),
          Icon(Icons.chevron_right, color: Colors.white),
        ],
      ),
    ),
0 голосов
/ 23 октября 2019

FlatButton.icon помещает значок слева, что вы можете сделать, это использовать FlatButton, а в дочернем элементе поставить Row со значком метки +, например:

FlatButton(
  shape: RoundedRectangleBorder(
      borderRadius: new BorderRadius.circular(18.0),
      side: BorderSide(color: Colors.red)),
  color: Colors.red,
  child: Row(
    mainAxisSize: MainAxisSize.min,
    children: <Widget>[
      loginButtonChild,
      const SizedBox(width: 8.0),
      Icon(Icons.arrow_forward),
    ],
  ),
  onPressed: () {
    //some function
  },
)

ЕслиВы хотите иметь кнопку с возвышением, просто измените FlatButton на RaisedButton

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...