Как подчеркнуть контейнерный виджет во флаттере

Question

Я пытаюсь подчеркнуть контейнер в моем приложении Flutter. До сих пор я достиг некоторого подчинения, когда использовал следующий код:

    Container(
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Expanded(
              child: Padding(
                padding: EdgeInsets.all(8.0),
                child: Text(
                  'Underline my parent!',
                  maxLines: 2,
                  textAlign: TextAlign.center,
                ),
              ),
            )
          ],
        ),
        decoration: Border(bottom: BorderSide(color: Colors.grey)),
      ),

Но теперь я хочу, чтобы черта подчеркивания не была от начала до конца, я хочу иметь место в начале и в конце. Если есть какой-нибудь более умный способ подчеркнуть виджеты, я был бы рад видеть это также.

Answer 1

Одним из простых решений является создание строки с использованием виджета Container. И оберните виджет Row, используя виджет Column, и добавьте эту строку в качестве второго потомка, как показано ниже:

var aLine = Container(color: Colors.grey, width: 50.0, height: 2.0,); 

Column(
  children: <Widget>[
    Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Expanded(
            child: Padding(
              padding: EdgeInsets.all(8.0),
              child: Text(
                'Underline my parent!',
                maxLines: 2,
                textAlign: TextAlign.center,
              ),
            ),
          ),
        ],
      ),
      aLine
  ],
),

Answer 2

Вы можете использовать простой виджет Divider, включая отступы:

new Padding(
    padding: EdgeInsets.all(8.0), 
    child: new Divider()
),

Затем вы можете обернуть существующий виджет в столбец:

new Column(
    children: <Widget> [
        yourContainerWidget,
        new Padding(
            padding: EdgeInsets.all(8.0), 
            child: new Divider()
        ),     
    ]
)