颤振布局容器边距

Question

我的Flutter布局有问题.

我有一个简单的容器,右边和左边的边距为20.0.在这个容器内,我有另一个容器.

但是这个容器只适合左侧的父容器.我不知道为什么会这样.

这是我的代码:

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      backgroundColor: Colors.white,
      body: new Container(
        margin: new EdgeInsets.symmetric(horizontal: 20.0),
        child: new Container(

        )
      ),
    );
  }

问题的截图

Answer 1

你可以使用左右值:)

@override
      Widget build(BuildContext context) {
        return new Scaffold(
          backgroundColor: Colors.white,
          body: new Container(
           margin: const EdgeInsets.only(left: 20.0, right: 20.0),
            child: new Container(

            )
          ),
    );
  }

Answer 2

您可以尝试：到任意一条边的边距

new Container(
    margin: const EdgeInsets.only(left: 20.0, right: 20.0),
    child: new Container()
)

您可以尝试：到任何所有边缘的边距

new Container(
    margin: const EdgeInsets.all(20.0),
    child: new Container()
)

如果您需要当前系统填充或小部件上下文中的视图插入，请考虑使用 [MediaQuery.of] 获取这些值，而不是使用来自 [dart:ui.window] 的值，以便您收到更改通知。

new Container(
    margin: EdgeInsets.fromWindowPadding(padding, devicePixelRatio),
    child: new Container()
)

Answer 3

Container(
  margin: EdgeInsets.all(10) ,
  alignment: Alignment.bottomCenter,
  decoration: BoxDecoration(
    gradient: LinearGradient(
      begin: Alignment.topCenter,
      end: Alignment.bottomCenter,
      colors: <Color>[
        Colors.black.withAlpha(0),
        Colors.black12,
        Colors.black45
      ],
    ),
  ),
  child: Text(
    "Foreground Text",
    style: TextStyle(color: Colors.white, fontSize: 20.0),
  ),
),