Flutter:如何使Container的宽度等于Stackview的宽度?

时间:2019-05-16 07:09:42

标签: layout flutter stackview

我有一个Container包裹在Stack内。由于Stack具有可变的宽度,因此我想将Container的宽度设置为等于Stack的宽度。

我尝试了下面的代码,但是它不起作用。

     Stack(
      alignment: Alignment.center,
      children: <Widget>[
        new Container(
          child: new CachedNetworkImage(
            fit: BoxFit.fitWidth,
            height: 270.0,
            imageUrl: _imageURL,
            placeholder: (context, url) {
                new CircularProgressIndicator();
            },
        ),

      new Container(
        constraints:  BoxConstraints.expand(height: 270.0), 
        decoration: new BoxDecoration(
          color: Colors.black45
        ),
      ),

控制台日志显示

I/flutter (14660): The following assertion was thrown during performLayout():
I/flutter (14660): BoxConstraints forces an infinite width.
I/flutter (14660): These invalid constraints were provided to RenderDecoratedBox's layout() function by the following
I/flutter (14660): function, which probably computed the invalid constraints in question:
I/flutter (14660):   RenderConstrainedBox.performLayout (package:flutter/src/rendering/proxy_box.dart:259:13)
I/flutter (14660): The offending constraints were:
I/flutter (14660):   BoxConstraints(w=Infinity, h=148.1)

仅当我在这样的代码中给出确定的宽度和高度时,容器才会显示。

Stack(
      alignment: Alignment.center,
      children: <Widget>[
        new Container(
          child: new CachedNetworkImage(
            fit: BoxFit.fitWidth,
            height: 270.0,
            imageUrl: _imageURL,
            placeholder: (context, url) {
                new CircularProgressIndicator();
            },
        ),

      new Container(
        width: 100.0,
        height: 100.0,
        decoration: new BoxDecoration(
          color: Colors.black45
        ),
      ),

1 个答案:

答案 0 :(得分:1)

只需将StackFit.expand设置为fit的{​​{1}}属性:

Stack