Flutter Padding EdgeInsets от LTRB подталкивает контент вниз - PullRequest
Новая
       75

Flutter Padding EdgeInsets от LTRB подталкивает контент вниз

0 голосов
/ 20 июня 2020

Я пытаюсь добавить нижний отступ к моему столбцу внутри виджета Card (см. Рисунок и код ниже): [! [Снимок мой код и макет] [1]] [1]

Код: 

Column(
                children: <Widget>[
                  Padding(padding: EdgeInsets.fromLTRB(10, 0, 10, 20)),
                  Text('${e.phrase}', style: TextStyle(color: Colors.white60),),
                  Divider(height: 5, color: Colors.transparent,),
                  Text('${e.author}', style: TextStyle(color: Colors.white60),)
                ],
              ),

Проблема: чем больше я увеличиваю значение нижнего отступа, тем больше содержимое столбца перемещается в внизу, что противоположно тому, что задумано, что я делаю не так? Пожалуйста, объясни. [1]: https://i.stack.imgur.com/dFKKt.png

Ответы [ 2 ]

1 голос
/ 20 июня 2020

Если вы хотите установить отступ для виджета «Столбец», сделайте это следующим образом. 

Padding(
    padding: EdgeInsets.fromLTRB(10, 0, 10, 20),
    child: Column(
        children: <Widget>[
            Text('quotes'),
            Text('quotes author')
        ],
    ),
),

вы передали виджет «Заполнение» как дочерний элемент столбца, в результате вы получили пустое поле в качестве родственного элемента текстового виджета.

введите описание изображения здесь

если вы посмотрите документацию или исходный код виджета Padding, вы увидите, что виджет Padding принимает дополнительный дочерний виджет. 

class Padding extends SingleChildRenderObjectWidget {
const Padding({
    Key key,
    @required this.padding,
    Widget child,
}) : assert(padding != null),
    super(key: key, child: child);

final EdgeInsetsGeometry padding;

... // other code omitted
}

поэтому, если вы хотите установить отступ для столбец контейнера, вы должны сделать его дочерним по отношению к виджету Padding.

1 голос
/ 20 июня 2020

Вы делаете это неправильно. Вам нужно обернуть столбец внутри контейнера, а затем добавить поле. 

                Container(
                  margin: EdgeInsets.fromLTRB(10, 0, 10, 20),//Add Margin here
                  child: Column(
                    children: <Widget>[
                      Text(
                        '${e.phrase}',
                        style: TextStyle(color: Colors.white60),
                      ),
                      Divider(
                        height: 5,
                        color: Colors.transparent,
                      ),
                      Text(
                        '${e.author}',
                        style: TextStyle(color: Colors.white60),
                      )
                    ],
                  ),
                ),
...