Flutter - Font Awesome Icon переполнение текстом - PullRequest
0 голосов
/ 17 февраля 2020

Я использую Плагин FontAwesomeIcon в моем приложении.

Некоторые иконки из плагина FontAwesomeIcon пересекаются с виджетом Текст, как показано на рисунке ниже.

enter image description here

Я могу решить эту проблему, добавив некоторую ширину между текстом и значком, но это не хорошо. так как решить эту проблему.

Мне нужно вот это изображение.

enter image description here

здесь я не добавляю никакой ширины между иконками и текст.

код:

Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                Row(
                  children: <Widget>[
                    Icon(
                      Icons.trip_origin,
                      color: Colors.white,
                    ),
                    Text(
                      'TP-23',
                      style: TextStyle(color: Colors.white),
                    )
                  ],
                ),
                Row(
                  children: <Widget>[
                    Icon(
                      FontAwesomeIcons.idCard,
                      color: Colors.white,
                    ),
                    Text(
                      'TP-23',
                      style: TextStyle(color: Colors.white),
                    )
                  ],
                )
              ],
            ),

Ответы [ 2 ]

0 голосов
/ 17 февраля 2020

Почему бы вам просто не использовать виджет Padding (https://api.flutter.dev/flutter/widgets/Padding-class.html) вот так

ДОБАВИТЬ PADDING ВЛЕВО И ВПРАВО К ЗНАЧКУ ВИДЖЕТА

Row(
  children: <Widget>[
    Padding(
      padding: EdgeInsets.symmetric(horizontal: 16.0)
      child: Icon(
        Icons.trip_origin,
        color: Colors.white,
      ),
    ),
    Text(
      'TP-23',
      style: TextStyle(color: Colors.white),
    )
  ]
)

ДОБАВИТЬ ТОЛЬКО В ПРАВО НА ЗНАЧОК ЗНАЧКА

Row(
  children: <Widget>[
    Padding(
      padding: EdgeInsets.only(right: 16.0)
      child: Icon(
        Icons.trip_origin,
        color: Colors.white,
      ),
    ),
    Text(
      'TP-23',
      style: TextStyle(color: Colors.white),
    )
  ]
)
0 голосов
/ 17 февраля 2020

Ты выглядишь так?

Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                Row(
                  children: <Widget>[
                    Icon(
                      Icons.trip_origin,
                      color: Colors.white,
                    ),
                    SizeBox(width:10) //as per your requirement
                    Text(
                      'TP-23',
                      style: TextStyle(color: Colors.white),
                    )
                  ],
                ),
                Row(
                  children: <Widget>[
                    Icon(
                      FontAwesomeIcons.idCard,
                      color: Colors.white,
                    ),
                    SizeBox(width:10) //as per your requirement
                    Text(
                      'TP-23',
                      style: TextStyle(color: Colors.white),
                    )
                  ],
                )
              ],
            ),
...